discourse/app/assets/stylesheets/common/foundation/base.scss

141 lines
2.1 KiB
SCSS
Raw Normal View History

@import "./variables";
@import "./mixins";
2013-02-06 03:16:51 +08:00
// --------------------------------------------------
// Base styles for HTML elements
// --------------------------------------------------
html {
color: $primary;
font-family: $base-font-family;
font-size: $base-font-size;
2018-01-13 06:27:38 +08:00
line-height: $line-height-large;
background-color: $secondary;
2013-02-06 03:16:51 +08:00
overflow-y: scroll;
direction: ltr;
&.text-size-smaller {
font-size: $base-font-size-smaller;
}
&.text-size-larger {
font-size: $base-font-size-larger;
}
&.text-size-largest {
font-size: $base-font-size-largest;
}
}
2013-02-06 03:16:51 +08:00
// Links
// --------------------------------------------------
a {
color: $tertiary;
2013-02-06 03:16:51 +08:00
text-decoration: none;
cursor: pointer;
2013-02-06 03:16:51 +08:00
&:visited {
color: $tertiary;
2013-02-06 03:16:51 +08:00
}
&:hover {
color: $tertiary;
2013-02-06 03:16:51 +08:00
}
&:active {
color: $tertiary;
2013-02-06 03:16:51 +08:00
}
}
// Typography
// --------------------------------------------------
hr {
display: block;
height: 1px;
margin: 1em 0;
border: 0;
2017-06-12 10:20:14 +08:00
border-top: 1px solid $primary-low;
2013-02-06 03:16:51 +08:00
padding: 0;
}
// Lists
// --------------------------------------------------
ul,
dd {
margin: 0 0 9px 25px;
padding: 0;
}
.cooked ul,
.cooked ol,
.cooked dd {
clear: both;
}
.cooked ul,
.d-editor-preview ul {
margin: 0;
padding-left: 40px;
}
2013-02-06 03:16:51 +08:00
li {
> ul,
> ol {
margin-bottom: 0;
}
}
// Embedded content
// --------------------------------------------------
img {
vertical-align: middle;
}
// Forms
// --------------------------------------------------
fieldset {
margin: 0;
border: 0;
padding: 0;
}
2013-06-20 15:46:18 +08:00
pre code {
overflow: auto;
tab-size: 4;
2013-06-20 15:46:18 +08:00
}
// TODO figure out a clean place to put stuff like this
.row:before,
.row:after {
display: table;
content: "";
}
.row:after {
clear: both;
}
2014-12-04 21:48:25 +08:00
#offscreen-content {
display: none;
}
// Tables
// --------------------------------------------------
tbody {
border-top: 3px solid $primary-low;
}
tr {
border-bottom: 1px solid $primary-low;
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
}
}
2018-08-04 01:37:08 +08:00
// https://en.wikipedia.org/wiki/Ruby_character
ruby > rt {
font-size: 72%; // ~10px with 14px base
}