blob: d532e94e74727a99c93c781e3c2f8f25266a2212 [file] [log] [blame]
/* Pure CSS */
@import "../web_modules/purecss/build/base.css";
@import "../web_modules/purecss/build/buttons.css";
@import "../web_modules/purecss/build/forms.css";
@import "../web_modules/purecss/build/menus.css";
@import "../web_modules/purecss/build/tables.css";
/* Normalize + OpenType */
@import "../web_modules/normalize-opentype.css/normalize-opentype.css";
/* Sanitize.css */
@import "../web_modules/sanitize.css/forms.css";
@import "../web_modules/sanitize.css/typography.css";
/* */
@import "./fonts/rochester.css";
@import "./fonts/source.css";
@viewport {
width: device-width;
zoom: 1; }
html {
--main-bg-color: #f8f8f8;
--header-bg-color: #ffffff;
--nav-bg-color: #ffffff;
--footer-bg-color: #ffffff;
/*background-color: #f8f8f8;*/
font-family: 'Source Sans Pro', Optima, 'MgOpen Cosmetica', Candara, Palatino, 'Palatino Linotype', 'Book Antiqua', 'URW Palladio L', 'Gentium Alt', 'Gentium', Geneva, Georgia, serif;
}
nav ol,
nav ul {
list-style: none;
padding: 0;
}
code, kbd, samp, pre {
font-family: 'Source Code Pro', monospace;
}
body {
display: grid;
}
body {
grid-template-columns: 1fr;
grid-gap: 0;
grid-template-areas:
"header"
"navbar"
"main"
"footer";
}
@media (max-width: 30em) {
body > main {
border-top: 1px solid lightgray
}
}
@media (min-width: 30em) {
body {
grid-template-columns: 1fr 3fr;
grid-template-rows: auto 1fr auto;
grid-gap: 0;
grid-template-areas:
"header main"
"navbar main"
"footer footer";
}
body > nav > ol > li.this-page {
width: calc(100% + 3px);
}
}
body > header {
grid-area: header;
flex: min-content;
text-align: center;
horiz-align: center;
background-color: var(--main-bg-color);
border-bottom: 1px solid lightgray;
}
body > header a {
text-decoration: none;
}
body > header h1 {
font-size: 1em;
}
.small-title {
font-size: 1em;
}
body > nav {
grid-area: navbar;
background-color: var(--nav-bg-color);
}
body > nav > ol {
display: flex;
flex-direction: column;
}
body > nav > ol > li {
flex: auto;
}
body > nav > ol > li.indented {
text-indent: 1em;
}
body > nav > ol > li.this-page {
background-color: var(--main-bg-color);
border: 1px solid lightgray;
border-right: 1px solid var(--main-bg-color);
z-index: 1;
}
body > nav > ol > li > * {
text-decoration: none;
display: block;
padding: 5px;
padding-left: 1em;
}
body > nav a:hover {
background-color: #f8f8f8;
}
body > nav li[data-site-section="About"], body > nav li[data-site-section="Login"] {
margin-top: 1em;
}
.login-text {
font-style: italic;
}
.login-name {
font-style: normal;
font-size: larger;
font-family: Rochester, cursive;
}
body > main {
grid-area: main;
background-color: var(--main-bg-color);
padding: 10px;
border-left: 1px solid lightgray;
overflow: auto;
display: flex;
flex-direction: column;
}
main > * {
margin-top: 0.5rem;
}
main > *:first-child {
margin-top: 0;
}
body > footer {
grid-area: footer;
background-color: var(--footer-bg-color);
horiz-align: right;
text-align: right;
padding: 0.5em 0.5em;
border-top: lightgray solid 1px;
}
.post-day {
margin: 0.5em 0;
}
.bookmark-title-section {
display: inline;
}
a.bookmark-title {
text-decoration: none;
margin-right: 1em;
}
.bookmark-title {
font-size: 1em;
margin: 0;
padding: 0;
display: inline;
font-weight: normal;
}
.bookmark-symbol {
font-size: smaller;
}
.post-day-info {
font-size: smaller;
font-style: italic;
}
.post-owner {
font-size: smaller;
color: #555;
}
.post-self-link {
padding-left: 5px;
padding-right: 5px;
}
.bookmark-info {
font-style: italic;
margin: 0;
padding: 0;
flex: auto;
}
.bookmark-controls {
float: right;
}
article.bookmark {
border: 1px solid #e0b0b0;
padding: 0.3em;
background: #f8f0f0;
}
article.bookmark > header {
display: inline-flex;
margin-right: 5px;
line-height: 1em;
}
.post-with-nonempty-body > header {
float: left;
}
.lazychat-message-info {
font-style: italic;
margin: 0;
padding: 0;
flex: auto;
}
article.lazychat-message {
border: 1px solid #a0c0c0;
padding: 0.3em;
background: #f0f8f0;
}
article.lazychat-message > header {
display: flex;
float: left;
margin-right: 5px;
line-height: 1em;
}
a.post-link {
text-decoration: none;
}
#bookmark-submission textarea {
min-width: calc(100% - 12em);
}
elix-expandable-section.editor-pane::part(toggle) {
margin: 0;
display: inline;
}
elix-expandable-section.editor-pane::part(header) {
display: inline-block;
}
.bookmark-edit-button {
font-size: small;
}
.bookmark-message-controls {
flex: initial;
}
.lazychat-edit-button {
font-size: small;
}
.lazychat-message-controls {
float: right;
}
.post-content > :first-child {
margin-top: 0;
}
.post-content > :last-child {
margin-bottom: 0;
}
.bookmark-description > :nth-child(2) {
margin-top: 0;
}
.bookmark-description > blockquote :first-child {
margin-top: 0;
}
.bookmark-description > blockquote :last-child {
margin-bottom: 0;
}
.paging {
display: flex;
flex-direction: row;
flex-wrap: wrap-reverse;
}
.paging > .filler {
flex: 1;
}
.paging > a {
flex-grow: 0;
flex-shrink: 1;
flex-basis: content;
}
elix-expandable-section .expandable-section-title {
margin-top: 0;
margin-bottom: 0;
}