Some small UI design improvements

This commit is contained in:
djmaze 2021-08-27 09:59:13 +02:00
parent c8678953fe
commit 202fac8295
6 changed files with 85 additions and 76 deletions

View file

@ -91,21 +91,24 @@ textarea + .settings-save-trigger {
// Actual tabs
.tabs label {
grid-row-start: 1;
color: #555;
margin: 0 2px -1px 0;
line-height: @baseLineHeight;
border: 1px solid transparent;
border-radius: 4px 4px 0 0;
cursor: pointer;
grid-row-start: 1;
line-height: @baseLineHeight;
opacity: 0.6;
margin: 0 2px -1px 0;
padding: 5px;
text-align: center;
&:hover {
border-color: @grayLighter @grayLighter #ddd;
border-color: @grayLighter;
opacity: 0.8;
}
}
.tabs [id^="tab"]:checked + label {
color: @gray;
background-color: @white;
border-color: #ddd #ddd transparent #ddd;
opacity: 1;
z-index: 1;
}

View file

@ -194,11 +194,13 @@
<i class="fontastic"></i>
<span data-i18n="POPUPS_DOMAIN/BUTTON_CLOSE"></span>
</a>
<a class="btn buttonClear" data-bind="command: createOrAddCommand">
<i class="fontastic" data-bind="text: edit() ? '✔' : '✚', visible: !saving()"></i>
<i class="icon-spinner" data-bind="visible: saving"></i>
<span data-bind="visible: !edit()" data-i18n="POPUPS_DOMAIN/BUTTON_ADD"></span>
<span data-bind="visible: edit()" data-i18n="POPUPS_DOMAIN/BUTTON_UPDATE"></span>
<a class="btn" data-bind="command: createOrAddCommand, visible: edit()">
<i class="fontastic" data-bind="css: {'icon-spinner': saving()}"></i>
<span data-i18n="POPUPS_DOMAIN/BUTTON_UPDATE"></span>
</a>
<a class="btn" data-bind="command: createOrAddCommand, visible: !edit()">
<i class="fontastic" data-bind="css: {'icon-spinner': saving()}"></i>
<span data-i18n="POPUPS_DOMAIN/BUTTON_ADD"></span>
</a>
</div>
</div>

View file

@ -40,7 +40,7 @@
<i class="fontastic"></i>
<span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_CLOSE"></span>
</a>
<a class="btn buttonClear" data-bind="command: createCommand">
<a class="btn" data-bind="command: createCommand">
<i class="fontastic" data-bind="visible: !saving()"></i>
<i class="icon-spinner" data-bind="visible: saving"></i>
<span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_ADD"></span>

View file

@ -25,7 +25,7 @@
<i class="fontastic"></i>
<span data-i18n="POPUPS_PLUGIN/BUTTON_CLOSE"></span>
</a>
<a class="btn buttonClear" data-bind="command: saveCommand, visible: hasConfiguration">
<a class="btn" data-bind="command: saveCommand, visible: hasConfiguration">
<i class="fontastic"></i>
<span data-i18n="POPUPS_PLUGIN/BUTTON_SAVE"></span>
</a>

View file

@ -19,7 +19,7 @@
</div>
</div>
<div class="modal-footer">
<a class="btn btn-danger buttonClear" data-bind="command: clearCommand">
<a class="btn btn-danger" data-bind="command: clearCommand">
<i class="fontastic" data-bind="css: {'icon-spinner white': clearingProcess()}">🔥</i>
<span data-i18n="GLOBAL/CLEAR"></span>
</a>

View file

@ -143,3 +143,7 @@
.b-folders li a.focused {
background-color: #111;
}
.tabs [id^="tab"]:checked + label {
color: #000;
}