mirror of
https://github.com/lrsjng/h5ai.git
synced 2025-06-07 02:01:14 -04:00
Update layout.
This commit is contained in:
parent
707ae0547a
commit
c7c080d029
4 changed files with 33 additions and 26 deletions
|
@ -28,3 +28,7 @@ trim_trailing_whitespace = false
|
||||||
|
|
||||||
[*.jade]
|
[*.jade]
|
||||||
trim_trailing_whitespace = false
|
trim_trailing_whitespace = false
|
||||||
|
|
||||||
|
|
||||||
|
[*.svg]
|
||||||
|
insert_final_newline = false
|
||||||
|
|
|
@ -9,13 +9,26 @@
|
||||||
// @col-dark: #333;
|
// @col-dark: #333;
|
||||||
@col-dark: #212121;
|
@col-dark: #212121;
|
||||||
|
|
||||||
|
@col-text-primary-black: rgba(0,0,0,0.87);
|
||||||
|
@col-text-secondary-black: rgba(0,0,0,0.54);
|
||||||
|
@col-text-disabled-black: rgba(0,0,0,0.26);
|
||||||
|
@col-divider-black: rgba(0,0,0,0.12);
|
||||||
|
|
||||||
|
@col-text-primary-white: rgba(255,255,255,1.0);
|
||||||
|
@col-text-secondary-white: rgba(255,255,255,0.7);
|
||||||
|
@col-text-disabled-white: rgba(255,255,255,0.3);
|
||||||
|
@col-divider-white: rgba(255,255,255,0.12);
|
||||||
|
|
||||||
|
@col-text-selected: @col-text-primary-white;
|
||||||
|
@col-back-selected: @col-blue;
|
||||||
|
|
||||||
@col-font-light: @col-light;
|
@col-font-light: @col-light;
|
||||||
@col-font-dark: @col-dark;
|
@col-font-dark: @col-dark;
|
||||||
|
|
||||||
@col-back-light: @col-lightgray;
|
@col-back-light: @col-lightgray;
|
||||||
@col-back-dark: @col-darkgray;
|
@col-back-dark: @col-darkgray;
|
||||||
|
|
||||||
@col: @col-dark;
|
@col: @col-text-primary-black;
|
||||||
@col-back: @col-back-dark;
|
@col-back: @col-back-dark;
|
||||||
@col-hover: @col-blue;
|
@col-hover: @col-blue;
|
||||||
@col-border: rgba(0,0,0,0.05);
|
@col-border: rgba(0,0,0,0.05);
|
||||||
|
@ -50,8 +63,8 @@
|
||||||
@font-family-mono: monospace;
|
@font-family-mono: monospace;
|
||||||
|
|
||||||
|
|
||||||
::-moz-selection { background: @col-blue; color: @col-font-light; text-shadow: none; }
|
::-moz-selection { background: @col-blue; color: @col-text-primary-white; text-shadow: none; }
|
||||||
::selection { background: @col-blue; color: @col-font-light; text-shadow: none; }
|
::selection { background: @col-blue; color: @col-text-primary-white; text-shadow: none; }
|
||||||
|
|
||||||
.transition (@transition) {
|
.transition (@transition) {
|
||||||
-webkit-transition: @transition;
|
-webkit-transition: @transition;
|
||||||
|
@ -82,7 +95,7 @@
|
||||||
.card();
|
.card();
|
||||||
.rounded();
|
.rounded();
|
||||||
.transition(all 0.2s ease-in-out);
|
.transition(all 0.2s ease-in-out);
|
||||||
color: @col-light;
|
color: @col-text-primary-white;
|
||||||
background: @col-blue;
|
background: @col-blue;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -101,7 +114,7 @@
|
||||||
-webkit-appearance: none;
|
-webkit-appearance: none;
|
||||||
font-family: @font-family;
|
font-family: @font-family;
|
||||||
font-weight: @font-weight;
|
font-weight: @font-weight;
|
||||||
color: @col-dark;
|
color: @col-text-primary-black;
|
||||||
background: @col-light;
|
background: @col-light;
|
||||||
border: none;
|
border: none;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
@ -130,7 +143,7 @@ body {
|
||||||
font-family: @font-family;
|
font-family: @font-family;
|
||||||
font-size: @font-size;
|
font-size: @font-size;
|
||||||
font-weight: @font-weight;
|
font-weight: @font-weight;
|
||||||
color: @col;
|
color: @col-text-primary-black;
|
||||||
background: @col-back;
|
background: @col-back;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -4,7 +4,7 @@ body#h5ai-info {
|
||||||
#content {
|
#content {
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
order: 50;
|
order: 50;
|
||||||
color: @col;
|
color: @col-text-primary-black;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
@ -24,7 +24,7 @@ body#h5ai-info {
|
||||||
font-size: 4em;
|
font-size: 4em;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
margin: 0.8em 0 0 0;
|
margin: 0.8em 0 0 0;
|
||||||
color: @col;
|
color: @col-text-primary-black;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
.transition(all 0.2s ease-in-out);
|
.transition(all 0.2s ease-in-out);
|
||||||
|
|
||||||
|
|
|
@ -1,12 +1,4 @@
|
||||||
|
|
||||||
@item-col-hover: @col-hover;
|
|
||||||
@item-background-col-hover: #fafafa;
|
|
||||||
@item-border-col-hover: @col-border;
|
|
||||||
|
|
||||||
@item-col-sel: #fff;
|
|
||||||
@item-background-col-sel: #42a5f5;
|
|
||||||
|
|
||||||
|
|
||||||
#selection-rect {
|
#selection-rect {
|
||||||
display: none;
|
display: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -44,24 +36,22 @@
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: @item-col-hover;
|
color: @col-hover;
|
||||||
background: @item-background-col-hover;
|
background: @col-lightgray;
|
||||||
border-color: @item-border-col-hover;
|
border-color: @col-border;
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
.selector {
|
.selector {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.selected:not(.selecting), &.selecting:not(.selected) {
|
&.selected:not(.selecting), &.selecting:not(.selected) {
|
||||||
color: @item-col-sel;
|
color: @col-text-selected;
|
||||||
background: @item-background-col-sel;
|
background: @col-back-selected;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: @item-col-sel;
|
color: @col-text-selected;
|
||||||
background: @item-background-col-sel;
|
background: @col-back-selected;
|
||||||
}
|
}
|
||||||
|
|
||||||
.selector {
|
.selector {
|
||||||
|
@ -137,7 +127,7 @@
|
||||||
display: none;
|
display: none;
|
||||||
margin-top: 36px;
|
margin-top: 36px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #ddd;
|
color: @col-border;
|
||||||
font-size: 5em;
|
font-size: 5em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue