extern/nightTab
1
0
Fork 0
mirror of https://github.com/zombieFox/nightTab.git synced 2025-06-26 04:21:38 +02:00
Code Issues Packages Projects Releases Wiki Activity

[design] improve search input padding

Browse Source
This commit is contained in:
zombieFox 2019-04-04 16:52:29 +01:00
parent 9d49d51268
commit a342f44402
5 changed files with 8 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
css/form.css
View File

@ -14,13 +14,11 @@ input[type="text"] {
height: 2.5em; height: 2.5em;
width: 100%; width: 100%;
border-width: 0; border-width: 0;
/* border-top-width: var(--line-width); */
/* border-bottom-width: var(--line-width); */
border-style: solid; border-style: solid;
border-color: transparent; border-color: transparent;
border-radius: var(--radius); border-radius: var(--radius);
cursor: text; cursor: text;
transition: all var(--animation-speed-fast) ease-in-out; transition: background-color var(--animation-speed-fast) ease-in-out, color var(--animation-speed-fast) ease-in-out, border-color var(--animation-speed-fast) ease-in-out, box-shadow var(--animation-speed-fast) ease-in-out;
-moz-appearance: textfield; -moz-appearance: textfield;
} }
@ -31,7 +29,6 @@ input[type="search"]:hover,
input[type="tel"]:hover, input[type="tel"]:hover,
input[type="text"]:hover { input[type="text"]:hover {
background-color: rgb(var(--gray-03)); background-color: rgb(var(--gray-03));
/* border-bottom-color: rgb(var(--gray-08)); */
color: rgb(var(--form-input-text-hover)); color: rgb(var(--form-input-text-hover));
outline: none; outline: none;
box-shadow: 0 0 0 var(--line-width) rgb(var(--gray-06)); box-shadow: 0 0 0 var(--line-width) rgb(var(--gray-06));
@ -44,8 +41,6 @@ input[type="search"]:focus,
input[type="tel"]:focus, input[type="tel"]:focus,
input[type="text"]:focus { input[type="text"]:focus {
background-color: rgb(var(--gray-02)); background-color: rgb(var(--gray-02));
/* border-bottom-color: rgb(var(--accent)); */
/* border-color: transparent; */
color: rgb(var(--form-input-text-focus)); color: rgb(var(--form-input-text-focus));
outline: none; outline: none;
z-index: 2; z-index: 2;
@ -62,7 +57,7 @@ input[type="text"][disabled] {
padding: 0 calc(1em - var(--line-width)); padding: 0 calc(1em - var(--line-width));
color: rgb(var(--form-input-text-disabled)); color: rgb(var(--form-input-text-disabled));
border-width: var(--line-width); border-width: var(--line-width);
border-color: rgb(var(--form-input-text-disabled));; border-color: rgb(var(--form-input-text-disabled));
cursor: default; cursor: default;
box-shadow: none; box-shadow: none;
} }

5
css/header.css
View File

@ -71,8 +71,8 @@
position: relative; position: relative;
} }
.header-search-input[type="text"] { .is-header-searching .header-search-input[type="text"] {
padding-right: 3em; padding-right: 3.5em;
} }
.header-search-clear { .header-search-clear {
@ -93,7 +93,6 @@
justify-content: flex-end; justify-content: flex-end;
} }
.is-layout-width-thin.is-header-search-grow .header-search,
.is-header-search-grow .header-search { .is-header-search-grow .header-search {
flex-grow: 1; flex-grow: 1;
flex-basis: 100%; flex-basis: 100%;

4
css/link.css
View File

@ -31,10 +31,6 @@
grid-template-columns: repeat(auto-fill, minmax(16em, 1fr)); grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));
} }
.is-layout-width-thin.is-bookmarks-style-list .link-area {
grid-template-columns: 1fr;
}
.link-item { .link-item {
width: 100%; width: 100%;
height: var(--link-height); height: var(--link-height);

3
js/search.js
View File

@ -17,18 +17,21 @@ var search = (function() {
}; };
var _toggle = function(input) { var _toggle = function(input) {
var html = helper.e("html");
if (input.value != "") { if (input.value != "") {
helper.setObject({ helper.setObject({
object: state.get(), object: state.get(),
path: "search", path: "search",
newValue: true newValue: true
}); });
helper.addClass(html, "is-header-searching");
} else { } else {
helper.setObject({ helper.setObject({
object: state.get(), object: state.get(),
path: "search", path: "search",
newValue: false newValue: false
}); });
helper.removeClass(html, "is-header-searching");
}; };
}; };

2
js/version.js
View File

@ -1,7 +1,7 @@
var version = (function() { var version = (function() {
// version is normally bumped when the state needs changing or any new functionality is added // version is normally bumped when the state needs changing or any new functionality is added
var current = "2.17.0"; var current = "2.18.0";
var compare = function(a, b) { var compare = function(a, b) {
var pa = a.split("."); var pa = a.split(".");