diff options
Diffstat (limited to 'theme/default/rsrc/css')
| -rw-r--r-- | theme/default/rsrc/css/import/_font-awesome.scss | 65 | ||||
| -rw-r--r-- | theme/default/rsrc/css/import/_fonts.scss | 23 | ||||
| -rw-r--r-- | theme/default/rsrc/css/import/_responsive.scss | 77 | ||||
| -rw-r--r-- | theme/default/rsrc/css/main.css | 546 | ||||
| -rw-r--r-- | theme/default/rsrc/css/main.css.map | 1 | ||||
| -rw-r--r-- | theme/default/rsrc/css/main.scss | 412 |
6 files changed, 1124 insertions, 0 deletions
diff --git a/theme/default/rsrc/css/import/_font-awesome.scss b/theme/default/rsrc/css/import/_font-awesome.scss new file mode 100644 index 0000000..733022c --- /dev/null +++ b/theme/default/rsrc/css/import/_font-awesome.scss @@ -0,0 +1,65 @@ +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Main +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa { + display: inline-block; + font: normal normal normal 14px/1 "FontAwesome"; + font-size: inherit; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Icons +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa-rss:before { + content: "\f09e"; +} + +.fa-key:before { + content: "\f084"; +} + +.fa-bars:before { + content: "\f0c9"; +} + +.fa-user:before { + content: "\f007"; +} + +.fa-home:before { + content: "\f015"; +} + +.fa-search:before { + content: "\f002"; +} + +.fa-rss-square:before { + content: "\f143"; +} + +.fa-arrow-left:before { + content: "\f060"; +} + +.fa-user-secret:before { + content: "\f21b"; +} + +.fa-file-text-o:before { + content: "\f0f6"; +} + +.fa-newspaper-o:before { + content: "\f1ea"; +} + +.fa-arrow-right:before { + content: "\f061"; +} + +.fa-exclamation-triangle:before { + content: "\f071"; +} diff --git a/theme/default/rsrc/css/import/_fonts.scss b/theme/default/rsrc/css/import/_fonts.scss new file mode 100644 index 0000000..2477120 --- /dev/null +++ b/theme/default/rsrc/css/import/_fonts.scss @@ -0,0 +1,23 @@ +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Font Awesome" [4.7.0]: SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "FontAwesome"; + font-weight: 400; + src: url("../font/font-awesome.woff2") format("woff2"); +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Ruda": SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "Ruda"; + font-weight: 400; + src: url("../font/ruda-n-400.woff2") format("woff2"); +} + +@font-face { + font-family: "Ruda"; + font-weight: 700; + src: url("../font/ruda-n-700.woff2") format("woff2"); +} diff --git a/theme/default/rsrc/css/import/_responsive.scss b/theme/default/rsrc/css/import/_responsive.scss new file mode 100644 index 0000000..d248bf4 --- /dev/null +++ b/theme/default/rsrc/css/import/_responsive.scss @@ -0,0 +1,77 @@ +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #1 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 50em) { + html { + font-size: 1.125rem; /*18px*/ + background-image: none !important; + } + + body { + line-height: 1.2rem; + } + + #container { + margin: 0; + border-right: none; + border-left: none; + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #2 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 37.5em) { + main, #main-header > div { + padding: 1rem; + } + + #main-navi { + padding: 0.25rem 1rem; + } + + #main-navi a { + border: 0.05rem solid transparent; + } + + #main-navi a:hover, #main-navi a:focus { + border: 0.05rem solid #BBB; + } + + #main-navi > ul { + display: none; + float: none; + } + + #main-navi > ul > li a { + display: block; + text-align: left; + padding: 0 0.25rem; + } + + #main-navi { + overflow: hidden; + } + + #toogle-nav-label { + display: block; + } + + #toogle-nav:checked + ul { + display: block; + } + + #main-navi li:last-child { + float: none; + } + + .item > header { + text-align: center; + } + + .item > header > h2, + .item > header > .info { + float: none; + display: block; + } +} diff --git a/theme/default/rsrc/css/main.css b/theme/default/rsrc/css/main.css new file mode 100644 index 0000000..5797447 --- /dev/null +++ b/theme/default/rsrc/css/main.css @@ -0,0 +1,546 @@ +@charset "UTF-8"; +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Hyperlinks +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +a { + color: #0060A0; + text-decoration: none; +} +a:focus { + background: #CCC; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Headings +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +h1, h2, h3, h4, h5, h6 { + margin: 0; + font-weight: 600; +} +h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p { + margin-top: 0; +} + +h1 { + font-size: 0.8rem; +} + +h2 { + font-size: 0.7rem; +} + +h3 { + font-size: 0.65rem; +} + +h4 { + font-size: 0.6rem; +} + +h5 { + font-size: 0.55rem; +} + +h6 { + font-size: 0.5rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Document +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +html, body { + margin: 0; + padding: 0; +} + +html { + font-size: 1.25rem; + color: #333; + background: #CCC; + -webkit-hyphens: auto; + hyphens: auto; +} + +body { + font-family: "Ruda", "sans-serif"; + font-size: 0.7rem; + line-height: 1.2rem; +} + +#container { + max-width: 45rem; + margin: 1rem auto; + border: 0.05rem solid #AAA; + background: #FFF; +} + +main, #main-header > div { + padding: 1rem; + box-sizing: border-box; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Header +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-header > div { + overflow: hidden; +} + +#main-logo { + height: 1.75rem; + display: block; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Footer +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-footer { + background: #EEE; + border-top: 0.05rem solid #AAA; + padding: 0.25rem 1rem; + text-align: center; + font-size: 0.6rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Main Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-navi { + font-size: 0.6rem; + background: #EEE; + border: 0.05rem solid #AAA; + border-left: none; + border-right: none; + padding: 0 1rem; +} +#main-navi ul { + list-style: none; + margin: 0; + padding: 0; +} +#main-navi ul li { + display: inline; +} +#main-navi ul li:last-child { + float: right; +} +#main-navi a { + padding: 0.25rem 0.3rem; + color: inherit; + text-decoration: none; + text-align: center; + display: inline-block; + border: 0.05rem solid transparent; + border-top: none; + border-bottom: none; +} +#main-navi a:hover, #main-navi a:focus { + text-decoration: none; + background: #DDD; + border: 0.05rem solid #AAA; + border-top: none; + border-bottom: none; +} + +#main-navi li .fa, h1 > .fa, h2 > .fa { + margin-right: 0.25rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Site Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#site-navi { + clear: both; + display: flex; + box-sizing: border-box; + justify-content: space-between; +} +#site-navi > div { + display: flex; + align-items: center; + border: 0.05rem solid #AAA; + background: #EEE; +} +#site-navi > div > a { + display: block; +} +#site-navi > section { + display: flex; + overflow: hidden; + align-items: center; +} +#site-navi > section > div { + border: 0.05rem solid #AAA; + background: #EEE; +} +#site-navi .disabled { + pointer-events: none; + color: #AAA; +} +#site-navi .active a { + background: #CCC !important; + font-weight: 600; + pointer-events: none; +} +#site-navi ol { + list-style: none; + margin: 0; + padding: 0; +} +#site-navi ol li { + float: left; + display: inline-block; +} +#site-navi ol li + li { + border-left: 0.05rem solid #AAA; +} +#site-navi a { + padding: 0 0.5rem; + text-decoration: none; + color: inherit; + display: inline-block; +} +#site-navi a:hover, #site-navi a:focus { + background: #CCC; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +pre { + font-family: "monospace"; + margin-bottom: 1rem; + overflow: auto; + -moz-tab-size: 4; + tab-size: 4; +} + +code, pre { + font-family: "monospace"; + color: #008B45; +} + +strong, label { + font-weight: 600; +} + +img { + border: none; + max-width: 100%; +} + +main img { + border: 0.05rem solid #000; + border-radius: 0.15rem; +} + +table img { + border: none; + border-radius: 0; +} + +.red { + color: #B03060; +} + +.head-link { + font-size: 0.6rem; + float: right; +} +.head-link .fa { + margin-right: 0.125rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Brackets +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.brackets:before { + content: "["; +} +.brackets:after { + content: "]"; +} +.brackets:before, .brackets:after { + color: #222; +} + +.brackets a, a.brackets { + text-decoration: none; +} + +a.brackets:before, a.brackets:after { + color: #222; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Item Element +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.item { + background: #EEE; + border: 0.05rem solid #AAA; + overflow: hidden; + margin: 0.5rem 0; +} +.item header { + padding: 0.25rem 1rem; + border-bottom: 0.05rem solid #AAA; + overflow: hidden; + text-transform: uppercase; +} +.item header h2 { + font-size: 0.65rem; + float: left; +} +.item header .info { + float: right; + font-size: 0.6rem; + font-weight: 400; +} +.item header a { + color: inherit; +} +.item blockquote { + margin: 0; + padding: 0 1rem; + font-family: inherit; +} +.item blockquote img { + display: block; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Item content on main sites +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#content { + background: #EEE; + border: 0.05rem solid #AAA; + margin: 0.5rem 0; + padding: 0 1rem; +} +#content img { + display: block; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#toogle-nav { + display: none; + clear: both; +} + +#toogle-nav-label { + display: none; + cursor: pointer; + font-size: 1.25rem; + text-align: center; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +input, select { + background: #EEE; + color: inherit; + padding: 0.2rem; + border: 0.1rem solid #AAA; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Table elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +table { + width: 100%; + margin: 0 0 1rem; +} + +td { + vertical-align: middle; +} + +table, td { + border-spacing: 0; + border-collapse: collapse; + padding: 0.5rem; + border: 0.05rem solid #000; +} + +thead, tr:nth-child(even) { + background: #EEE; +} + +thead > tr, th { + font-weight: 600; + font-style: italic; +} + +thead > tr > td, th > td { + text-align: center; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #1 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 50em) { + html { + font-size: 1.125rem; + /*18px*/ + background-image: none !important; + } + + body { + line-height: 1.2rem; + } + + #container { + margin: 0; + border-right: none; + border-left: none; + } +} +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #2 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 37.5em) { + main, #main-header > div { + padding: 1rem; + } + + #main-navi { + padding: 0.25rem 1rem; + } + + #main-navi a { + border: 0.05rem solid transparent; + } + + #main-navi a:hover, #main-navi a:focus { + border: 0.05rem solid #BBB; + } + + #main-navi > ul { + display: none; + float: none; + } + + #main-navi > ul > li a { + display: block; + text-align: left; + padding: 0 0.25rem; + } + + #main-navi { + overflow: hidden; + } + + #toogle-nav-label { + display: block; + } + + #toogle-nav:checked + ul { + display: block; + } + + #main-navi li:last-child { + float: none; + } + + .item > header { + text-align: center; + } + + .item > header > h2, +.item > header > .info { + float: none; + display: block; + } +} +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Main +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa { + display: inline-block; + font: normal normal normal 14px/1 "FontAwesome"; + font-size: inherit; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Icons +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa-rss:before { + content: ""; +} + +.fa-key:before { + content: ""; +} + +.fa-bars:before { + content: ""; +} + +.fa-user:before { + content: ""; +} + +.fa-home:before { + content: ""; +} + +.fa-search:before { + content: ""; +} + +.fa-rss-square:before { + content: ""; +} + +.fa-arrow-left:before { + content: ""; +} + +.fa-user-secret:before { + content: ""; +} + +.fa-file-text-o:before { + content: ""; +} + +.fa-newspaper-o:before { + content: ""; +} + +.fa-arrow-right:before { + content: ""; +} + +.fa-exclamation-triangle:before { + content: ""; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Font Awesome" [4.7.0]: SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "FontAwesome"; + font-weight: 400; + src: url("../font/font-awesome.woff2") format("woff2"); +} +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Ruda": SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "Ruda"; + font-weight: 400; + src: url("../font/ruda-n-400.woff2") format("woff2"); +} +@font-face { + font-family: "Ruda"; + font-weight: 700; + src: url("../font/ruda-n-700.woff2") format("woff2"); +} + +/*# sourceMappingURL=main.css.map */ diff --git a/theme/default/rsrc/css/main.css.map b/theme/default/rsrc/css/main.css.map new file mode 100644 index 0000000..8e8cbbf --- /dev/null +++ b/theme/default/rsrc/css/main.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["main.scss","import/_responsive.scss","import/_font-awesome.scss","import/_fonts.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAGA;EACC;EACA;;AAEA;EACC;;;AAIF;AAAA;AAAA;AAGA;EACC;EACA;;AAEA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;;;AAGD;EACC;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;;AAEA;EACC;;AAEA;EACC;;AAKH;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;;AAKH;EACC;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;AAEA;EACC;;AAIF;EACC;EACA;EACA;;AAEA;EACC;EACA;;AAIF;EACC;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA;;AAEA;EACC;EACA;;AAEA;EACC;;AAKH;EACC;EACA;EACA;EACA;;AAEA;EACC;;;AAKH;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;AAEA;EACC;;;AAIF;AAAA;AAAA;AAIC;EACC;;AAGD;EACC;;AAGD;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;AAEA;EACC;EACA;;AAGD;EACC;EACA;EACA;;AAGD;EACC;;AAIF;EACC;EACA;EACA;;AAEA;EACC;;;AAKH;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;;AAEA;EACC;;;AAIF;AAAA;AAAA;AAGA;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;;;ACtZD;AAAA;AAAA;AAGA;EACC;IACC;AAAqB;IACrB;;;EAGD;IACC;;;EAGD;IACC;IACA;IACA;;;AAIF;AAAA;AAAA;AAGA;EACC;IACC;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;IACC;IACA;;;EAGD;IACC;IACA;IACA;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;IACC;;;EAGD;AAAA;IAEC;IACA;;;AC1EF;AAAA;AAAA;AAGA;EACC;EACA;EACA;EACA;EACA;;;AAGD;AAAA;AAAA;AAGA;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AAGD;EACC;;;AC/DD;AAAA;AAAA;AAGA;EACC;EACA;EACA;;AAGD;AAAA;AAAA;AAGA;EACC;EACA;EACA;;AAGD;EACC;EACA;EACA","file":"main.css"}
\ No newline at end of file diff --git a/theme/default/rsrc/css/main.scss b/theme/default/rsrc/css/main.scss new file mode 100644 index 0000000..8215934 --- /dev/null +++ b/theme/default/rsrc/css/main.scss @@ -0,0 +1,412 @@ +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Hyperlinks +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +a { + color: #0060A0; + text-decoration: none; + + &:focus { + background: #CCC; + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Headings +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +h1, h2, h3, h4, h5, h6 { + margin: 0; + font-weight: 600; + + + p { + margin-top: 0; + } +} + +h1 { + font-size: 0.80rem; +} + +h2 { + font-size: 0.70rem; +} + +h3 { + font-size: 0.65rem; +} + +h4 { + font-size: 0.60rem; +} + +h5 { + font-size: 0.55rem; +} + +h6 { + font-size: 0.50rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Document +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +html, body { + margin: 0; + padding: 0; +} + +html { + font-size: 1.25rem; + color: #333; + background: #CCC; + -webkit-hyphens: auto; + hyphens: auto; +} + +body { + font-family: "Ruda", "sans-serif"; + font-size: 0.7rem; + line-height: 1.2rem; +} + +#container { + max-width: 45rem; + margin: 1rem auto; + border: 0.05rem solid #AAA; + background: #FFF; +} + +main, #main-header > div { + padding: 1rem; + box-sizing: border-box; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Header +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-header > div { + overflow: hidden; +} + +#main-logo { + height: 1.75rem; + display: block; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Footer +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-footer { + background: #EEE; + border-top: 0.05rem solid #AAA; + padding: 0.25rem 1rem; + text-align: center; + font-size: 0.6rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Main Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-navi { + font-size: 0.6rem; + background: #EEE; + border: 0.05rem solid #AAA; + border-left: none; + border-right: none; + padding: 0 1rem; + + ul { + list-style: none; + margin: 0; + padding: 0; + + li { + display: inline; + + &:last-child { + float: right; + } + } + } + + a { + padding: 0.25rem 0.3rem; + color: inherit; + text-decoration: none; + text-align: center; + display: inline-block; + border: 0.05rem solid transparent; + border-top: none; + border-bottom: none; + + &:hover, &:focus { + text-decoration: none; + background: #DDD; + border: 0.05rem solid #AAA; + border-top: none; + border-bottom: none; + } + } +} + +#main-navi li .fa, h1 > .fa, h2 > .fa { + margin-right: 0.25rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Site Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#site-navi { + clear: both; + display: flex; + box-sizing: border-box; + justify-content: space-between; + + > div { + display: flex; + align-items: center; + border: 0.05rem solid #AAA; + background: #EEE; + + > a { + display: block; + } + } + + > section { + display: flex; + overflow: hidden; + align-items: center; + + > div { + border: 0.05rem solid #AAA; + background: #EEE; + } + } + + .disabled { + pointer-events: none; + color: #AAA; + } + + .active a { + background: #CCC !important; + font-weight: 600; + pointer-events: none; + } + + ol { + list-style: none; + margin: 0; + padding: 0; + + li { + float: left; + display: inline-block; + + + li { + border-left: 0.05rem solid #AAA; + } + } + } + + a { + padding: 0 0.5rem; + text-decoration: none; + color: inherit; + display: inline-block; + + &:hover, &:focus { + background: #CCC; + } + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +pre { + font-family: "monospace"; + margin-bottom: 1rem; + overflow: auto; + -moz-tab-size: 4; + tab-size: 4; +} + +code, pre { + font-family: "monospace"; + color: #008B45; +} + +strong, label { + font-weight: 600; +} + +img { + border: none; + max-width: 100%; +} + +main img { + border: 0.05rem solid #000; + border-radius: 0.15rem; +} + +table img { + border: none; + border-radius: 0; +} + +.red { + color: #B03060; +} + +.head-link { + font-size: 0.6rem; + float: right; + + .fa { + margin-right: 0.125rem; + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Brackets +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.brackets { + &:before { + content: "["; + } + + &:after { + content: "]"; + } + + &:before, &:after { + color: #222; + } +} + +.brackets a, a.brackets { + text-decoration: none; +} + +a.brackets:before, a.brackets:after { + color: #222; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Item Element +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.item { + background: #EEE; + border: 0.05rem solid #AAA; + overflow: hidden; + margin: 0.5rem 0; + + header { + padding: 0.25rem 1rem; + border-bottom: 0.05rem solid #AAA; + overflow: hidden; + text-transform: uppercase; + + h2 { + font-size: 0.65rem; + float: left; + } + + .info { + float: right; + font-size: 0.6rem; + font-weight: 400; + } + + a { + color: inherit; + } + } + + blockquote { + margin: 0; + padding: 0 1rem; + font-family: inherit; + + img { + display: block; + } + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Item content on main sites +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#content { + background: #EEE; + border: 0.05rem solid #AAA; + margin: 0.5rem 0; + padding: 0 1rem; + + img { + display: block; + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#toogle-nav { + display: none; + clear: both; +} + +#toogle-nav-label { + display: none; + cursor: pointer; + font-size: 1.25rem; + text-align: center; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +input, select { + background: #EEE; + color: inherit; + padding: 0.2rem; + border: 0.1rem solid #AAA; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Table elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +table { + width: 100%; + margin: 0 0 1rem; +} + +td { + vertical-align: middle; +} + +table, td { + border-spacing: 0; + border-collapse: collapse; + padding: 0.5rem; + border: 0.05rem solid #000; +} + +thead, tr:nth-child(even) { + background: #EEE; +} + +thead > tr, th { + font-weight: 600; + font-style: italic; +} + +thead > tr > td, th > td { + text-align: center; +} + +@import "import/responsive"; +@import "import/font-awesome"; +@import "import/fonts"; |