shorter color names
This commit is contained in:
parent
c400c36ccf
commit
12170f9792
9 changed files with 135 additions and 135 deletions
2
brut-nocolors.min.css
vendored
2
brut-nocolors.min.css
vendored
|
@ -1 +1 @@
|
||||||
:root{--bg:#fff;--fg:#000;--bg2:#eee;--darken:rgba(0, 0, 0, 0.1);--cn-1:#d9d9d9;--cn0:#999;--cn1:#8c8c8c;--cn2:#808080;--shadow:rgba(0, 0, 0, 0.75);--cnt:#fff;--cna:#333;--cnab:#000}@media(prefers-color-scheme:dark){:root{--bg:#000;--fg:#ccc;--bg2:#333;--darken:rgba(255, 255, 255, 0.1);--cn-1:#666666;--cn0:#808080;--cn1:#8c8c8c;--cn2:#999999;--shadow:rgba(128, 128, 128, 0.3);--cnt:#000;--cna:#eee;--cnab:#fff}}.neutral{color:var(--cn-0)}.bg-neutral{background:var(--cn-1)}a{color:var(--fg)}html{font-size:12px}body,textarea,input,select{background:var(--bg);color:var(--fg);border-radius:0;font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,serif;font-size:1rem;margin:0}*{box-sizing:border-box}.addon,.sm,.nav,textarea,input,select{outline:0;font-size:10px}.tb,.btn,.nav a{text-decoration:none}.container{padding:0 20px;width:auto}@media(min-width:1310px){.container{margin:auto;width:1270px}}pre{background:var(--bg2);padding:10px}code{background:var(--darken);border:solid 1px var(--darken);padding:1px}img{max-width:100%}.big{font-size:2em}.huge{font-size:3em}.tb{font-weight:700;cursor:pointer;padding:2px}.tb:before,.tb:after{opacity:.3;display:inline-block}.tb:before{content:"〈"}.tb:after{content:"〉"}.tb:hover{text-decoration:underline}.tb:hover::before,.tb:hover::after{opacity:1}.tb:active:before{content:"《"}.tb:active:after{content:"》"}.btn{background:var(--cn0);border:solid 2px #000;color:#fff;font-weight:700;cursor:pointer;display:inline-block;margin:2px 0;padding:1rem 2rem;box-shadow:4px 4px var(--shadow);text-align:center}.btn:hover{background:var(--cn1);color:#fff}.btn:active,.btn:focus{color:#fff;background:var(--cn2);box-shadow:1px 1px #000;position:relative;top:3px;left:3px}.btn.sm{padding:.5rem 1rem}.btn.std{width:12rem}.btn.big.std{width:20rem}.btn.huge.std{width:24rem}.row{display:flex;justify-content:space-evenly;align-items:stretch;flex-wrap:wrap}.col{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:wrap}.col>*,.row>*{padding:5px}.col.no-padding>*,.row.no-padding>*{padding:0}.table,.c12{width:100%}.c11{width:91.66%}.c10{width:83.33%}.c9{width:75%}.c8{width:66.66%}.c7{width:58.33%}.c6{width:50%}.c5{width:41.66%}.c4{width:33.33%}.c3{width:25%}.c2{width:16.66%}.c1{width:8.33%}@media(max-width:870px){.row .col{width:100%}}.card,.block{padding:5px;border:solid 2px;display:flex;flex-direction:column;justify-content:start;align-items:flex-start}.col>.card,.col>.block{height:100%}.row>.card,.row>.block{width:100%}.card{border-color:var(--cn-1)}.block{border-color:transparent}.central{display:flex;align-items:center;justify-content:center;background-size:cover;min-height:100vh}button~.central{min-height:calc(100vh - 50px)}.hero{padding:2rem;outline-style:double;outline-width:.5rem;margin:1rem}.push{justify-self:flex-end;margin-top:auto}h1,h2,h3,h4,h5,h6{display:table;padding:.25rem;font-size:1rem}h1{font-size:2rem}h1:before,h2:before,h3:before,h4:before,h5:before,h6:before{opacity:.3;font-size:1rem}h1:before{content:"# "}h2:before{content:"## "}h3:before{content:"### "}h4:before{content:"#### "}h5:before{content:"##### "}h6:before{content:"###### "}.ico{font:20px Arial Unicode MS,Lucida Sans Unicode;line-height:10px;vertical-align:top}label>*{display:inline}form>*{display:block;margin-bottom:10px}textarea,input,select{border:2px solid;padding:8px}textarea,input[type=text]{-webkit-appearance:none;width:13em;outline:0;border:2px solid}.addon{padding:8px 12px;border-width:2px;border-style:solid none solid solid}textarea:focus,input:focus,select:focus{border-color:var(--ci1)}.nav,.nav .current,.nav a:hover{background:#000;color:#fff}.nav{height:50px;padding:11px 0 15px}.nav a{color:#aaa;padding-right:1em;position:relative;top:-1px}.nav .pagename{font-weight:700;font-size:22px;top:1px}.btn.btn-close{background:#000;color:#aaa;float:right;font-size:25px;margin:-54px 7px;display:none}.btn.btn-close:hover{color:#fff}@media(max-width:500px){.btn.btn-close{display:block}.nav{overflow:hidden}.pagename{margin-top:-11px}.nav:active,.nav:focus{height:auto}.nav div:before{background:var(--fg);border-bottom:10px double;border-top:3px solid;content:'';float:right;height:4px;position:relative;right:3px;top:14px;width:20px}.nav a{display:block;padding:.5em 0;width:50%}}.table th,.table td{padding:.5em;text-align:left}.table tbody>:nth-child(2n-1){background:var(--bg2)}.msg{background:var(--cn-1);border-left:5px solid var(--cn0);padding:1.5em}
|
:root{--bg:#fff;--fg:#000;--bg2:#eee;--darken:rgba(0, 0, 0, 0.1);--nl:#d9d9d9;--n0:#999;--n1:#8c8c8c;--n2:#808080;--shadow:rgba(0, 0, 0, 0.75);--cnt:#fff;--na:#333;--nb:#000}@media(prefers-color-scheme:dark){:root{--bg:#000;--fg:#ccc;--bg2:#333;--darken:rgba(255, 255, 255, 0.1);--nl:#666666;--n0:#808080;--n1:#8c8c8c;--n2:#999999;--shadow:rgba(128, 128, 128, 0.3);--cnt:#000;--na:#eee;--nb:#fff}}.neutral{color:var(--cn-0)}.bg-neutral{background:var(--nl)}a{color:var(--fg)}html{font-size:12px}body,textarea,input,select{background:var(--bg);color:var(--fg);border-radius:0;font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,serif;font-size:1rem;margin:0}*{box-sizing:border-box}.addon,.sm,.nav,textarea,input,select{outline:0;font-size:10px}.tb,.btn,.nav a{text-decoration:none}.container{padding:0 20px;width:auto}@media(min-width:1310px){.container{margin:auto;width:1270px}}pre{background:var(--bg2);padding:10px}code{background:var(--darken);border:solid 1px var(--darken);padding:1px}img{max-width:100%}.big{font-size:2em}.huge{font-size:3em}.tb{font-weight:700;cursor:pointer;padding:2px}.tb:before,.tb:after{opacity:.3;display:inline-block}.tb:before{content:"〈"}.tb:after{content:"〉"}.tb:hover{text-decoration:underline}.tb:hover::before,.tb:hover::after{opacity:1}.tb:active:before{content:"《"}.tb:active:after{content:"》"}.btn{background:var(--n0);border:solid 2px #000;color:#fff;font-weight:700;cursor:pointer;display:inline-block;margin:2px 0;padding:1rem 2rem;box-shadow:4px 4px var(--shadow);text-align:center}.btn:hover{background:var(--n1);color:#fff}.btn:active,.btn:focus{color:#fff;background:var(--n2);box-shadow:1px 1px #000;position:relative;top:3px;left:3px}.btn.sm{padding:.5rem 1rem}.btn.std{width:12rem}.btn.big.std{width:20rem}.btn.huge.std{width:24rem}.row{display:flex;justify-content:space-evenly;align-items:stretch;flex-wrap:wrap}.col{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex-wrap:wrap}.col>*,.row>*{padding:5px}.col.no-padding>*,.row.no-padding>*{padding:0}.table,.c12{width:100%}.c11{width:91.66%}.c10{width:83.33%}.c9{width:75%}.c8{width:66.66%}.c7{width:58.33%}.c6{width:50%}.c5{width:41.66%}.c4{width:33.33%}.c3{width:25%}.c2{width:16.66%}.c1{width:8.33%}@media(max-width:870px){.row .col{width:100%}}.card,.block{padding:5px;border:solid 2px;display:flex;flex-direction:column;justify-content:start;align-items:flex-start}.col>.card,.col>.block{height:100%}.row>.card,.row>.block{width:100%}.card{border-color:var(--nl)}.block{border-color:transparent}.central{display:flex;align-items:center;justify-content:center;background-size:cover;min-height:100vh}button~.central{min-height:calc(100vh - 50px)}.hero{padding:2rem;outline-style:double;outline-width:.5rem;margin:1rem}.push{justify-self:flex-end;margin-top:auto}h1,h2,h3,h4,h5,h6{display:table;padding:.25rem;font-size:1rem}h1{font-size:2rem}h1:before,h2:before,h3:before,h4:before,h5:before,h6:before{opacity:.3;font-size:1rem}h1:before{content:"# "}h2:before{content:"## "}h3:before{content:"### "}h4:before{content:"#### "}h5:before{content:"##### "}h6:before{content:"###### "}.ico{font:20px Arial Unicode MS,Lucida Sans Unicode;line-height:10px;vertical-align:top}label>*{display:inline}form>*{display:block;margin-bottom:10px}textarea,input,select{border:2px solid;padding:8px}textarea,input[type=text]{-webkit-appearance:none;width:13em;outline:0;border:2px solid}.addon{padding:8px 12px;border-width:2px;border-style:solid none solid solid}textarea:focus,input:focus,select:focus{border-color:var(--i1)}.nav,.nav .current,.nav a:hover{background:#000;color:#fff}.nav{height:50px;padding:11px 0 15px}.nav a{color:#aaa;padding-right:1em;position:relative;top:-1px}.nav .pagename{font-weight:700;font-size:22px;top:1px}.btn.btn-close{background:#000;color:#aaa;float:right;font-size:25px;margin:-54px 7px;display:none}.btn.btn-close:hover{color:#fff}@media(max-width:500px){.btn.btn-close{display:block}.nav{overflow:hidden}.pagename{margin-top:-11px}.nav:active,.nav:focus{height:auto}.nav div:before{background:var(--fg);border-bottom:10px double;border-top:3px solid;content:'';float:right;height:4px;position:relative;right:3px;top:14px;width:20px}.nav a{display:block;padding:.5em 0;width:50%}}.table th,.table td{padding:.5em;text-align:left}.table tbody>:nth-child(2n-1){background:var(--bg2)}.msg{background:var(--nl);border-left:5px solid var(--n0);padding:1.5em}
|
2
brut.min.css
vendored
2
brut.min.css
vendored
File diff suppressed because one or more lines are too long
|
@ -8,7 +8,7 @@
|
||||||
<link href="../brut.min.css" rel="stylesheet" type="text/css" />
|
<link href="../brut.min.css" rel="stylesheet" type="text/css" />
|
||||||
<style>
|
<style>
|
||||||
.light { background: var(--bg2); }
|
.light { background: var(--bg2); }
|
||||||
.dark { background: var(--cn-1); }
|
.dark { background: var(--nl); }
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
.tb:active:after { content: "》"; }
|
.tb:active:after { content: "》"; }
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
background: var(--cn0);
|
background: var(--n0);
|
||||||
border: solid 2px #000;
|
border: solid 2px #000;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
@ -23,13 +23,13 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn:hover {
|
.btn:hover {
|
||||||
background: var(--cn1);
|
background: var(--n1);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn:active,.btn:focus {
|
.btn:active,.btn:focus {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--cn2);
|
background: var(--n2);
|
||||||
box-shadow: 1px 1px #000;
|
box-shadow: 1px 1px #000;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 3px;
|
top: 3px;
|
||||||
|
|
|
@ -7,10 +7,10 @@
|
||||||
--bg2: #eee;
|
--bg2: #eee;
|
||||||
--darken: rgba(0,0,0,0.1);
|
--darken: rgba(0,0,0,0.1);
|
||||||
|
|
||||||
--cn-1: lighten(@neutral,25%);
|
--nl: lighten(@neutral,25%);
|
||||||
--cn0: @neutral;
|
--n0: @neutral;
|
||||||
--cn1: darken(@neutral,5%);
|
--n1: darken(@neutral,5%);
|
||||||
--cn2: darken(@neutral,10%);
|
--n2: darken(@neutral,10%);
|
||||||
|
|
||||||
--shadow: rgba(0,0,0,0.75);
|
--shadow: rgba(0,0,0,0.75);
|
||||||
|
|
||||||
|
@ -18,8 +18,8 @@
|
||||||
/* alert messages */
|
/* alert messages */
|
||||||
|
|
||||||
--cnt: #fff;
|
--cnt: #fff;
|
||||||
--cna: #333;
|
--na: #333;
|
||||||
--cnab: #000;
|
--nb: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
|
@ -29,20 +29,20 @@
|
||||||
--bg2: #333;
|
--bg2: #333;
|
||||||
--darken: rgba(255,255,255,0.1);
|
--darken: rgba(255,255,255,0.1);
|
||||||
|
|
||||||
--cn-1: darken(@dark-neutral,10%);
|
--nl: darken(@dark-neutral,10%);
|
||||||
--cn0: @dark-neutral;
|
--n0: @dark-neutral;
|
||||||
--cn1: lighten(@dark-neutral,5%);
|
--n1: lighten(@dark-neutral,5%);
|
||||||
--cn2: lighten(@dark-neutral,10%);
|
--n2: lighten(@dark-neutral,10%);
|
||||||
|
|
||||||
--shadow: rgba(128,128,128,0.3);
|
--shadow: rgba(128,128,128,0.3);
|
||||||
|
|
||||||
--cnt: #000;
|
--cnt: #000;
|
||||||
--cna: #eee;
|
--na: #eee;
|
||||||
--cnab: #fff;
|
--nb: #fff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.neutral { color: var(--cn-0); }
|
.neutral { color: var(--cn-0); }
|
||||||
.bg-neutral { background: var(--cn-1); }
|
.bg-neutral { background: var(--nl); }
|
||||||
|
|
||||||
a { color: var(--fg); }
|
a { color: var(--fg); }
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
.col > .card, .col > .block { height: 100%; }
|
.col > .card, .col > .block { height: 100%; }
|
||||||
.row > .card, .row > .block { width: 100%; }
|
.row > .card, .row > .block { width: 100%; }
|
||||||
|
|
||||||
.card { border-color: var(--cn-1); }
|
.card { border-color: var(--nl); }
|
||||||
.block {
|
.block {
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
|
@ -11,211 +11,211 @@
|
||||||
@dark-fatal: darken(@fatal,10%);
|
@dark-fatal: darken(@fatal,10%);
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--ci-1: saturate(lighten(@info,25%),20%);
|
--il: saturate(lighten(@info,25%),20%);
|
||||||
--ci0: @info;
|
--i0: @info;
|
||||||
--ci1: darken(@info,5%);
|
--i1: darken(@info,5%);
|
||||||
--ci2: darken(@info,10%);
|
--i2: darken(@info,10%);
|
||||||
|
|
||||||
--co-1: saturate(lighten(@ok,25%),20%);
|
--ol: saturate(lighten(@ok,25%),20%);
|
||||||
--co0: @ok;
|
--o0: @ok;
|
||||||
--co1: darken(@ok,5%);
|
--o1: darken(@ok,5%);
|
||||||
--co2: darken(@ok,10%);
|
--o2: darken(@ok,10%);
|
||||||
|
|
||||||
--cw-1: saturate(lighten(@warn,25%),20%);
|
--wl: saturate(lighten(@warn,25%),20%);
|
||||||
--cw0: @warn;
|
--w0: @warn;
|
||||||
--cw1: darken(@warn,5%);
|
--w1: darken(@warn,5%);
|
||||||
--cw2: darken(@warn,10%);
|
--w2: darken(@warn,10%);
|
||||||
|
|
||||||
--ce-1: saturate(lighten(@err,25%),20%);
|
--el: saturate(lighten(@err,25%),20%);
|
||||||
--ce0: @err;
|
--e0: @err;
|
||||||
--ce1: darken(@err,5%);
|
--e1: darken(@err,5%);
|
||||||
--ce2: darken(@err,10%);
|
--e2: darken(@err,10%);
|
||||||
|
|
||||||
--cf-1: saturate(lighten(@fatal,25%),20%);
|
--fl: saturate(lighten(@fatal,25%),20%);
|
||||||
--cf0: @fatal;
|
--f0: @fatal;
|
||||||
--cf1: darken(@fatal,5%);
|
--f1: darken(@fatal,5%);
|
||||||
--cf2: darken(@fatal,10%);
|
--f2: darken(@fatal,10%);
|
||||||
/* alert messages */
|
/* alert messages */
|
||||||
--cia: saturate(darken(@info,10%),25%);
|
--ia: saturate(darken(@info,10%),25%);
|
||||||
--ciab: saturate(darken(@info,0%),35%);
|
--ib: saturate(darken(@info,0%),35%);
|
||||||
--coa: saturate(darken(@ok,10%),25%);
|
--oa: saturate(darken(@ok,10%),25%);
|
||||||
--coab: saturate(darken(@ok,0%),35%);
|
--ob: saturate(darken(@ok,0%),35%);
|
||||||
--cwa: saturate(darken(@warn,10%),25%);
|
--wa: saturate(darken(@warn,10%),25%);
|
||||||
--cwab: saturate(darken(@warn,0%),35%);
|
--wb: saturate(darken(@warn,0%),35%);
|
||||||
--cea: saturate(darken(@err,10%),25%);
|
--ea: saturate(darken(@err,10%),25%);
|
||||||
--ceab: saturate(darken(@err,0%),35%);
|
--eb: saturate(darken(@err,0%),35%);
|
||||||
--cfa: saturate(darken(@fatal,10%),25%);
|
--fa: saturate(darken(@fatal,10%),25%);
|
||||||
--cfab: saturate(darken(@fatal,0%),35%);
|
--fb: saturate(darken(@fatal,0%),35%);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
:root {
|
:root {
|
||||||
--ci-1: darken(@dark-info,10%);
|
--il: darken(@dark-info,10%);
|
||||||
--ci0: @dark-info;
|
--i0: @dark-info;
|
||||||
--ci1: lighten(@dark-info,5%);
|
--i1: lighten(@dark-info,5%);
|
||||||
--ci2: saturate(lighten(@dark-info,10%),10%);
|
--i2: saturate(lighten(@dark-info,10%),10%);
|
||||||
|
|
||||||
--co-1: darken(@dark-ok,10%);
|
--ol: darken(@dark-ok,10%);
|
||||||
--co0: @dark-ok;
|
--o0: @dark-ok;
|
||||||
--co1: lighten(@dark-ok,5%);
|
--o1: lighten(@dark-ok,5%);
|
||||||
--co2: saturate(lighten(@dark-ok,10%),10%);
|
--o2: saturate(lighten(@dark-ok,10%),10%);
|
||||||
|
|
||||||
--cw-1: darken(@dark-warn,10%);
|
--wl: darken(@dark-warn,10%);
|
||||||
--cw0: @dark-warn;
|
--w0: @dark-warn;
|
||||||
--cw1: lighten(@dark-warn,5%);
|
--w1: lighten(@dark-warn,5%);
|
||||||
--cw2: saturate(lighten(@dark-warn,10%),10%);
|
--w2: saturate(lighten(@dark-warn,10%),10%);
|
||||||
|
|
||||||
--ce-1: darken(@dark-err,10%);
|
--el: darken(@dark-err,10%);
|
||||||
--ce0: @dark-err;
|
--e0: @dark-err;
|
||||||
--ce1: lighten(@dark-err,5%);
|
--e1: lighten(@dark-err,5%);
|
||||||
--ce2: saturate(lighten(@dark-err,10%),10%);
|
--e2: saturate(lighten(@dark-err,10%),10%);
|
||||||
|
|
||||||
--cf-1: darken(@dark-fatal,10%);
|
--fl: darken(@dark-fatal,10%);
|
||||||
--cf0: @dark-fatal;
|
--f0: @dark-fatal;
|
||||||
--cf1: lighten(@dark-fatal,5%);
|
--f1: lighten(@dark-fatal,5%);
|
||||||
--cf2: saturate(lighten(@dark-fatal,10%),10%);
|
--f2: saturate(lighten(@dark-fatal,10%),10%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.info { color: var(--ci0); }
|
.info { color: var(--i0); }
|
||||||
.bg-info { background: var(--ci-1); }
|
.bg-info { background: var(--il); }
|
||||||
.ok { color: var(--co0); }
|
.ok { color: var(--o0); }
|
||||||
.bg-ok { background: var(--co-1); }
|
.bg-ok { background: var(--ol); }
|
||||||
.warn { color: var(--cw0); }
|
.warn { color: var(--w0); }
|
||||||
.bg-warn { background: var(--cw-1); }
|
.bg-warn { background: var(--wl); }
|
||||||
.err { color: var(--ce0); }
|
.err { color: var(--e0); }
|
||||||
.bg-err { background: var(--ce-1); }
|
.bg-err { background: var(--el); }
|
||||||
.fatal { color: var(--cf0); }
|
.fatal { color: var(--f0); }
|
||||||
.bg-fatal { background: var(--cf-1); }
|
.bg-fatal { background: var(--fl); }
|
||||||
|
|
||||||
/* Messages */
|
/* Messages */
|
||||||
.msg.info {
|
.msg.info {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--ci-1);
|
background: var(--il);
|
||||||
border-color: var(--ci0);
|
border-color: var(--i0);
|
||||||
}
|
}
|
||||||
.msg.ok {
|
.msg.ok {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--co-1);
|
background: var(--ol);
|
||||||
border-color: var(--co0);
|
border-color: var(--o0);
|
||||||
}
|
}
|
||||||
.msg.warn {
|
.msg.warn {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--cw-1);
|
background: var(--wl);
|
||||||
border-color: var(--cw0);
|
border-color: var(--w0);
|
||||||
}
|
}
|
||||||
.msg.err {
|
.msg.err {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--ce-1);
|
background: var(--el);
|
||||||
border-color: var(--ce0);
|
border-color: var(--e0);
|
||||||
}
|
}
|
||||||
.msg.fatal {
|
.msg.fatal {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
background: var(--cf-1);
|
background: var(--fl);
|
||||||
border-color: var(--cf0);
|
border-color: var(--f0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.msg.alert, .msg.alert * {
|
.msg.alert, .msg.alert * {
|
||||||
color: var(--cnt);
|
color: var(--cnt);
|
||||||
background: var(--cna);
|
background: var(--na);
|
||||||
border-color: var(--cnab);
|
border-color: var(--nb);
|
||||||
}
|
}
|
||||||
.msg.alert.info, .msg.alert.info * {
|
.msg.alert.info, .msg.alert.info * {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--cia);
|
background: var(--ia);
|
||||||
border-color: var(--ciab);
|
border-color: var(--ib);
|
||||||
}
|
}
|
||||||
.msg.alert.ok, .msg.alert.ok * {
|
.msg.alert.ok, .msg.alert.ok * {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--coa);
|
background: var(--oa);
|
||||||
border-color: var(--coab);
|
border-color: var(--ob);
|
||||||
}
|
}
|
||||||
.msg.alert.warn, .msg.alert.warn * {
|
.msg.alert.warn, .msg.alert.warn * {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--cwa);
|
background: var(--wa);
|
||||||
border-color: var(--cwab);
|
border-color: var(--wb);
|
||||||
}
|
}
|
||||||
.msg.alert.err, .msg.alert.err * {
|
.msg.alert.err, .msg.alert.err * {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--cea);
|
background: var(--ea);
|
||||||
border-color: var(--ceab);
|
border-color: var(--eb);
|
||||||
}
|
}
|
||||||
.msg.alert.fatal, .msg.alert.fatal * {
|
.msg.alert.fatal, .msg.alert.fatal * {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: var(--cfa);
|
background: var(--fa);
|
||||||
border-color: var(--cfab);
|
border-color: var(--fb);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Buttons */
|
/* Buttons */
|
||||||
|
|
||||||
.tb.info { color: var(--ci0);
|
.tb.info { color: var(--i0);
|
||||||
&:hover { color: var(--ci1); }
|
&:hover { color: var(--i1); }
|
||||||
&:active { color: var(--ci2); }
|
&:active { color: var(--i2); }
|
||||||
}
|
}
|
||||||
.tb.ok { color: var(--co0);
|
.tb.ok { color: var(--o0);
|
||||||
&:hover { color: var(--co1); }
|
&:hover { color: var(--o1); }
|
||||||
&:active { color: var(--co2); }
|
&:active { color: var(--o2); }
|
||||||
}
|
}
|
||||||
.tb.warn { color: var(--cw0);
|
.tb.warn { color: var(--w0);
|
||||||
&:hover { color: var(--cw1); }
|
&:hover { color: var(--w1); }
|
||||||
&:active { color: var(--cw2); }
|
&:active { color: var(--w2); }
|
||||||
}
|
}
|
||||||
.tb.err { color: var(--ce0);
|
.tb.err { color: var(--e0);
|
||||||
&:hover { color: var(--ce1); }
|
&:hover { color: var(--e1); }
|
||||||
&:active { color: var(--ce2); }
|
&:active { color: var(--e2); }
|
||||||
}
|
}
|
||||||
.tb.fatal { color: var(--cf0);
|
.tb.fatal { color: var(--f0);
|
||||||
&:hover { color: var(--cf1); }
|
&:hover { color: var(--f1); }
|
||||||
&:active { color: var(--cf2); }
|
&:active { color: var(--f2); }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.btn.info {
|
.btn.info {
|
||||||
background: var(--ci0);
|
background: var(--i0);
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--ci1);
|
background: var(--i1);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:active, &:focus {
|
&:active, &:focus {
|
||||||
background: var(--ci2);
|
background: var(--i2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn.ok {
|
.btn.ok {
|
||||||
background: var(--co0);
|
background: var(--o0);
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--co1);
|
background: var(--o1);
|
||||||
}
|
}
|
||||||
&:active, &:focus {
|
&:active, &:focus {
|
||||||
background: var(--co2);
|
background: var(--o2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn.warn {
|
.btn.warn {
|
||||||
background: var(--cw0);
|
background: var(--w0);
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--cw1);
|
background: var(--w1);
|
||||||
}
|
}
|
||||||
&:active, &:focus {
|
&:active, &:focus {
|
||||||
background: var(--cw2);
|
background: var(--w2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn.err {
|
.btn.err {
|
||||||
background: var(--ce0);
|
background: var(--e0);
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--ce1);
|
background: var(--e1);
|
||||||
}
|
}
|
||||||
&:active, &:focus {
|
&:active, &:focus {
|
||||||
background: var(--ce2);
|
background: var(--e2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.btn.fatal {
|
.btn.fatal {
|
||||||
background: var(--cf0);
|
background: var(--f0);
|
||||||
&:hover {
|
&:hover {
|
||||||
background: var(--cf1);
|
background: var(--f1);
|
||||||
}
|
}
|
||||||
&:active, &:focus {
|
&:active, &:focus {
|
||||||
background: var(--cf2);
|
background: var(--f2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -26,5 +26,5 @@ textarea, input[type=text] {
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea:focus, input:focus, select:focus {
|
textarea:focus, input:focus, select:focus {
|
||||||
border-color: var(--ci1);
|
border-color: var(--i1);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
.msg {
|
.msg {
|
||||||
background: var(--cn-1);
|
background: var(--nl);
|
||||||
border-left: 5px solid var(--cn0);
|
border-left: 5px solid var(--n0);
|
||||||
padding: 1.5em;
|
padding: 1.5em;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue