c391799d02
- added list for deprecated packages - removed deprecated node packages - reactivated gulp vendor task - work on intro page - redefined interactive styles - better variables in config
297 lines
3.5 KiB
SCSS
297 lines
3.5 KiB
SCSS
// Text-Level semantics
|
|
// -----------------------------------------------------------------------------
|
|
// a
|
|
// em
|
|
// strong
|
|
// small
|
|
// s
|
|
// cite
|
|
// q
|
|
// dfn
|
|
// abbr
|
|
// ruby
|
|
// rb
|
|
// rt
|
|
// rtc
|
|
// rp
|
|
// data
|
|
// time
|
|
// code
|
|
// var
|
|
// samp
|
|
// kbd
|
|
// sub
|
|
// sup
|
|
// i
|
|
// b
|
|
// u
|
|
// mark
|
|
// bdi
|
|
// bdo
|
|
// span
|
|
// br
|
|
// wbr
|
|
// -----------------------------------------------------------------------------
|
|
// Edits
|
|
// -----------------------------------------------------------------------------
|
|
// ins
|
|
// del
|
|
|
|
|
|
|
|
// Links
|
|
a {
|
|
color: $basic_link_color;
|
|
// color: lighten($basic_action_color, 20%);
|
|
text-decoration: none;
|
|
|
|
&:active,
|
|
&:focus,
|
|
&:hover {
|
|
color: $basic_highlight_color;
|
|
}
|
|
}
|
|
|
|
.a_line {
|
|
border-bottom-width: $tiny_space;
|
|
border-bottom-style: dotted;
|
|
border-color: $basic_border_color;
|
|
background-color: transparent;
|
|
color: $basic_font_color;
|
|
transition: color $basic_duration $basic_timing;
|
|
|
|
&:active,
|
|
&:focus,
|
|
&:hover {
|
|
background-color: $basic_action_color;
|
|
color: $basic_highlight_color;
|
|
}
|
|
}
|
|
|
|
.a_button {
|
|
@extend %default_button;
|
|
}
|
|
|
|
.a_button_text {
|
|
@extend %default_button;
|
|
padding: $wide_padding;
|
|
background-color: transparent;
|
|
color: $basic_font_color;
|
|
}
|
|
|
|
.a_button_border {
|
|
@extend .a_button_text;
|
|
border: $cell_border;
|
|
}
|
|
|
|
|
|
// Italic, Emphasis
|
|
i, em {
|
|
font-style: italic;
|
|
}
|
|
|
|
.i_bright {
|
|
font-style: normal;
|
|
color: $basic_highlight_color;
|
|
}
|
|
|
|
// Bold, Strong
|
|
b, strong {
|
|
font-weight: 500; // TODO maybe bolder
|
|
}
|
|
|
|
// Small
|
|
small {
|
|
|
|
}
|
|
|
|
// No longer accurate or no longer relevant
|
|
s {
|
|
|
|
}
|
|
|
|
// Citation
|
|
cite {
|
|
font-style: italic;
|
|
}
|
|
|
|
// Phrasing content, quoted
|
|
q {
|
|
|
|
}
|
|
|
|
dfn {
|
|
|
|
}
|
|
|
|
abbr {
|
|
|
|
}
|
|
|
|
ruby {
|
|
|
|
}
|
|
|
|
rb {
|
|
|
|
}
|
|
|
|
rt {
|
|
|
|
}
|
|
|
|
rtc {
|
|
|
|
}
|
|
|
|
rp {
|
|
|
|
}
|
|
|
|
data {
|
|
|
|
}
|
|
|
|
time {
|
|
|
|
}
|
|
|
|
// Code
|
|
code {
|
|
@extend %basic_mono;
|
|
color: lighten($basic_font_color, $basic_color_diff);
|
|
background-color: lighten($basic_back_color, $tiny_color_diff);
|
|
}
|
|
.code_solo {
|
|
@extend %basic_mono;
|
|
padding: $tiny_space $half_space;
|
|
color: $basic_font_color;
|
|
}
|
|
|
|
var {
|
|
|
|
}
|
|
|
|
samp {
|
|
|
|
}
|
|
|
|
kbd {
|
|
@extend %basic_mono;
|
|
// font-size: .9em;
|
|
// font-weight: bold;
|
|
padding: 0 $half_space;
|
|
border-width: $basic_border_width;
|
|
border-style: solid;
|
|
border-color: darken($basic_back_color, $basic_color_diff);
|
|
border-radius: $basic_corner;
|
|
color: lighten($basic_font_color, $basic_color_diff);
|
|
}
|
|
|
|
sub, sup {
|
|
|
|
}
|
|
|
|
u {
|
|
|
|
}
|
|
|
|
// Marks
|
|
mark {
|
|
background-color: $alpha_color;
|
|
}
|
|
.mark_cursor, ::-moz-selection, ::selection {
|
|
color: invert($basic_font_color);
|
|
background-color: $basic_font_color;
|
|
}
|
|
|
|
bdi, bdo {
|
|
|
|
}
|
|
|
|
// Span
|
|
span {
|
|
|
|
}
|
|
.span_solo {
|
|
@extend %solo;
|
|
}
|
|
|
|
// Linebreak
|
|
br {
|
|
|
|
}
|
|
|
|
wbr {
|
|
|
|
}
|
|
|
|
|
|
|
|
// Edits
|
|
// -----------------------------------------------------------------------------
|
|
|
|
ins {
|
|
|
|
}
|
|
|
|
del {
|
|
|
|
}
|
|
|
|
|
|
|
|
// General Classes
|
|
// ------------------------------------------------------------------------------
|
|
.txt_tiny {
|
|
font-size: .5em !important;
|
|
}
|
|
|
|
.txt_smaller {
|
|
font-size: .75em !important;
|
|
}
|
|
|
|
.txt_larger {
|
|
font-size: 1.2em !important;
|
|
}
|
|
|
|
.txt_huge {
|
|
font-size: 3em !important;
|
|
}
|
|
|
|
.txt_hero {
|
|
font-size: $hero_size_1;
|
|
}
|
|
|
|
.txt_center {
|
|
text-align: center !important;
|
|
}
|
|
.txt_right {
|
|
text-align: right !important;
|
|
}
|
|
.txt_left {
|
|
text-align: left !important;
|
|
}
|
|
|
|
.txt_top {
|
|
vertical-align: top !important;
|
|
}
|
|
|
|
.txt_bottom {
|
|
vertical-align: bottom !important;
|
|
}
|
|
|
|
.txt_white {
|
|
color: white;
|
|
}
|
|
|
|
.txt_black {
|
|
color: black;
|
|
}
|
|
|
|
.txt_gradient {
|
|
background: linear-gradient(165deg, $alpha_color 30%, $bravo_color 45%, $charlie_color 50%, $delta_color, $echo_color 80%, $foxtrot_color);
|
|
background-clip: text;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
}
|