yogsototh/brutcss
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

mess with colors

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2022-10-09 11:20:23 +02:00
parent 208f4da683
commit f8afbff5d1
Signed by untrusted user who does not match committer: yogsototh
GPG key ID: 7B19A4C650D59646
3 changed files with 27 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
brut.min.css vendored
View file

File diff suppressed because one or more lines are too long

26
src/buttons.less
View file

@ -1,4 +1,4 @@
.tb, .btn { text-decoration: none; display: inline-block; }
.tb, .btn { text-decoration: none; display: inline-block; text-align: center;}
.tb { font-weight: bold;
cursor: pointer;
padding: 2px; }
@ -9,6 +9,13 @@
.tb:hover::before,.tb:hover::after { opacity: 1; }
.tb:active:before { content: "❰"; }
.tb:active:after { content: "❱"; }
.tb {
&.info { color: var(--fg); background: var(--bg2); }
&.ok { color: var(--fg); background: var(--nl); }
&.warn { background: var(--n0); color: var(--bg); }
&.err { background: var(--n2); color: var(--bg); }
&.fatal { background: var(--fg); color: var(--bg); }
}
.btn {
background: var(--n0);
@ -20,14 +27,28 @@
margin: 0 4px 4px 0;
padding: 1rem 2rem;
box-shadow: 4px 4px var(--shadow);
text-align: center;
vertical-align: bottom;
}
.btn {
&.info { color: var(--fg); background: var(--bg2); }
&.ok { color: var(--fg); background: var(--nl); }
&.warn { background: var(--n0); color: var(--bg); }
&.err { background: var(--n2); color: var(--bg); }
&.fatal { background: var(--fg); color: var(--bg); }
}
.btn:hover {
background: var(--n1);
color: #fff;
}
.btn {
&.err, &.fatal {
&:hover,&:active,&:focus {
background: var(--fg);
}
}
}
.btn:active,.btn:focus {
color: #fff;
@ -42,3 +63,4 @@
.btn.std { width: 12rem; }
.btn.big.std { width: 20rem; }
.btn.huge.std { width: 24rem; }

4
src/general.less
View file

@ -46,8 +46,8 @@ ol {
ul > li::marker { font-size: 1.5rem; }
.sm { font-size: 0.75rem; }
.big { font-size: 2rem; line-height: 3rem;}
.huge { font-size: 3rem; line-height: 4.5rem;}
.big { font-size: 2rem; line-height: 3.5rem;}
.huge { font-size: 3rem; line-height: 5.5rem;}
/* highligh revert the colors */
.hl { background: var(--fg); color: var(--bg); }
/* doc are for long text to read */