Skip to content

Commit

Permalink
Prettified gui for settings
Browse files Browse the repository at this point in the history
  • Loading branch information
@oliverschwendener
oliverschwendener committed Sep 23, 2018
1 parent 667fd13 commit 274dc0e
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 16 deletions.
32 changes: 16 additions & 16 deletions main.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ <h1>User Settings</h1>
<th>Name</th>
<th>ExecutionArgument</th>
<th>Prefix</th>
<th>Icon</th>
<th class="text-center">Icon</th>
<th class="text-center">+/-</th>
</tr>
</thead>
Expand All @@ -164,7 +164,7 @@ <h1>User Settings</h1>
<td><input disabled class="setting-text-input" type="text" v-model="customCommand.name"></td>
<td><input disabled class="setting-text-input" type="text" v-model="customCommand.executionArgument"></td>
<td><input disabled class="setting-text-input" type="text" v-model="customCommand.prefix"></td>
<td><input disabled class="setting-text-input" type="text" v-model="customCommand.icon"></td>
<td class="text-center" v-html="customCommand.icon"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionRemoveCustomCommand(customCommand)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 26 26" version="1.1">
<g id="surface1">
Expand All @@ -177,7 +177,7 @@ <h1>User Settings</h1>
<td><input class="setting-text-input" v-model="configEdit.newCustomCommand.name" type="text"></td>
<td><input class="setting-text-input" v-model="configEdit.newCustomCommand.executionArgument" type="text"></td>
<td><input class="setting-text-input" v-model="configEdit.newCustomCommand.prefix" type="text"></td>
<td><input class="setting-text-input" v-model="configEdit.newCustomCommand.icon" type="text"></td>
<td class="slim"><input class="setting-text-input" v-model="configEdit.newCustomCommand.icon" type="text"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionAddCustomCommand(configEdit.newCustomCommand)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
<path d="M13.5,3.188C7.805,3.188,3.188,7.805,3.188,13.5S7.805,23.813,13.5,23.813S23.813,19.195,23.813,13.5 S19.195,3.188,13.5,3.188z M19,15h-4v4h-3v-4H8v-3h4V8h3v4h4V15z"></path>
Expand Down Expand Up @@ -223,7 +223,7 @@ <h1>User Settings</h1>
<tbody>
<tr v-for="fileSearchOption in config.fileSearchOptions">
<td><input disabled class="setting-text-input" type="text" v-model="fileSearchOption.folderPath"></td>
<td class="text-center"><input disabled type="checkbox" v-model="fileSearchOption.recursive"></td>
<td class="text-center slim"><input disabled type="checkbox" v-model="fileSearchOption.recursive"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionRemoveFileSearchOption(fileSearchOption)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 26 26" version="1.1">
<g id="surface1">
Expand Down Expand Up @@ -313,15 +313,15 @@ <h1>User Settings</h1>
<tr>
<th>Name</th>
<th>Execution argument</th>
<th>Icon</th>
<th class="text-center">Icon</th>
<th class="text-center">+/-</th>
</tr>
</thead>
<tbody>
<tr v-for="shortcut in config.shortcuts">
<td><input disabled class="setting-text-input" type="text" v-model="shortcut.name"></td>
<td><input disabled class="setting-text-input" type="text" v-model="shortcut.executionArgument"></td>
<td><input disabled class="setting-text-input" type="text" v-model="shortcut.icon"></td>
<td class="text-center" v-html="shortcut.icon"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionRemoveShortcut(shortcut)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 26 26" version="1.1">
<g id="surface1">
Expand All @@ -333,7 +333,7 @@ <h1>User Settings</h1>
<tr>
<td><input class="setting-text-input" type="text" v-model="configEdit.newShortcut.name"></td>
<td><input class="setting-text-input" type="text" v-model="configEdit.newShortcut.executionArgument"></td>
<td><input class="setting-text-input" type="text" v-model="configEdit.newShortcut.icon"></td>
<td class="slim"><input class="setting-text-input" type="text" v-model="configEdit.newShortcut.icon"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionAddShortcut(configEdit.newShortcut)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
<path d="M13.5,3.188C7.805,3.188,3.188,7.805,3.188,13.5S7.805,23.813,13.5,23.813S23.813,19.195,23.813,13.5 S19.195,3.188,13.5,3.188z M19,15h-4v4h-3v-4H8v-3h4V8h3v4h4V15z"></path>
Expand Down Expand Up @@ -371,16 +371,16 @@ <h1>User Settings</h1>
<th>Name</th>
<th>Prefix</th>
<th>Url</th>
<th>Icon</th>
<th class="text-center">Icon</th>
<th class="text-center">+/-</th>
</tr>
</thead>
<tbody>
<tr v-for="webSearch in config.webSearches">
<td><input disabled class="setting-text-input small" type="text" v-model="webSearch.name"></td>
<td><input disabled class="setting-text-input small" type="text" v-model="webSearch.prefix"></td>
<td><input disabled class="setting-text-input small" type="text" v-model="webSearch.url"></td>
<td><input disabled class="setting-text-input small" type="text" v-model="webSearch.icon"></td>
<td><input disabled class="setting-text-input" type="text" v-model="webSearch.name"></td>
<td><input disabled class="setting-text-input" type="text" v-model="webSearch.prefix"></td>
<td><input disabled class="setting-text-input" type="text" v-model="webSearch.url"></td>
<td class="text-center" v-html="webSearch.icon"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionRemoveWebSearch(webSearch)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 26 26" version="1.1">
<g id="surface1">
Expand All @@ -390,10 +390,10 @@ <h1>User Settings</h1>
</td>
</tr>
<tr>
<td><input type="text" class="setting-text-input small" v-model="configEdit.newWebSearch.name"></td>
<td><input type="text" class="setting-text-input small" v-model="configEdit.newWebSearch.prefix"></td>
<td><input type="text" class="setting-text-input small" v-model="configEdit.newWebSearch.url"></td>
<td><input type="text" class="setting-text-input small" v-model="configEdit.newWebSearch.icon"></td>
<td><input type="text" class="setting-text-input" v-model="configEdit.newWebSearch.name"></td>
<td><input type="text" class="setting-text-input" v-model="configEdit.newWebSearch.prefix"></td>
<td><input type="text" class="setting-text-input" v-model="configEdit.newWebSearch.url"></td>
<td class="slim"><input type="text" class="setting-text-input" v-model="configEdit.newWebSearch.icon"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionAddWebSearch(configEdit.newWebSearch)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
<path d="M13.5,3.188C7.805,3.188,3.188,7.805,3.188,13.5S7.805,23.813,13.5,23.813S23.813,19.195,23.813,13.5 S19.195,3.188,13.5,3.188z M19,15h-4v4h-3v-4H8v-3h4V8h3v4h4V15z"></path>
Expand Down
10 changes: 10 additions & 0 deletions styles/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -221,6 +221,16 @@ table.setting-table {
width: 100%;
}

td.slim {
width: 50px;
}

td > svg {
fill: var(--text-color);
height: 25px;
width: 25px;
}

.text-center {
text-align: center;
}
Expand Down

0 comments on commit 274dc0e

Please sign in to comment.