diff options
Diffstat (limited to 'theme/admin/rsrc/css/main.css')
| -rw-r--r-- | theme/admin/rsrc/css/main.css | 937 |
1 files changed, 937 insertions, 0 deletions
diff --git a/theme/admin/rsrc/css/main.css b/theme/admin/rsrc/css/main.css new file mode 100644 index 0000000..f482179 --- /dev/null +++ b/theme/admin/rsrc/css/main.css @@ -0,0 +1,937 @@ +@charset "UTF-8"; +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Selection +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +::-moz-selection { + background: #BBB; + color: #000; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Hyperlinks +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +a { + color: #0060A0; + text-decoration: none; +} +a:focus { + background: #CCC; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Headings +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +h1, h2, h3, h4, h5, h6 { + margin-bottom: 0; + text-transform: uppercase; +} +h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p { + margin-top: 0; +} +h1 .fa, h2 .fa, h3 .fa, h4 .fa, h5 .fa, h6 .fa { + margin-right: 0.25rem; +} + +h1 { + margin-top: 0; + 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: #DDD; + -webkit-hyphens: auto; + hyphens: auto; +} + +body { + font-family: "Ruda", "sans-serif"; + font-size: 0.7rem; + line-height: 1.2rem; + display: flex; + min-height: 100vh; + flex-direction: column; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Main content +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-content { + flex: 1; + width: 100%; + background: #FFF; + box-sizing: border-box; + padding: 0.75rem; +} +#main-content.wide { + max-width: 90rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Width +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-content, .header-content { + max-width: 50rem; + margin: 0 auto; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Header +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-header { + font-size: 0.6rem; +} + +#header-text, #header-desc { + text-shadow: 0 -1px #4E718F, 1px 0 #4E718F, 0 1px #4E718F, -1px 0 #4E718F; +} + +#header-text { + font-size: 0.8rem; + font-weight: 700; + text-transform: uppercase; +} + +#header-desc { + font-size: 0.6rem; + font-weight: 700; + line-height: 1rem; +} +#header-desc span { + color: #CCC; +} + +#header-logo { + display: block; + max-height: 5rem; + float: left; + margin-right: 0.5rem; +} + +.header-line { + padding: 0.5rem 0.75rem; + overflow: hidden; +} +.header-line:first-child { + background: #5E819F; + position: sticky; + top: 0; +} +.header-line:last-child { + background: #EEE; + border: 0.05rem solid #AAA; + border-left: none; + border-right: none; + padding: 0.25rem 0.75rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Footer +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-footer { + font-size: 0.6rem; + background: #EEE; + border-top: 0.05rem solid #AAA; + padding: 0.5rem 0.75rem; + text-align: center; +} +#main-footer ul { + margin: 0; + padding: 0; + list-style: none; +} +#main-footer ul li { + display: inline; +} +#main-footer ul li .fa { + margin-right: 0.125rem; +} +#main-footer ul li:after { + content: " · "; + font-weight: bold; +} +#main-footer ul li:last-child:after { + content: none; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Main Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#main-navi ul { + list-style: none; + margin: 0; + padding: 0; +} +#main-navi ul li { + display: inline; +} +#main-navi ul li .fa { + margin-right: 0.25rem; +} +#main-navi ul li:last-child { + float: right; +} +#main-navi ul li:first-child { + float: none; +} +#main-navi a { + padding: 0.1rem 0.3rem; + background: #DDD; + border: 0.05rem solid #AAA; + color: inherit; + text-decoration: none; + text-align: center; + display: inline-block; +} +#main-navi a:hover, #main-navi a:focus { + text-decoration: none; + background: #CCC; +} +#main-navi a:focus { + background: #CCC; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Site Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#site-navi { + clear: both; + display: flex; + box-sizing: border-box; + justify-content: space-between; + margin-top: 0.75rem; +} +#site-navi > div { + display: flex; + align-items: center; + border: 0.05rem solid #AAA; + background: #EEE; +} +#site-navi > div > a { + display: block; +} +#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; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Actions +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.actions { + margin: 0 0 0.5rem 0; + padding: 0; + list-style: none; + font-size: 0.6rem; + float: right; + text-align: center; +} +.actions .fa { + margin-right: 0.1rem; +} +.actions li { + display: inline-block; + font-weight: bold; + background: #EEE; + border: 0.05rem solid #AAA; +} +.actions a { + color: inherit; + display: block; + padding: 0 0.25rem; +} + +.actions-before { + float: left; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +pre { + margin-bottom: 1rem; + overflow: auto; + -moz-tab-size: 4; + tab-size: 4; +} + +code, pre { + font-family: "monospace"; + color: #B03060; +} + +p { + margin-top: 0; +} + +img { + border: none; + max-width: 100%; +} + +.red { + color: #B03060; +} + +.blue { + color: #40779A; +} + +.green { + color: #008B45; +} + +.right { + float: right; +} + +.hidden { + display: none; +} + +#database-result { + color: inherit; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Tables +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +table { + width: 100%; + margin-bottom: 1rem; +} + +td { + vertical-align: middle; +} + +table, td { + padding: 0.5rem; + border: 0.05rem solid #AAA; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Brackets +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.brackets:after, .brackets:before { + color: #222; +} +.brackets:before { + content: "["; +} +.brackets:after { + content: "]"; +} + +.brackets a, a.brackets { + text-decoration: none; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Item Element +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.item { + display: flex; + flex-direction: column; + border: 0.05rem solid #AAA; + clear: both; +} +.item header { + padding: 0.5rem 0.75rem; + border-bottom: 0.05rem solid #AAA; + position: sticky; + top: 0; +} +.item header h2 { + margin-top: 0; +} +.item footer { + border-top: 0.05rem solid #AAA; +} +.item footer ul { + margin: 0; + padding: 0; + list-style: none; +} +.item footer ul li { + display: inline-block; + float: left; +} +.item footer ul li:last-child { + float: right; +} +.item footer a { + color: inherit; + display: inline-block; + padding: 0.25rem 2rem; +} +.item footer a:hover, .item footer a:active { + background: #DDD; +} +.item header, .item footer { + background: #EEE; + overflow: hidden; +} +.item blockquote { + margin: 0; + padding: 0.75rem; + overflow: hidden; + font-family: inherit; + flex-grow: 1; +} +.item blockquote p { + margin-bottom: 0; +} +.item-id { + float: right; + color: #666; +} +.item-image { + float: left; + display: block; + margin-right: 0.75rem; + width: 10rem; + height: 7rem; + object-fit: cover; + background: #EEE; + border: 0.05rem solid #AAA; +} +.item-container.grid { + width: 100%; + display: grid; + grid-template-columns: auto auto auto; + grid-column-gap: 1rem; + grid-row-gap: 1rem; + column-gap: 1rem; + row-gap: 1rem; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Argument list +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.arguments { + list-style: none; + margin: 0; + padding: 0.25rem 0.75rem; + background: #EEE; + font-size: 0.6rem; + text-align: center; + border-top: 0.05rem solid #AAA; +} +.arguments li { + display: inline; +} +.arguments li > span { + color: #40779A; +} +.arguments li:after { + content: " · "; + font-weight: bold; +} +.arguments li:last-child:after { + content: none; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Grids +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.form-grid { + display: grid; + grid-template-columns: 8rem auto 8rem auto; + border-left: 0.05rem solid #AAA; + border-bottom: 0.05rem solid #AAA; +} +.form-grid.two-columns { + grid-template-columns: auto auto; +} +.form-grid > label { + display: flex; + align-items: center; + background: #DDD; +} +.form-grid > label .fa { + margin-left: 0.5rem; + margin-right: 1rem; +} +.form-grid-item, +.form-grid > label { + padding: 0.5rem; + border-top: 0.05rem solid #AAA; + border-right: 0.05rem solid #AAA; +} + +.form-border-box { + border: 0.05rem solid #AAA; +} +.form-border-box.padding { + padding: 0.5rem; +} +.form-border-box.background { + background: #DDD; +} +.form-border-box.nobordertop { + border-top: none; +} +.form-border-box + .form-border-box { + border-top: none; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form buttons +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#emoticon-list-wrapper { + display: flex; + width: 100%; + justify-content: center; + box-sizing: border-box; +} + +#button-list-wrapper { + border-bottom: 0.05rem solid #AAA; + background: #EEE; + overflow: hidden; +} + +.button-list { + margin: 0; + padding: 0; + list-style: none; +} + +.button-list.emoticons > li { + font-size: 1.25rem; + display: inline-block; + padding: 0.2rem; + border-bottom: 0.2rem solid transparent; + border-radius: 0.1rem; + cursor: pointer; +} +.button-list.emoticons > li:hover, .button-list.emoticons > li:active { + border-bottom: 0.2rem solid #AAA; +} + +.button-list.markdown > li { + float: left; + padding: 0.5rem; + cursor: pointer; + width: 1.75rem; + box-sizing: border-box; + text-align: center; +} +.button-list.markdown > li:hover, .button-list.markdown > li:active { + color: #40779A; +} + +#content-editor { + border: none; + margin: 0; +} +#content-editor-wrapper { + border-top: none; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +input, select, textarea { + width: 100%; + background: #EEE; + color: #404040; + font-family: inherit; + font-size: 0.7rem; + padding: 0.25rem; + border: 0.05rem solid #AAA; + box-sizing: border-box; +} +input:focus, select:focus, textarea:focus { + outline: none; +} + +textarea { + font-family: "Kadwa", "sans-serif"; + box-sizing: border-box; + display: block; + resize: vertical; + min-height: 15rem; + line-height: 1.2rem; + padding: 0.5rem; + -webkit-hyphens: none; + hyphens: none; +} + +input[type=submit] { + text-transform: uppercase; + border-radius: 0.1rem; +} +input:disabled { + background: #DDD; + color: #888; +} +input:disabled:hover { + cursor: not-allowed; +} + +label { + text-transform: uppercase; + font-weight: normal; +} +label:after { + content: ":"; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form buttons +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#insert-button, #update-button, #delete-button { + color: #EEE; + border: 0.05rem solid #404040; +} + +#insert-button { + background: #4D8D5D; +} +#insert-button:active, #insert-button:focus { + background: #3b6c47; +} + +#update-button { + background: #6A8AA5; +} +#update-button:active, #update-button:focus { + background: #537089; +} + +#delete-button { + background: #C45C66; +} +#delete-button:active, #delete-button:focus { + background: #ae3f4a; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Form message list +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#message-list { + margin: 0; + padding: 0.5rem; + list-style: none; + background: #C45C66; + color: #EEE; + font-size: 0.6rem; +} +#message-list-wrapper { + margin-bottom: 0.5rem; + border: 0.1rem solid #ae3f4a; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Search form +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +#search-form { + margin-bottom: 1rem; +} + +@media only screen and (max-width: 90em) { + .item-container.grid { + grid-template-columns: auto auto; + } +} +@media only screen and (min-width: 62.5em) { + #main-content { + border: 0.05rem solid #AAA; + border-top: none; + border-bottom: none; + } +} +@media only screen and (max-width: 62.5em) { + .item-container.grid { + grid-template-columns: auto; + } +} +@media only screen and (max-width: 50em) { + html { + font-size: 1.125rem; + /*18px*/ + } +} +@media only screen and (max-width: 37.5em) { + #main-content { + padding: 0.5rem; + } + + #main-navi { + font-size: 1rem; + } + #main-navi li span { + display: none; + } + #main-navi li .fa { + margin-right: 0; + } + #main-navi a { + padding: 0.5rem; + } + + #emoticon-list-wrapper { + display: none; + } + + .item-container.grid { + grid-column-gap: 0.75rem; + grid-row-gap: 0.75rem; + column-gap: 0.75rem; + row-gap: 0.75rem; + } + + .form-grid { + grid-template-columns: auto auto; + } + + .actions { + float: none; + display: flex; + width: 100%; + flex-grow: 1; + justify-content: center; + overflow: hidden; + box-sizing: border-box; + } + .actions li { + flex-grow: 1; + } + .actions li + li { + border-left: none; + } + + .actions-before { + float: none; + } + + .arguments { + font-size: 0.5rem; + line-height: 0.75rem; + } +} +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Main +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa { + font: normal normal normal 14px/1 "FontAwesome"; + font-size: inherit; + speak: none; + display: inline-block; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# FontAwesome Icons +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +.fa-bug:before { + content: ""; +} + +.fa-key:before { + content: ""; +} + +.fa-link:before { + content: ""; +} + +.fa-bold:before { + content: ""; +} + +.fa-code:before { + content: ""; +} + +.fa-user:before { + content: ""; +} + +.fa-book:before { + content: ""; +} + +.fa-italic:before { + content: ""; +} + +.fa-header:before { + content: ""; +} + +.fa-search:before { + content: ""; +} + +.fa-trash-o:before { + content: ""; +} + +.fa-sign-in:before { + content: ""; +} + +.fa-clock-o:before { + content: ""; +} + +.fa-list-ul:before { + content: ""; +} + +.fa-list-ol:before { + content: ""; +} + +.fa-database:before { + content: ""; +} + +.fa-language:before { + content: ""; +} + +.fa-sign-out:before { + content: ""; +} + +.fa-dashboard:before { + content: ""; +} + +.fa-picture-o:before { + content: ""; +} + +.fa-envelope-o:before { + content: ""; +} + +.fa-arrow-left:before { + content: ""; +} + +.fa-quote-right:before { + content: ""; +} + +.fa-user-secret:before { + content: ""; +} + +.fa-file-text-o:before { + content: ""; +} + +.fa-newspaper-o:before { + content: ""; +} + +.fa-arrow-right:before { + content: ""; +} + +.fa-external-link:before { + content: ""; +} + +.fa-github-square:before { + content: ""; +} + +.fa-pencil-square-o:before { + content: ""; +} + +.fa-exclamation-triangle:before { + content: ""; +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Font Awesome" [4.7.0] (by Fontello): SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "FontAwesome"; + font-weight: 400; + src: url("../font/font-awesome-fontello.woff2") format("woff2"); +} +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Font "Kadwa": SIL Open Font License (OFL) +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@font-face { + font-family: "Kadwa"; + font-weight: 400; + src: url("../font/kadwa-n-400.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"); +} |