2013-02-05 13:16:51 -06:00
|
|
|
// --------------------------------------------------
|
|
|
|
// Base styles for HTML elements
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
html {
|
2020-08-03 21:57:10 -05:00
|
|
|
color: var(--primary);
|
2014-12-17 01:26:29 -06:00
|
|
|
font-family: $base-font-family;
|
|
|
|
font-size: $base-font-size;
|
2018-01-12 16:27:38 -06:00
|
|
|
line-height: $line-height-large;
|
2020-08-03 21:57:10 -05:00
|
|
|
background-color: var(--secondary);
|
2013-02-05 13:16:51 -06:00
|
|
|
overflow-y: scroll;
|
2015-04-14 21:07:23 -05:00
|
|
|
direction: ltr;
|
2019-01-14 07:21:46 -06:00
|
|
|
|
2020-07-07 12:08:19 -05:00
|
|
|
&.text-size-smallest {
|
|
|
|
font-size: $base-font-size-smallest;
|
|
|
|
}
|
|
|
|
|
2019-01-17 09:30:34 -06:00
|
|
|
&.text-size-smaller {
|
|
|
|
font-size: $base-font-size-smaller;
|
|
|
|
}
|
|
|
|
|
2019-01-14 07:21:46 -06:00
|
|
|
&.text-size-larger {
|
|
|
|
font-size: $base-font-size-larger;
|
|
|
|
}
|
|
|
|
|
|
|
|
&.text-size-largest {
|
|
|
|
font-size: $base-font-size-largest;
|
|
|
|
}
|
2014-07-02 09:55:43 -05:00
|
|
|
}
|
2013-02-05 13:16:51 -06:00
|
|
|
|
|
|
|
// Links
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
a {
|
2020-08-03 21:57:10 -05:00
|
|
|
color: var(--tertiary);
|
2013-02-05 13:16:51 -06:00
|
|
|
text-decoration: none;
|
2013-06-16 22:43:30 -05:00
|
|
|
cursor: pointer;
|
2013-02-05 13:16:51 -06:00
|
|
|
&:visited {
|
2020-08-03 21:57:10 -05:00
|
|
|
color: var(--tertiary);
|
2013-02-05 13:16:51 -06:00
|
|
|
}
|
|
|
|
&:hover {
|
2020-08-03 21:57:10 -05:00
|
|
|
color: var(--tertiary);
|
2013-02-05 13:16:51 -06:00
|
|
|
}
|
|
|
|
&:active {
|
2020-08-03 21:57:10 -05:00
|
|
|
color: var(--tertiary);
|
2013-02-05 13:16:51 -06:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Typography
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
hr {
|
|
|
|
display: block;
|
|
|
|
height: 1px;
|
|
|
|
margin: 1em 0;
|
|
|
|
border: 0;
|
2020-08-03 21:57:10 -05:00
|
|
|
border-top: 1px solid var(--primary-low);
|
2013-02-05 13:16:51 -06:00
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Lists
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
ul,
|
|
|
|
dd {
|
|
|
|
margin: 0 0 9px 25px;
|
|
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
2018-06-08 04:49:31 -05:00
|
|
|
.cooked ul,
|
|
|
|
.cooked ol,
|
|
|
|
.cooked dd {
|
2014-03-27 14:36:14 -05:00
|
|
|
clear: both;
|
2014-03-15 11:01:17 -05:00
|
|
|
}
|
|
|
|
|
2018-06-08 04:49:31 -05:00
|
|
|
.cooked ul,
|
|
|
|
.d-editor-preview ul {
|
2017-07-25 17:24:11 -05:00
|
|
|
margin: 0;
|
|
|
|
padding-left: 40px;
|
|
|
|
}
|
|
|
|
|
2013-02-05 13:16:51 -06:00
|
|
|
li {
|
|
|
|
> ul,
|
|
|
|
> ol {
|
|
|
|
margin-bottom: 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Embedded content
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
img {
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Forms
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
fieldset {
|
|
|
|
margin: 0;
|
|
|
|
border: 0;
|
|
|
|
padding: 0;
|
2013-06-16 22:43:30 -05:00
|
|
|
}
|
2013-06-20 02:46:18 -05:00
|
|
|
|
|
|
|
pre code {
|
|
|
|
overflow: auto;
|
2020-05-05 20:00:40 -05:00
|
|
|
-moz-tab-size: 4;
|
2017-01-10 03:06:53 -06:00
|
|
|
tab-size: 4;
|
2020-07-08 19:50:42 -05:00
|
|
|
&.lang-markdown {
|
|
|
|
white-space: pre-wrap;
|
|
|
|
}
|
2013-06-20 02:46:18 -05:00
|
|
|
}
|
2014-08-25 16:41:14 -05:00
|
|
|
|
|
|
|
// TODO figure out a clean place to put stuff like this
|
2018-06-08 04:49:31 -05:00
|
|
|
.row:before,
|
|
|
|
.row:after {
|
2014-08-25 16:41:14 -05:00
|
|
|
display: table;
|
|
|
|
content: "";
|
|
|
|
}
|
2018-06-08 04:49:31 -05:00
|
|
|
.row:after {
|
|
|
|
clear: both;
|
|
|
|
}
|
2014-08-25 16:41:14 -05:00
|
|
|
|
2014-12-04 07:48:25 -06:00
|
|
|
#offscreen-content {
|
|
|
|
display: none;
|
|
|
|
}
|
2018-04-30 19:45:49 -05:00
|
|
|
|
|
|
|
// Tables
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
2020-07-06 08:25:41 -05:00
|
|
|
table {
|
|
|
|
border-collapse: collapse;
|
|
|
|
}
|
|
|
|
|
2018-04-30 19:45:49 -05:00
|
|
|
tbody {
|
2020-08-03 21:57:10 -05:00
|
|
|
border-top: 3px solid var(--primary-low);
|
2018-04-30 19:45:49 -05:00
|
|
|
}
|
|
|
|
|
|
|
|
tr {
|
2020-08-03 21:57:10 -05:00
|
|
|
border-bottom: 1px solid var(--primary-low);
|
2018-04-30 19:45:49 -05:00
|
|
|
&.highlighted {
|
|
|
|
animation: background-fade-highlight 2.5s ease-out;
|
2018-06-08 04:49:31 -05:00
|
|
|
}
|
|
|
|
}
|
2018-08-03 12:37:08 -05:00
|
|
|
|
|
|
|
// https://en.wikipedia.org/wiki/Ruby_character
|
|
|
|
ruby > rt {
|
|
|
|
font-size: 72%; // ~10px with 14px base
|
|
|
|
}
|
2020-07-06 06:15:31 -05:00
|
|
|
|
|
|
|
// Buttons (was in normalized)
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
button,
|
|
|
|
html input[type="button"],
|
|
|
|
input[type="reset"],
|
|
|
|
input[type="submit"] {
|
|
|
|
cursor: pointer;
|
|
|
|
}
|