From 3c02dc1c0cd480fc11647ec0f7900d4034a00cc4 Mon Sep 17 00:00:00 2001 From: Jason McCormick Date: Thu, 9 Oct 2025 12:49:05 -0400 Subject: initial add --- assets/sass/base/_page.scss | 42 +++++++++ assets/sass/base/_reset.scss | 76 ++++++++++++++++ assets/sass/base/_typography.scss | 183 ++++++++++++++++++++++++++++++++++++++ 3 files changed, 301 insertions(+) create mode 100644 assets/sass/base/_page.scss create mode 100644 assets/sass/base/_reset.scss create mode 100644 assets/sass/base/_typography.scss (limited to 'assets/sass/base') diff --git a/assets/sass/base/_page.scss b/assets/sass/base/_page.scss new file mode 100644 index 0000000..2c33426 --- /dev/null +++ b/assets/sass/base/_page.scss @@ -0,0 +1,42 @@ +/// +/// Dimension by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Basic */ + + // MSIE: Required for IEMobile. + @-ms-viewport { + width: device-width; + } + + // Ensures page width is always >=320px. + @include breakpoint('<=xsmall') { + html, body { + min-width: 320px; + } + } + + // Set box model to border-box. + // Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice + html { + box-sizing: border-box; + } + + *, *:before, *:after { + box-sizing: inherit; + } + + body { + background: _palette(bg); + + // Stops initial animations until page loads. + &.is-preload { + *, *:before, *:after { + @include vendor('animation', 'none !important'); + @include vendor('transition', 'none !important'); + } + } + + } \ No newline at end of file diff --git a/assets/sass/base/_reset.scss b/assets/sass/base/_reset.scss new file mode 100644 index 0000000..ddcf73e --- /dev/null +++ b/assets/sass/base/_reset.scss @@ -0,0 +1,76 @@ +/// +/// Dimension by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +// Reset. +// Based on meyerweb.com/eric/tools/css/reset (v2.0 | 20110126 | License: public domain) + + html, body, div, span, applet, object, + iframe, h1, h2, h3, h4, h5, h6, p, blockquote, + pre, a, abbr, acronym, address, big, cite, + code, del, dfn, em, img, ins, kbd, q, s, samp, + small, strike, strong, sub, sup, tt, var, b, + u, i, center, dl, dt, dd, ol, ul, li, fieldset, + form, label, legend, table, caption, tbody, + tfoot, thead, tr, th, td, article, aside, + canvas, details, embed, figure, figcaption, + footer, header, hgroup, menu, nav, output, ruby, + section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + } + + article, aside, details, figcaption, figure, + footer, header, hgroup, menu, nav, section { + display: block; + } + + body { + line-height: 1; + } + + ol, ul { + list-style:none; + } + + blockquote, q { + quotes: none; + + &:before, + &:after { + content: ''; + content: none; + } + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + body { + -webkit-text-size-adjust: none; + } + + mark { + background-color: transparent; + color: inherit; + } + + input::-moz-focus-inner { + border: 0; + padding: 0; + } + + input, select, textarea { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + } \ No newline at end of file diff --git a/assets/sass/base/_typography.scss b/assets/sass/base/_typography.scss new file mode 100644 index 0000000..bc9b7cc --- /dev/null +++ b/assets/sass/base/_typography.scss @@ -0,0 +1,183 @@ +/// +/// Dimension by HTML5 UP +/// html5up.net | @ajlkn +/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +/// + +/* Type */ + + html { + font-size: 16pt; + + @include breakpoint('<=xlarge') { + font-size: 12pt; + } + + @include breakpoint('<=small') { + font-size: 11pt; + } + + @include breakpoint('<=xxsmall') { + font-size: 10pt; + } + } + + body, input, select, textarea { + color: _palette(fg); + font-family: _font(family); + font-weight: _font(weight); + font-size: 1rem; + line-height: 1.65; + } + + a { + @include vendor('transition', ( + 'color #{_duration(transition)} ease-in-out', + 'background-color #{_duration(transition)} ease-in-out', + 'border-bottom-color #{_duration(transition)} ease-in-out' + )); + border-bottom: dotted 1px _palette(fg-light); + text-decoration: none; + color: inherit; + + &:hover { + border-bottom-color: transparent; + } + } + + strong, b { + color: _palette(fg-bold); + font-weight: _font(weight-bold); + } + + em, i { + font-style: italic; + } + + p { + margin: 0 0 _size(element-margin) 0; + } + + h1, h2, h3, h4, h5, h6 { + color: _palette(fg-bold); + font-weight: _font(weight-bold); + line-height: 1.5; + margin: 0 0 (_size(element-margin) * 0.5) 0; + text-transform: uppercase; + letter-spacing: _font(letter-spacing); + + a { + color: inherit; + text-decoration: none; + } + + &.major { + border-bottom: solid _size(border-width) _palette(border); + width: -moz-max-content; + width: -webkit-max-content; + width: -ms-max-content; + width: max-content; + padding-bottom: 0.5rem; + margin: 0 0 (_size(element-margin) * 1) 0; + } + } + + h1 { + font-size: 2.25rem; + line-height: 1.3; + letter-spacing: _font(letter-spacing-heading); + } + + h2 { + font-size: 1.5rem; + line-height: 1.4; + letter-spacing: _font(letter-spacing-heading); + } + + h3 { + font-size: 1rem; + } + + h4 { + font-size: 0.8rem; + } + + h5 { + font-size: 0.7rem; + } + + h6 { + font-size: 0.6rem; + } + + @include breakpoint('<=small') { + h1 { + font-size: 1.75rem; + line-height: 1.4; + } + + h2 { + font-size: 1.25em; + line-height: 1.5; + } + } + + sub { + font-size: 0.8rem; + position: relative; + top: 0.5rem; + } + + sup { + font-size: 0.8rem; + position: relative; + top: -0.5rem; + } + + blockquote { + border-left: solid (_size(border-width) * 4) _palette(border); + font-style: italic; + margin: 0 0 _size(element-margin) 0; + padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin); + } + + code { + background: _palette(border-bg); + border-radius: _size(border-radius); + font-family: _font(family-fixed); + font-size: 0.9rem; + margin: 0 0.25rem; + padding: 0.25rem 0.65rem; + } + + pre { + -webkit-overflow-scrolling: touch; + font-family: _font(family-fixed); + font-size: 0.9rem; + margin: 0 0 _size(element-margin) 0; + + code { + display: block; + line-height: 1.75; + padding: 1rem 1.5rem; + overflow-x: auto; + } + } + + hr { + border: 0; + border-bottom: solid _size(border-width) _palette(border); + margin: (_size(element-margin) * 1.375) 0; + } + + .align-left { + text-align: left; + } + + .align-center { + text-align: center; + } + + .align-right { + text-align: right; + } \ No newline at end of file -- cgit v1.2.3