github-mirror/fish-shell
2
0
Fork 0
mirror of https://github.com/fish-shell/fish-shell.git synced 2024-11-24 19:51:00 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Tweak the styling of the abbreviation editor

Browse Source 
Removes the big white block of the input fields.
This commit is contained in:
ridiculousfish 2015-06-13 22:56:45 -07:00
parent 5c6143d8e9
commit 7b34aaa432
2 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
share/tools/web_config/fishconfig.css
View File

@ -29,6 +29,8 @@ body {
border-right: none;
padding-bottom: 15px;
padding-top: 15px;
padding-left: 8px;
padding-right: 8px;
font-size: 17pt;
text-align: center;
width: 15%;
@ -232,12 +234,22 @@ body {
border-bottom: #444 dotted 1px;
}
.abbreviation_actions {
width: 5em;
.abbreviation_actions {
width: 8em;
text-align: right;
border-bottom: #444 dotted 1px;
}
.abbreviation_input {
background-color: #111;
border: solid 1px #777;
height: 1.5em;
color: white;
font: inherit;
padding: 3px;
margin: 0;
}
/* The CSS we apply when a table row is filtered */
.data_table_row_filtered {
display: none;

10
share/tools/web_config/partials/abbreviations.html
View File

@ -5,17 +5,17 @@
<table class="data_table">
<tbody>
<tr class="data_table_row" ng-repeat="abbreviation in abbreviations | filterAbbreviations:query" ng-click="editAbbreviation(abbreviation)">
<td ng-class="{ data_table_cell: true }" style="text-align: right; padding-right: 30px;">
<td ng-class="{ data_table_cell: true }" style="text-align: right; padding-right: 30px;">
<span ng-hide="abbreviation.editable">{{ abbreviation.word }}</span>
<span ng-show="abbreviation.editable"><input ng-model="abbreviation.word"></span>
<span ng-show="abbreviation.editable"><input ng-model="abbreviation.word" class="abbreviation_input" style="text-align: right; min-width: 10em;"></span>
</td>
<td ng-class="{ data_table_cell: true }" style="text-align: left; padding-right: 30px;">
<span ng-hide="abbreviation.editable">{{ abbreviation.phrase }}</span>
<span ng-show="abbreviation.editable"><input ng-model="abbreviation.phrase"></span>
<span ng-show="abbreviation.editable"><input ng-model="abbreviation.phrase" class="abbreviation_input" style="text-align: left; min-width: 22em;"></span>
</td>
<td ng-class="{ data_table_cell: true }" class="abbreviation_actions">
<span ng-show="abbreviation.editable && abbreviation.word && abbreviation.phrase" ng-click="saveAbbreviation(abbreviation)">Save</span>
<a ng-show="abbreviation.word" ng-click="removeAbbreviation(abbreviation)"><img alt="Delete" src="delete.png"></a>
<span ng-show="abbreviation.editable && abbreviation.word && abbreviation.phrase" ng-click="saveAbbreviation(abbreviation)"><span class="save_button" style="margin: inherit;">Save</span></span>
<a ng-show="abbreviation.word" ng-click="removeAbbreviation(abbreviation)"><img alt="Delete" src="delete.png" style="vertical-align: text-bottom"></a>
</td>
</tr>
</tbody>