[frio] Restore focus styles

- Replace .btn-main by .btn-primary
- Harmonize focus styles between buttons and form controls based on the theme scheme
This commit is contained in:
Hypolite Petovan 2020-04-27 09:43:46 -04:00
parent 1b0a8ec5c0
commit 50622d27d1
3 changed files with 18 additions and 48 deletions

View file

@ -56,13 +56,13 @@ body a[name]:not([href]) {
visibility: hidden; visibility: hidden;
} }
body a:hover, .btn-link:hover, .btn:hover, body a:hover, .btn-link:hover,
body a:focus, .btn-link:focus, .btn:focus, body a:focus, .btn-link:focus,
body a:active, .btn-link:active, .btn:active, body a:active, .btn-link:active,
body a.active, .btn-link.active, .btn.active { body a.active, .btn-link.active {
color: $link_hover_color; color: $link_hover_color;
outline-color: $link_hover_color;;
text-decoration: none; text-decoration: none;
outline: none;
} }
.wall-item-container a:hover { .wall-item-container a:hover {
@ -197,8 +197,8 @@ blockquote {
padding: 8px 16px; padding: 8px 16px;
color: inherit; color: inherit;
} }
a.btn:hover { .btn:focus {
color: #333; outline-color: $link_hover_color;
} }
.btn-default { .btn-default {
@ -219,17 +219,17 @@ a.btn:hover {
padding: 1px 5px; padding: 1px 5px;
font-size: 12px; font-size: 12px;
} }
.btn-primary { .btn.btn-primary {
background: $nav_bg !important; background: $nav_bg;
color: $btn_primary_color !important; color: $btn_primary_color;
} }
.btn-primary:hover, .btn-primary:focus { .btn.btn-primary:hover, .btn.btn-primary:focus {
color: $btn_primary_color;
background: $btn_primary_hover_color; background: $btn_primary_hover_color;
text-decoration: none; text-decoration: none;
} }
.btn-primary:active, .btn-primary.active { .btn.btn-primary:active, .btn.btn-primary.active {
outline: 0; background: $btn_primary_hover_color;
background: $btn_primary_hover_color !important;
} }
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover,
@ -262,31 +262,7 @@ a.btn:hover {
.btn-separator { .btn-separator {
border-left: 1px solid #777; border-left: 1px solid #777;
} }
/*.btn-info {
background: #6fdbe8;
color: #fff!important;
}
.btn-info:hover, .btn-info:focus {
background: #59d6e4!important;
text-decoration: none;
}
.btn-info:active, .btn-info.active {
outline: 0;
background: #59d6e4;
}*/
.btn-main {
background: $link_color;
color: #fff!important;
}
.btn-main:hover, .btn-main:focus {
background: $link_hover_color !important;
text-decoration: none;
}
.btn-main:active, .btn-main.active {
outline: 0;
background: $link_hover_color;
}
.toggle.btn { .toggle.btn {
border: 1px solid transparent; border: 1px solid transparent;
} }
@ -2202,19 +2178,13 @@ ul.dropdown-menu li:hover {
box-shadow: none; box-shadow: none;
} }
.form-control:focus { .form-control:focus {
/*border: 2px solid #6fdbe8;*/
border: 2px solid $link_color; border: 2px solid $link_color;
outline: 0;
box-shadow: none; box-shadow: none;
} }
.checkbox input[type="checkbox"]:focus + label::before, .checkbox input[type="checkbox"]:focus + label::before,
.checkbox input[type="radio"]:focus + label::before { .radio input[type="radio"]:focus + label::before {
/*border: 2px solid #6fdbe8;*/ outline-color: $link_hover_color;
border: 2px solid $link_color;
outline: 0;
box-shadow: none;
} }
/* Search form */ /* Search form */

View file

@ -1,5 +1,5 @@
{{* The button to open the jot - in This theme we move the button with js to the second nav bar *}} {{* The button to open the jot - in This theme we move the button with js to the second nav bar *}}
<a class="btn btn-sm btn-main pull-right" id="jotOpen" href="compose/{{$posttype}}{{if $content}}?body={{$content}}{{/if}}" aria-label="{{$new_post}}" title="{{$new_post}}"><i class="fa fa-pencil-square-o fa-2x"></i></a> <a class="btn btn-sm btn-primary pull-right" id="jotOpen" href="compose/{{$posttype}}{{if $content}}?body={{$content}}{{/if}}" aria-label="{{$new_post}}" title="{{$new_post}}"><i class="fa fa-pencil-square-o fa-2x"></i></a>
<div id="jot-content"> <div id="jot-content">
<div id="jot-sections"> <div id="jot-sections">

View file

@ -46,7 +46,7 @@ Some parts of this template will be moved by js to other places (see theme.js) -
</div> </div>
{{if $s}} {{if $s}}
<a href="search/saved/add?term={{$q}}&amp;return_url={{$return_url}}" class="btn btn-sm btn-main pull-right" id="search-save" title="{{$save_label}}" aria-label="{{$save_label}}" value="{{$save_label}}" data-toggle="tooltip"> <a href="search/saved/add?term={{$q}}&amp;return_url={{$return_url}}" class="btn btn-sm btn-primary pull-right" id="search-save" title="{{$save_label}}" aria-label="{{$save_label}}" value="{{$save_label}}" data-toggle="tooltip">
{{if $mode == "tag"}} {{if $mode == "tag"}}
<i class="fa fa-plus fa-2x" aria-hidden="true"></i> <i class="fa fa-plus fa-2x" aria-hidden="true"></i>
{{else}} {{else}}