Update styling

This commit is contained in:
SPT-dev 2023-03-02 21:10:41 -05:00
parent ae87ff8ac2
commit 17f11e9ef3
3 changed files with 6 additions and 232 deletions

View File

@ -323,108 +323,6 @@ a {
text-decoration: none; text-decoration: none;
} }
.doc-typography {
/*
p,
pre ul,
li,
blockquote,
span,
code {
font-size: .875rem;
font-weight: 400;
letter-spacing: .03125em;
line-height: 1.5rem;
}
blockquote,
code,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
border-radius: $border-radius;
}
blockquote,
code,
pre,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
padding: $padding;
}
blockquote,
code,
pre,
li,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
margin: $margin;
}
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
box-shadow: $elevation-z2;
}
.doc-alert {
background: $alert;
color: $on-alert;
&::before {
content: "Alert";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-info {
background: $info;
color: $on-info;
&::before {
content: "Info";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-warning {
background: $warning;
color: $on-warning;
&::before {
content: "Warning";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-note {
background: $note;
color: $on-note;
&::before {
content: "Note";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
*/
}
.doc-typography table { .doc-typography table {
text-align: left; text-align: left;
} }

View File

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"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","file":"style.css"} {"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"AAAQ;ACSA;ACTR;AAAA;AAAA;EAGI,kBFQK;EEPL;EACA;EACA,YCJW;EDKX,OFKQ;EEJR;EACA;EACA;EACA;EACA;;AAGA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI,YFfE;EEgBF,YCbO;EDcP,OFhBK;;;AINb;AAAA;AAAA;EAGI,YJEM;EIDN,YDHW;ECIX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;AAAA;AAAA;EACI,YDrBO;;;AERf;AAAA;EAEI,YLIS;EKHT;EACA;EACA;;;ACLJ;AAAA;AAAA;EAGI;EACA,kBNCM;EMCN,YHFW;EGGX,ONDS;EMET;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI,ONZK;EMaL;;AAGJ;AAAA;AAAA;EACI;EACA;;AAEA;AAAA;AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI;;;AL1BhB;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAOA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAKZ;EACI;EACA;EACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AALA;EACI;;;AA2CZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI,YD3JE;EC4JF,YE7JO;EF8JP,OD5JK;EC6JL;EACA;EACA;EACA;;AAEA;EACI;;AAEA;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI,ODhLD;;ACkLC;EACI;;AAGJ;EACI,ODrLX;;AC2LO;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;;AAIA;EACI;;AAIA;EACI;;AAQxB;EACI,YD/NI;ECgOJ,OD/NO;ECgOP;EACA;EACA;;AAEA;EAPJ;IAQQ;IACA;;;;AAKZ;EACI,OD1OK;EC2OL;;;AAWA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;;AAGJ;AAAA;EAEI;;AAGJ;EACI,YA7BS;EA8BT,OA7BY;;AAgChB;EACI;;AAGJ;AAAA;EAEI,eDjRQ","file":"style.css"}

View File

@ -12,7 +12,7 @@
// TODO: Media queries for smaller screens and devices. // TODO: Media queries for smaller screens and devices.
html { html {
font-size: 100%; font-size: 100%; // 16px
} }
body { body {
@ -40,13 +40,11 @@ h5 {
font-family: 'Roboto', sans-serif; font-family: 'Roboto', sans-serif;
font-weight: 400; font-weight: 400;
line-height: 1.3; line-height: 1.3;
// line-height: 1;
} }
h1 { h1 {
// margin-top: 0; // margin-top: 0;
font-size: 4.209rem; font-size: 4.209rem;
// font-weight: 700;
} }
h2 { h2 {
@ -112,7 +110,7 @@ header {
display: none; display: none;
} }
// TODO: Redo header media query (vertical res > 768px -> Dropdown) // TODO: Redo header media query (vertical res > 768px -> Dropdown or moved to sidenav toggle)
/* /*
@media (max-width: #{$bp-medium}) { @media (max-width: #{$bp-medium}) {
&.dropdown { &.dropdown {
@ -151,7 +149,7 @@ header {
} }
} }
// TODO: media queries (@1024px -> article padding = 1rem; en dessous sidenav en mode toggle) // TODO: media queries (@res >= 1024px -> toggleable sidenav)
main { main {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -176,10 +174,6 @@ main {
display: block; display: block;
padding: .25rem .5rem .25rem 1rem; padding: .25rem .5rem .25rem 1rem;
width: calc(100% - 1.5rem); width: calc(100% - 1.5rem);
// &:hover {
// background-color: rgba($secondary,.5);
// }
} }
ul { ul {
@ -253,29 +247,12 @@ a {
text-decoration: none; text-decoration: none;
} }
// Docs typography // Docs specific typography
.doc-typography { .doc-typography {
$alert: #AF1010; $code: #101010;
$on-alert: #fff;
$info: #0D47A1;
$on-info: #fff;
$warning: #ffc107;
// $warning: #e65100;
$on-warning: #000;
$note: #999;
$on-note: #080808;
$code: #101010; // never use full black.
$on-code: #fff; $on-code: #fff;
$blockquote: #181818; $blockquote: #181818;
$on-blockquote: #ccc; $on-blockquote: #ccc;
// $padding: .25rem .5rem;
// $border-radius: $border-radius;
$margin: 0 0 .5rem; $margin: 0 0 .5rem;
table { table {
@ -315,105 +292,4 @@ a {
code { code {
border-radius: $border-radius; border-radius: $border-radius;
} }
/*
p,
pre ul,
li,
blockquote,
span,
code {
font-size: .875rem;
font-weight: 400;
letter-spacing: .03125em;
line-height: 1.5rem;
}
blockquote,
code,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
border-radius: $border-radius;
}
blockquote,
code,
pre,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
padding: $padding;
}
blockquote,
code,
pre,
li,
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
margin: $margin;
}
.doc-alert,
.doc-info,
.doc-warning,
.doc-note {
box-shadow: $elevation-z2;
}
.doc-alert {
background: $alert;
color: $on-alert;
&::before {
content: "Alert";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-info {
background: $info;
color: $on-info;
&::before {
content: "Info";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-warning {
background: $warning;
color: $on-warning;
&::before {
content: "Warning";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
.doc-note {
background: $note;
color: $on-note;
&::before {
content: "Note";
display: block;
font-weight: 700;
margin: 0 0 .25rem 0;
}
}
*/
} }