1
0
mirror of https://github.com/osmarks/mycorrhiza.git synced 2024-10-30 11:46:16 +00:00
mycorrhiza/static/default.css
handlerug 839f8bc2d6
New static files system
assets.qtpl is no more! Now you can just add files to static/ folder,
make sure the extension is registered in static.go (a shortcoming
that'll be addressed in future Go versions), and you're done! It
searches the local file system first, then falls back to the files
embedded with the binary (in the static/ folder).
2021-06-12 20:58:04 +07:00

307 lines
13 KiB
CSS

.non-existent-hypha { }
.non-existent-hypha__ways { display: flex; flex-direction: column; width: 100%; margin: 0 0 1rem 0;}
.non-existent-hypha__way { border: 1px #999 solid; border-radius: .25rem; padding: .25rem; }
.non-existent-hypha__title { margin-bottom: 1rem; }
.non-existent-hypha__subtitle { margin: 0; }
.amnt-grid { display: grid; grid-template-columns: 1fr 1fr; }
#upload-binary__input { display: block; margin: .25rem 0 .25rem 0; }
.modal__title { font-size: 2rem; }
.modal__title_small { font-size: 1.5rem; }
.modal__confirmation-msg { margin: 0 0 .5rem 0; }
.hypha-list { padding-left: 0; }
.hypha-list__entry { list-style-type: none; }
.hypha-list__link { text-decoration: none; display: inline-block; padding: .25rem; }
.hypha-list__link:hover { text-decoration: underline; }
.hypha-list__amnt-type { font-size: smaller; color: #999; }
/* General element positions, from small to big */
/* Phones and whatnot */
.layout { display: grid; row-gap: 1rem; }
header { width: 100%; margin-bottom: 1rem; }
.header-links__list, .hypha-tabs__flex { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.header-links__entry, .hypha-tabs__tab { list-style-type: none; }
.header-links__entry { margin-right: .5rem; }
.header-links__entry_user, .header-links__entry_register { font-style:italic; }
.header-links__link { display: inline-block; padding: .25rem; text-decoration: none; }
.hypha-tabs { padding: 0; margin: 0; }
.hypha-tabs__tab { margin-right: .5rem; padding: 0; }
.hypha-tabs__link { display: inline-block; padding: .25rem; text-decoration: none; }
.hypha-tabs__selection { display: inline-block; padding: .25rem; font-weight: bold; }
.layout-card li { list-style-type: none; }
.backlinks__list { padding: 0; margin: 0; }
.backlinks__link { text-decoration: none; display: block; padding: .25rem; padding-left: 1.25rem; }
@media screen and (max-width: 800px) {
.amnt-grid { grid-template-columns: 1fr; }
.layout { grid-template-columns: auto; grid-template-rows: auto auto auto; }
.main-width { width: 100%; }
main { padding: 1rem; margin: 0; }
}
@media screen and (min-width: 500px) {
.non-existent-hypha__way { flex: 1; margin-right: .5rem; }
.non-existent-hypha__ways { flex-direction: row; }
.non-existent-hypha__way:last-child { margin-right: 0; }
}
/* No longer a phone but still small screen: draw normal tabs, center main */
@media screen and (min-width: 801px) {
.main-width { padding: 1rem 2rem; width: 800px; margin: 0 auto; }
main { border-radius: .25rem; }
.layout-card { width: 800px; margin: 0 auto; }
.header-links { padding: 0; }
.header-links__entry { margin-right: 1.5rem; }
.header-links__entry_user { margin: 0 2rem 0 auto; }
.header-links__entry:nth-of-type(1),
.hypha-tabs { padding: 0; }
.hypha-tabs__tab { border-radius: .25rem .25rem 0 0; margin-right: 0; }
.hypha-tabs__selection, .hypha-tabs__link { padding: .25rem .5rem; }
.header-links__entry:nth-of-type(1), .hypha-tabs__tab:nth-of-type(1) { margin-left: 2rem; }
}
/* Wide enough to fit two columns ok */
@media screen and (min-width: 1100px) {
.layout { display: grid; grid-template-columns: auto 1fr; column-gap: 1rem; margin: 0 1rem; row-gap: 1rem; }
.main-width { margin: 0; }
main { grid-column: 1 / span 1; grid-row: 1 / span 2; }
.relative-hyphae, .edit-toolbar { grid-column: 2 / span 1; grid-row: 1 / span 1; }
.layout-card { width: 100%; }
.edit-toolbar__buttons {display: grid; }
}
@media screen and (min-width: 1150px) {
.edit-toolbar__buttons { grid-template-columns: 1fr 1fr; }
}
@media screen and (min-width: 1250px) {
.layout { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
.layout-card {max-width: 18rem;}
.main-width { margin: 0 auto; }
.backlinks { grid-column: 1 / span 1; margin-right: 0; }
main { grid-column: 2 / span 1; }
.relative-hyphae, .edit-toolbar { grid-column: 3 / span 1; margin-left: 0; }
.edit-toolbar__buttons { grid-template-columns: 1fr; }
.backlinks__title { text-align: right; }
.backlinks__link { text-align: right; padding-right: 1.25rem; padding-left: .25rem; }
}
@media screen and (min-width: 1400px) {
.edit-toolbar__buttons { grid-template-columns: 1fr 1fr; }
}
*, *::before, *::after {box-sizing: border-box;}
html { height:100%; padding:0; }
body {height:100%; margin:0; }
body, input { font-size:16px; font-family: 'PT Sans', 'Liberation Sans', sans-serif;}
main > form {margin-bottom:1rem;}
textarea {font-size:16px; font-family: 'PT Sans', 'Liberation Sans', sans-serif;}
.edit { min-height: 80vh; }
.edit__title { margin-top: 0; }
.edit__preview { border: 2px dashed #ddd; }
.edit-form {height:70vh;}
.edit-form textarea {width:100%;height:95%;}
.edit-form__save { font-weight: bold; }
.edit-toolbar__buttons, .edit-toolbar__ad { margin: .5rem; }
.icon {margin-right: .25rem; vertical-align: bottom; }
main h1:not(.navi-title) {font-size:1.7rem;}
blockquote { margin: 0; padding-left: .75rem; }
.wikilink_external::before { display: inline-block; width: 18px; height: 16px; vertical-align: sub; }
/* .wikilink_external { padding-left: 16px; } */
.wikilink_gopher::before { content: url("/static/icon/gopher-proto.svg"); }
.wikilink_http::before, .wikilink_https::before { content: url("/static/icon/http-proto.svg"); }
/* .wikilink_https { background: transparent url("/static/icon/http-proto.svg") center left no-repeat; } */
.wikilink_gemini::before { content: url("/static/icon/gemini-proto.svg"); }
.wikilink_mailto::before { content: url("/static/icon/mailto-proto.svg"); }
article { overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; line-height: 150%; }
main h1, main h2, main h3, main h4, main h5, main h6 { margin: 1.5rem 0 0 0; }
.heading__link { text-decoration: none; display: inline-block; }
.heading__link::after { width: 1rem; content: "§"; color: transparent; }
.heading__link:hover::after, .heading__link:active::after { color: #999; }
article p { margin: .5rem 0; }
article ul, ol { padding-left: 1.5rem; margin: .5rem 0; }
article code { padding: .1rem .3rem; border-radius: .25rem; font-size: 90%; font-family: 'Menlo', 'PT Mono', monospace; }
article pre.codeblock { padding:.5rem; white-space: pre-wrap; border-radius: .25rem;}
.codeblock code {padding:0; font-size:15px;}
.transclusion { border-radius: .25rem; }
.transclusion__content > *:not(.binary-container) {margin: 0.5rem; }
.transclusion__link {display: block; text-align: right; font-style: italic; margin-top: .5rem; margin-right: .25rem; text-decoration: none;}
.transclusion__link::before {content: "⇐ ";}
/* Derived from https://commons.wikimedia.org/wiki/File:U%2B21D2.svg */
.launchpad__entry { list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.0' width='25' height='12'%3E%3Cg transform='scale(0.7,0.8) translate(-613.21429,-421)'%3E%3Cpath fill='%23999' d='M 638.06773,429.49751 L 631.01022,436.87675 L 630.1898,436.02774 L 632.416,433.30375 L 613.46876,433.30375 L 613.46876,431.66382 L 633.82089,431.66382 L 635.57789,429.5261 L 633.79229,427.35979 L 613.46876,427.35979 L 613.46876,425.71985 L 632.416,425.71985 L 630.1898,422.99587 L 631.01022,422.08788 L 638.06773,429.49751 z '/%3E%3C/g%3E%3C/svg%3E"); }
.binary-container { width: 100%; text-align: center; }
.binary-container_with-img img,
.binary-container_with-video video,
.binary-container_with-audio audio { max-width: 100%; max-height: 30em; width: auto; }
.subhyphae__title { padding-bottom: .5rem; clear: both; }
.navi-title { padding-bottom: .5rem; margin: .25rem 0; }
.navi-title a {text-decoration:none; }
.navi-title__separator { margin: 0 .25rem; }
.navi-title__colon { margin-right: .5rem; }
.upload-amnt { clear: both; padding: .5rem; border-radius: .25rem; }
.upload-amnt__unattach { display: block; }
aside { clear: both; }
.img-gallery { text-align: center; margin-top: .25rem; margin-bottom: .25rem; }
.img-gallery_many-images { border-radius: .25rem; padding: .5rem; }
.img-gallery img { max-width: 100%; max-height: 50vh; }
figure { margin: 0; }
figcaption { padding-bottom: .5rem; }
#new-name {width:100%;}
.rc-entry { display: grid; list-style-type: none; padding: .25rem; grid-template-columns: 1fr 1fr; border-radius: .25rem; }
.rc-entry__time { font-style: italic; }
.rc-entry__hash { font-style: italic; text-align: right; }
.rc-entry__links, .rc-entry__msg { grid-column: 1 / span 2; }
.rc-entry__author { font-style: italic; }
.prevnext__el { display: inline-block; min-width: 40%; padding: .5rem; margin-bottom: .25rem; text-decoration: none; border-radius: .25rem; max-width: 49%; }
.prevnext__prev { float: left; }
.prevnext__next { float: right; text-align: right; }
.page-separator { clear: both; }
.history__entries { background-color: #eee; margin: 0; padding: 0; border-radius: .25rem; }
.history__month-anchor { text-decoration: none; color: inherit; }
.history__entry { list-style-type: none; padding: .25rem; }
.history-entry { padding: .25rem; }
.history-entry__time { font-weight: bold; }
.history-entry__author { font-style: italic; }
table { border: #ddd 1px solid; border-radius: .25rem; min-width: 4rem; }
td { padding: .25rem; }
caption { caption-side: top; font-size: small; }
.subhyphae__list, .subhyphae__list ul { display: flex; padding: 0; margin: 0; flex-wrap: wrap; }
.subhyphae__list ul { font-size: 90%; }
.subhyphae__entry { list-style-type: none; border: 1px solid #999; padding: 0; margin: .125rem; border-radius: .25rem; }
.subhyphae__link { display: block; padding: .25rem; text-decoration: none; }
.subhyphae__link:hover { background: #eee; }
.relative-hyphae__list { padding: 0; margin: 0; }
.relative-hyphae__entry { clear: both; }
.relative-hyphae__count { display: inline-block; float: right; }
.relative-hyphae__entry_this { padding: .25rem .5rem; font-weight: bold; }
.relative-hyphae__link { text-decoration: none; display: block; padding: .25rem .5rem; }
::-webkit-file-upload-button,
.btn { line-height: normal; display: inline-block; border: 1px #999 solid; border-radius: .25rem; text-decoration: none; padding: .25rem; font-size: 1rem; margin: 0; }
.btn_weak { border: 1px #999 dashed; }
/* Color stuff */
/* Lighter stuff #eee */
::-webkit-file-upload-button, .btn { background-color: #eee; color: black; }
.btn:visited { color: black; }
.btn_weak { background-color: transparent; }
article code,
article .codeblock,
.transclusion,
.img-gallery_many-images,
.rc-entry,
.prevnext__el,
table { background-color: #eee; }
.hypha-tabs__tab { background-color: #eee; }
.hypha-tabs__tab a { color: black; }
.hypha-tabs__tab_active { border-bottom: 2px white solid; background: white; }
@media screen and (max-width: 800px) {
.hypha-tabs,
.hypha-tabs__tab { background-color: white; }
}
@media screen and (min-width: 801px) {
.hypha-tabs__tab { border: 1px #ddd solid; }
.hypha-tabs__tab_active { border-bottom: 1px white solid; }
}
.layout-card { border-radius: .25rem; background-color: white; }
.layout-card__title { font-size: 1rem; margin: 0; padding: .25rem .5rem; border-radius: .25rem .25rem 0 0; }
.layout-card__title { border-bottom: 1px solid #eee; }
/* Other stuff */
html { background-color: #eee;
}
header { background-color: #eee; }
.header-links__link { color: black; }
.header-links__link:hover { background-color: #ddd; }
main { background-color: white; }
blockquote { border-left: 2px #999 solid; }
.wikilink_new {color:#a55858;}
.transclusion code, .transclusion .codeblock {background-color:#ddd;}
.transclusion__link { color: black; }
.wikilink_new:visited {color:#a55858;}
.navi-title { border-bottom: #eee 1px solid; }
.upload-amnt { border: #eee 1px solid; }
td { border: #ddd 1px solid; }
.relative-hyphae__link:hover, .backlinks__link:hover { background-color: #eee; }
/* Dark theme! */
@media (prefers-color-scheme: dark) {
html { background: #222; color: #ddd; }
main, article, .hypha-tabs__tab, header, .layout-card { background-color: #343434; color: #ddd; }
a, .wikilink_external { color: #f1fa8c; }
a:visited, .wikilink_external:visited { color: #ffb86c; }
.wikilink_new, .wikilink_new:visited { color: #dd4444; }
.subhyphae__link:hover, .relative-hyphae__link:hover, .backlinks__link:hover { background-color: #444; }
.header-links__link, .header-links__link:visited,
.prevnext__el, .prevnext__el:visited { color: #ddd; }
.header-links__link:hover { background-color: #444; }
.hypha-tabs__tab a, .hypha-tabs__tab { color: #ddd; background-color: #232323; border: 0; }
.layout-card__title, .hypha-tabs__tab_active { background-color: #343434; }
.transclusion .transclusion__link { color: #ddd; }
input[type="text"], input[type="password"],
::-webkit-file-upload-button,
.btn,
article code,
article .codeblock,
.transclusion,
.img-gallery_many-images,
.rc-entry,
.history__entry,
.prevnext__el,
.upload-amnt,
textarea,
table { border: 0; background-color: #444444; color: #ddd; }
.btn:visited { color: #ddd;}
.btn { border: #444 solid 1px; border-radius: .25rem; }
.btn_weak { background-color: transparent; }
.transclusion code,
.transclusion .codeblock { background-color: #454545; }
mark { background: rgba(130, 80, 30, 5); color: inherit; }
@media screen and (max-width: 800px) {
.hypha-tabs { background-color: #232323; }
}
}