diff --git a/public/style.css b/public/style.css
index 6c7ee2a3..45c2094d 100644
--- a/public/style.css
+++ b/public/style.css
@@ -1,11 +1,11 @@
@charset "UTF-8";
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
-/* Document
+/* Document
========================================================================== */
-/**
- * 1. Correct the line height in all browsers.
- * 2. Prevent adjustments of font size after orientation changes in
- * IE on Windows Phone and in iOS.
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in
+ * IE on Windows Phone and in iOS.
*/
html {
line-height: 1.15;
@@ -15,16 +15,16 @@ html {
-webkit-text-size-adjust: 100%;
/* 2 */ }
-/* Sections
+/* Sections
========================================================================== */
-/**
- * Remove the margin in all browsers (opinionated).
+/**
+ * Remove the margin in all browsers (opinionated).
*/
body {
margin: 0; }
-/**
- * Add the correct display in IE 9-.
+/**
+ * Add the correct display in IE 9-.
*/
article,
aside,
@@ -34,19 +34,19 @@ nav,
section {
display: block; }
-/**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0; }
-/* Grouping content
+/* Grouping content
========================================================================== */
-/**
- * Add the correct display in IE 9-.
- * 1. Add the correct display in IE.
+/**
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in IE.
*/
figcaption,
figure,
@@ -54,15 +54,15 @@ main {
/* 1 */
display: block; }
-/**
- * Add the correct margin in IE 8.
+/**
+ * Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px; }
-/**
- * 1. Add the correct box sizing in Firefox.
- * 2. Show the overflow in Edge and IE.
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box;
@@ -72,9 +72,9 @@ hr {
overflow: visible;
/* 2 */ }
-/**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace;
@@ -82,11 +82,11 @@ pre {
font-size: 1em;
/* 2 */ }
-/* Text-level semantics
+/* Text-level semantics
========================================================================== */
-/**
- * 1. Remove the gray background on active links in IE 10.
- * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+/**
+ * 1. Remove the gray background on active links in IE 10.
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
background-color: transparent;
@@ -94,9 +94,9 @@ a {
-webkit-text-decoration-skip: objects;
/* 2 */ }
-/**
- * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+/**
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
@@ -106,23 +106,23 @@ abbr[title] {
text-decoration: underline dotted;
/* 2 */ }
-/**
- * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+/**
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
font-weight: inherit; }
-/**
- * Add the correct font weight in Chrome, Edge, and Safari.
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder; }
-/**
- * 1. Correct the inheritance and scaling of font size in all browsers.
- * 2. Correct the odd `em` font sizing in all browsers.
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
@@ -132,28 +132,28 @@ samp {
font-size: 1em;
/* 2 */ }
-/**
- * Add the correct font style in Android 4.3-.
+/**
+ * Add the correct font style in Android 4.3-.
*/
dfn {
font-style: italic; }
-/**
- * Add the correct background and color in IE 9-.
+/**
+ * Add the correct background and color in IE 9-.
*/
mark {
background-color: #ff0;
color: #000; }
-/**
- * Add the correct font size in all browsers.
+/**
+ * Add the correct font size in all browsers.
*/
small {
font-size: 80%; }
-/**
- * Prevent `sub` and `sup` elements from affecting the line height in
- * all browsers.
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
*/
sub,
sup {
@@ -168,39 +168,39 @@ sub {
sup {
top: -0.5em; }
-/* Embedded content
+/* Embedded content
========================================================================== */
-/**
- * Add the correct display in IE 9-.
+/**
+ * Add the correct display in IE 9-.
*/
audio,
video {
display: inline-block; }
-/**
- * Add the correct display in iOS 4-7.
+/**
+ * Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
display: none;
height: 0; }
-/**
- * Remove the border on images inside links in IE 10-.
+/**
+ * Remove the border on images inside links in IE 10-.
*/
img {
border-style: none; }
-/**
- * Hide the overflow in IE.
+/**
+ * Hide the overflow in IE.
*/
svg:not(:root) {
overflow: hidden; }
-/* Forms
+/* Forms
========================================================================== */
-/**
- * 1. Change the font styles in all browsers (opinionated).
- * 2. Remove the margin in Firefox and Safari.
+/**
+ * 1. Change the font styles in all browsers (opinionated).
+ * 2. Remove the margin in Firefox and Safari.
*/
button,
input,
@@ -216,28 +216,28 @@ textarea {
margin: 0;
/* 2 */ }
-/**
- * Show the overflow in IE.
- * 1. Show the overflow in Edge.
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
*/
button,
input {
/* 1 */
overflow: visible; }
-/**
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
- * 1. Remove the inheritance of text transform in Firefox.
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
/* 1 */
text-transform: none; }
-/**
- * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
- * controls in Android 4.
- * 2. Correct the inability to style clickable types in iOS and Safari.
+/**
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+ * controls in Android 4.
+ * 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type="button"],
@@ -246,8 +246,8 @@ html [type="button"],
-webkit-appearance: button;
/* 2 */ }
-/**
- * Remove the inner border and padding in Firefox.
+/**
+ * Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
@@ -256,8 +256,8 @@ button::-moz-focus-inner,
border-style: none;
padding: 0; }
-/**
- * Restore the focus styles unset by the previous rule.
+/**
+ * Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
@@ -265,17 +265,17 @@ button:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText; }
-/**
- * Correct the padding in Firefox.
+/**
+ * Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em; }
-/**
- * 1. Correct the text wrapping in Edge and IE.
- * 2. Correct the color inheritance from `fieldset` elements in IE.
- * 3. Remove the padding so developers are not caught out when they zero out
- * `fieldset` elements in all browsers.
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ * `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box;
@@ -291,9 +291,9 @@ legend {
white-space: normal;
/* 1 */ }
-/**
- * 1. Add the correct display in IE 9-.
- * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
+/**
+ * 1. Add the correct display in IE 9-.
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
display: inline-block;
@@ -301,15 +301,15 @@ progress {
vertical-align: baseline;
/* 2 */ }
-/**
- * Remove the default vertical scrollbar in IE.
+/**
+ * Remove the default vertical scrollbar in IE.
*/
textarea {
overflow: auto; }
-/**
- * 1. Add the correct box sizing in IE 10-.
- * 2. Remove the padding in IE 10-.
+/**
+ * 1. Add the correct box sizing in IE 10-.
+ * 2. Remove the padding in IE 10-.
*/
[type="checkbox"],
[type="radio"] {
@@ -318,16 +318,16 @@ textarea {
padding: 0;
/* 2 */ }
-/**
- * Correct the cursor style of increment and decrement buttons in Chrome.
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto; }
-/**
- * 1. Correct the odd appearance in Chrome and Safari.
- * 2. Correct the outline style in Safari.
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield;
@@ -335,16 +335,16 @@ textarea {
outline-offset: -2px;
/* 2 */ }
-/**
- * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+/**
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none; }
-/**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
@@ -352,57 +352,57 @@ textarea {
font: inherit;
/* 2 */ }
-/* Interactive
+/* Interactive
========================================================================== */
-/*
- * Add the correct display in IE 9-.
- * 1. Add the correct display in Edge, IE, and Firefox.
+/*
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in Edge, IE, and Firefox.
*/
details,
menu {
display: block; }
-/*
- * Add the correct display in all browsers.
+/*
+ * Add the correct display in all browsers.
*/
summary {
display: list-item; }
-/* Scripting
+/* Scripting
========================================================================== */
-/**
- * Add the correct display in IE 9-.
+/**
+ * Add the correct display in IE 9-.
*/
canvas {
display: inline-block; }
-/**
- * Add the correct display in IE.
+/**
+ * Add the correct display in IE.
*/
template {
display: none; }
-/* Hidden
+/* Hidden
========================================================================== */
-/**
- * Add the correct display in IE 10-.
+/**
+ * Add the correct display in IE 10-.
*/
[hidden] {
display: none; }
-/*
-
- VARIABLES
-
+/*
+
+ VARIABLES
+
*/
-/*
-
- DEBUG CHILDREN
- Docs: http://tachyons.io/docs/debug/
-
- Just add the debug class to any element to see outlines on its
- children.
-
+/*
+
+ DEBUG CHILDREN
+ Docs: http://tachyons.io/docs/debug/
+
+ Just add the debug class to any element to see outlines on its
+ children.
+
*/
.debug * {
outline: 1px solid gold; }
@@ -413,15 +413,15 @@ template {
.debug-black * {
outline: 1px solid black; }
-/*
-
- DEBUG GRID
- http://tachyons.io/docs/debug-grid/
-
- Can be useful for debugging layout issues
- or helping to make sure things line up perfectly.
- Just tack one of these classes onto a parent element.
-
+/*
+
+ DEBUG GRID
+ http://tachyons.io/docs/debug-grid/
+
+ Can be useful for debugging layout issues
+ or helping to make sure things line up perfectly.
+ Just tack one of these classes onto a parent element.
+
*/
.debug-grid {
background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg==) repeat top left; }
@@ -435,10 +435,10 @@ template {
.debug-grid-16-solid {
background: white url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII=) repeat top left; }
-/*
-
- BOX SIZING
-
+/*
+
+ BOX SIZING
+
*/
html,
body,
@@ -476,22 +476,22 @@ input[type="url"],
.border-box {
box-sizing: border-box; }
-/*
-
- ASPECT RATIOS
-
+/*
+
+ ASPECT RATIOS
+
*/
-/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
- * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
- * Make sure there are no height and width attributes on the embedded media.
- * Adapted from: https://github.com/suitcss/components-flex-embed
- *
- * Example:
- *
- *
- *
- *
- *
+/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
+ * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
+ * Make sure there are no height and width attributes on the embedded media.
+ * Adapted from: https://github.com/suitcss/components-flex-embed
+ *
+ * Example:
+ *
+ *
+ *
+ *
+ *
* */
.aspect-ratio, .timeline-item .timeline-content-box.embed {
height: 0;
@@ -648,30 +648,30 @@ input[type="url"],
height: 100%;
z-index: 100; } }
-/*
-
- IMAGES
- Docs: http://tachyons.io/docs/elements/images/
-
+/*
+
+ IMAGES
+ Docs: http://tachyons.io/docs/elements/images/
+
*/
/* Responsive images! */
img, video {
max-width: 100%; }
-/*
-
- BACKGROUND SIZE
- Docs: http://tachyons.io/docs/themes/background-size/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BACKGROUND SIZE
+ Docs: http://tachyons.io/docs/themes/background-size/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
-/*
- Often used in combination with background image set as an inline style
- on an html element.
+/*
+ Often used in combination with background image set as an inline style
+ on an html element.
*/
.cover {
background-size: cover !important; }
@@ -697,25 +697,25 @@ img, video {
.contain-l {
background-size: contain !important; } }
-/*
-
- BACKGROUND POSITION
-
- Base:
- bg = background
-
- Modifiers:
- -center = center center
- -top = top center
- -right = center right
- -bottom = bottom center
- -left = center left
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BACKGROUND POSITION
+
+ Base:
+ bg = background
+
+ Modifiers:
+ -center = center center
+ -top = top center
+ -right = center right
+ -bottom = bottom center
+ -left = center left
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.bg-center {
background-repeat: no-repeat;
@@ -788,15 +788,15 @@ img, video {
background-repeat: no-repeat;
background-position: center left; } }
-/*
-
- OUTLINES
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ OUTLINES
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.outline {
outline: 1px solid; }
@@ -831,27 +831,27 @@ img, video {
.outline-0-l {
outline: 0; } }
-/*
-
- BORDERS
- Docs: http://tachyons.io/docs/themes/borders/
-
- Base:
- b = border
-
- Modifiers:
- a = all
- t = top
- r = right
- b = bottom
- l = left
- n = none
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BORDERS
+ Docs: http://tachyons.io/docs/themes/borders/
+
+ Base:
+ b = border
+
+ Modifiers:
+ a = all
+ t = top
+ r = right
+ b = bottom
+ l = left
+ n = none
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.ba, .post-content th, .post-content td {
border-style: solid;
@@ -937,24 +937,24 @@ img, video {
border-style: none;
border-width: 0; } }
-/*
-
- BORDER COLORS
- Docs: http://tachyons.io/docs/themes/borders/
-
- Border colors can be used to extend the base
- border classes ba,bt,bb,br,bl found in the _borders.css file.
-
- The base border class by default will set the color of the border
- to that of the current text color. These classes are for the cases
- where you desire for the text and border colors to be different.
-
- Base:
- b = border
-
- Modifiers:
- --color-name = each color variable name is also a border color name
-
+/*
+
+ BORDER COLORS
+ Docs: http://tachyons.io/docs/themes/borders/
+
+ Border colors can be used to extend the base
+ border classes ba,bt,bb,br,bl found in the _borders.css file.
+
+ The base border class by default will set the color of the border
+ to that of the current text color. These classes are for the cases
+ where you desire for the text and border colors to be different.
+
+ Base:
+ b = border
+
+ Modifiers:
+ --color-name = each color variable name is also a border color name
+
*/
.b--black {
border-color: #000; }
@@ -1142,30 +1142,30 @@ img, video {
.b--inherit {
border-color: inherit; }
-/*
-
- BORDER RADIUS
- Docs: http://tachyons.io/docs/themes/border-radius/
-
- Base:
- br = border-radius
-
- Modifiers:
- 0 = 0/none
- 1 = 1st step in scale
- 2 = 2nd step in scale
- 3 = 3rd step in scale
- 4 = 4th step in scale
-
- Literal values:
- -100 = 100%
- -pill = 9999px
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BORDER RADIUS
+ Docs: http://tachyons.io/docs/themes/border-radius/
+
+ Base:
+ br = border-radius
+
+ Modifiers:
+ 0 = 0/none
+ 1 = 1st step in scale
+ 2 = 2nd step in scale
+ 3 = 3rd step in scale
+ 4 = 4th step in scale
+
+ Literal values:
+ -100 = 100%
+ -pill = 9999px
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.br0 {
border-radius: 0; }
@@ -1288,27 +1288,27 @@ img, video {
border-top-right-radius: 0;
border-bottom-right-radius: 0; } }
-/*
-
- BORDER STYLES
- Docs: http://tachyons.io/docs/themes/borders/
-
- Depends on base border module in _borders.css
-
- Base:
- b = border-style
-
- Modifiers:
- --none = none
- --dotted = dotted
- --dashed = dashed
- --solid = solid
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BORDER STYLES
+ Docs: http://tachyons.io/docs/themes/borders/
+
+ Depends on base border module in _borders.css
+
+ Base:
+ b = border-style
+
+ Modifiers:
+ --none = none
+ --dotted = dotted
+ --dashed = dashed
+ --solid = solid
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.b--dotted {
border-style: dotted; }
@@ -1352,27 +1352,27 @@ img, video {
.b--none-l {
border-style: none; } }
-/*
-
- BORDER WIDTHS
- Docs: http://tachyons.io/docs/themes/borders/
-
- Base:
- bw = border-width
-
- Modifiers:
- 0 = 0 width border
- 1 = 1st step in border-width scale
- 2 = 2nd step in border-width scale
- 3 = 3rd step in border-width scale
- 4 = 4th step in border-width scale
- 5 = 5th step in border-width scale
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BORDER WIDTHS
+ Docs: http://tachyons.io/docs/themes/borders/
+
+ Base:
+ bw = border-width
+
+ Modifiers:
+ 0 = 0 width border
+ 1 = 1st step in border-width scale
+ 2 = 2nd step in border-width scale
+ 3 = 3rd step in border-width scale
+ 4 = 4th step in border-width scale
+ 5 = 5th step in border-width scale
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.bw0 {
border-width: 0; }
@@ -1471,16 +1471,16 @@ img, video {
.bl-0-l {
border-left-width: 0; } }
-/*
-
- BOX-SHADOW
- Docs: http://tachyons.io/docs/themes/box-shadow/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ BOX-SHADOW
+ Docs: http://tachyons.io/docs/themes/box-shadow/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.shadow-1 {
box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.2); }
@@ -1533,41 +1533,41 @@ img, video {
.shadow-5-l {
box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.2); } }
-/*
-
- CODE
-
+/*
+
+ CODE
+
*/
.pre {
overflow-x: auto;
overflow-y: hidden;
overflow: scroll; }
-/*
-
- COORDINATES
- Docs: http://tachyons.io/docs/layout/position/
-
- Use in combination with the position module.
-
- Base:
- top
- bottom
- right
- left
-
- Modifiers:
- -0 = literal value 0
- -1 = literal value 1
- -2 = literal value 2
- --1 = literal value -1
- --2 = literal value -2
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ COORDINATES
+ Docs: http://tachyons.io/docs/layout/position/
+
+ Use in combination with the position module.
+
+ Base:
+ top
+ bottom
+ right
+ left
+
+ Modifiers:
+ -0 = literal value 0
+ -1 = literal value 1
+ -2 = literal value 2
+ --1 = literal value -1
+ --2 = literal value -2
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.top-0 {
top: 0; }
@@ -1776,13 +1776,13 @@ img, video {
bottom: 0;
left: 0; } }
-/*
-
- CLEARFIX
- http://tachyons.io/docs/layout/clearfix/
-
+/*
+
+ CLEARFIX
+ http://tachyons.io/docs/layout/clearfix/
+
*/
-/* Nicolas Gallaghers Clearfix solution
+/* Nicolas Gallaghers Clearfix solution
Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */
.cf:before,
.cf:after {
@@ -1837,30 +1837,30 @@ img, video {
.cn-l {
clear: none; } }
-/*
-
- DISPLAY
- Docs: http://tachyons.io/docs/layout/display
-
- Base:
- d = display
-
- Modifiers:
- n = none
- b = block
- ib = inline-block
- it = inline-table
- t = table
- tc = table-cell
- tr = table-row
- tcol = table-column
- tcolg = table-column-group
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ DISPLAY
+ Docs: http://tachyons.io/docs/layout/display
+
+ Base:
+ d = display
+
+ Modifiers:
+ n = none
+ b = block
+ ib = inline-block
+ it = inline-table
+ t = table
+ tc = table-cell
+ tr = table-row
+ tcol = table-column
+ tcolg = table-column-group
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.dn {
display: none; }
@@ -1895,9 +1895,9 @@ img, video {
.dt-column-group {
display: table-column-group; }
-/*
- This will set table to full width and then
- all cells will be equal width
+/*
+ This will set table to full width and then
+ all cells will be equal width
*/
.dt--fixed {
table-layout: fixed;
@@ -1984,15 +1984,15 @@ img, video {
table-layout: fixed;
width: 100%; } }
-/*
-
- FLEXBOX
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ FLEXBOX
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.flex, .tab-bar, .edit-form .edit-form-row {
display: flex; }
@@ -2000,7 +2000,7 @@ img, video {
.inline-flex {
display: inline-flex; }
-/* 1. Fix for Chrome 44 bug.
+/* 1. Fix for Chrome 44 bug.
* https://code.google.com/p/chromium/issues/detail?id=506893 */
.flex-auto {
flex: 1 1 auto;
@@ -2432,30 +2432,30 @@ img, video {
.flex-shrink-1-l {
flex-shrink: 1; } }
-/*
-
- FLOATS
- http://tachyons.io/docs/layout/floats/
-
- 1. Floated elements are automatically rendered as block level elements.
- Setting floats to display inline will fix the double margin bug in
- ie6. You know... just in case.
-
- 2. Don't forget to clearfix your floats with .cf
-
- Base:
- f = float
-
- Modifiers:
- l = left
- r = right
- n = none
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ FLOATS
+ http://tachyons.io/docs/layout/floats/
+
+ 1. Floated elements are automatically rendered as block level elements.
+ Setting floats to display inline will fix the double margin bug in
+ ie6. You know... just in case.
+
+ 2. Don't forget to clearfix your floats with .cf
+
+ Base:
+ f = float
+
+ Modifiers:
+ l = left
+ r = right
+ n = none
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.fl {
float: left;
@@ -2498,11 +2498,11 @@ img, video {
.fn-l {
float: none; } }
-/*
-
- FONT FAMILY GROUPS
- Docs: http://tachyons.io/docs/typography/font-family/
-
+/*
+
+ FONT FAMILY GROUPS
+ Docs: http://tachyons.io/docs/typography/font-family/
+
*/
.sans-serif {
font-family: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; }
@@ -2519,50 +2519,50 @@ img, video {
/* Monospaced Typefaces (for code) */
/* From http://cssfontstack.com */
code, .code {
- font-family: Consolas, monaco, monospace; }
+ font-family: Consolas,
monaco,
monospace; }
.courier {
- font-family: 'Courier Next', courier, monospace; }
+ font-family: 'Courier Next',
courier,
monospace; }
/* Sans-Serif Typefaces */
.helvetica {
- font-family: 'helvetica neue', helvetica, sans-serif; }
+ font-family: 'helvetica neue', helvetica,
sans-serif; }
.avenir {
- font-family: 'avenir next', avenir, sans-serif; }
+ font-family: 'avenir next', avenir,
sans-serif; }
/* Serif Typefaces */
.athelas {
- font-family: athelas, georgia, serif; }
+ font-family: athelas,
georgia,
serif; }
.georgia {
- font-family: georgia, serif; }
+ font-family: georgia,
serif; }
.times {
- font-family: times, serif; }
+ font-family: times,
serif; }
.bodoni {
- font-family: "Bodoni MT", serif; }
+ font-family: "Bodoni MT",
serif; }
.calisto {
- font-family: "Calisto MT", serif; }
+ font-family: "Calisto MT",
serif; }
.garamond {
- font-family: garamond, serif; }
+ font-family: garamond,
serif; }
.baskerville {
- font-family: baskerville, serif; }
-
-/*
-
- FONT STYLE
- Docs: http://tachyons.io/docs/typography/font-style/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
+ font-family: baskerville,
serif; }
+/*
+
+ FONT STYLE
+ Docs: http://tachyons.io/docs/typography/font-style/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.i {
font-style: italic; }
@@ -2588,30 +2588,30 @@ code, .code {
.fs-normal-l {
font-style: normal; } }
-/*
-
- FONT WEIGHT
- Docs: http://tachyons.io/docs/typography/font-weight/
-
- Base
- fw = font-weight
-
- Modifiers:
- 1 = literal value 100
- 2 = literal value 200
- 3 = literal value 300
- 4 = literal value 400
- 5 = literal value 500
- 6 = literal value 600
- 7 = literal value 700
- 8 = literal value 800
- 9 = literal value 900
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ FONT WEIGHT
+ Docs: http://tachyons.io/docs/typography/font-weight/
+
+ Base
+ fw = font-weight
+
+ Modifiers:
+ 1 = literal value 100
+ 2 = literal value 200
+ 3 = literal value 300
+ 4 = literal value 400
+ 5 = literal value 500
+ 6 = literal value 600
+ 7 = literal value 700
+ 8 = literal value 800
+ 9 = literal value 900
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.normal {
font-weight: normal; }
@@ -2718,10 +2718,10 @@ code, .code {
.fw9-l {
font-weight: 900; } }
-/*
-
- FORMS
-
+/*
+
+ FORMS
+
*/
.input-reset {
-webkit-appearance: none;
@@ -2732,37 +2732,37 @@ code, .code {
border: 0;
padding: 0; }
-/*
-
- HEIGHTS
- Docs: http://tachyons.io/docs/layout/heights/
-
- Base:
- h = height
- min-h = min-height
- min-vh = min-height vertical screen height
- vh = vertical screen height
-
- Modifiers
- 1 = 1st step in height scale
- 2 = 2nd step in height scale
- 3 = 3rd step in height scale
- 4 = 4th step in height scale
- 5 = 5th step in height scale
-
- -25 = literal value 25%
- -50 = literal value 50%
- -75 = literal value 75%
- -100 = literal value 100%
-
- -auto = string value of auto
- -inherit = string value of inherit
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ HEIGHTS
+ Docs: http://tachyons.io/docs/layout/heights/
+
+ Base:
+ h = height
+ min-h = min-height
+ min-vh = min-height vertical screen height
+ vh = vertical screen height
+
+ Modifiers
+ 1 = 1st step in height scale
+ 2 = 2nd step in height scale
+ 3 = 3rd step in height scale
+ 4 = 4th step in height scale
+ 5 = 5th step in height scale
+
+ -25 = literal value 25%
+ -50 = literal value 50%
+ -75 = literal value 75%
+ -100 = literal value 100%
+
+ -auto = string value of auto
+ -inherit = string value of inherit
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
/* Height Scale */
.h1 {
@@ -2927,16 +2927,16 @@ code, .code {
.h-inherit-l {
height: inherit; } }
-/*
-
- LETTER SPACING
- Docs: http://tachyons.io/docs/typography/tracking/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ LETTER SPACING
+ Docs: http://tachyons.io/docs/typography/tracking/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.tracked {
letter-spacing: 0.1em; }
@@ -2971,16 +2971,16 @@ code, .code {
.tracked-mega-l {
letter-spacing: 0.25em; } }
-/*
-
- LINE HEIGHT / LEADING
- Docs: http://tachyons.io/docs/typography/line-height
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ LINE HEIGHT / LEADING
+ Docs: http://tachyons.io/docs/typography/line-height
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.lh-solid {
line-height: 1; }
@@ -3015,11 +3015,11 @@ code, .code {
.lh-copy-l {
line-height: 1.5; } }
-/*
-
- LINKS
- Docs: http://tachyons.io/docs/elements/links/
-
+/*
+
+ LINKS
+ Docs: http://tachyons.io/docs/elements/links/
+
*/
.link {
text-decoration: none;
@@ -3039,44 +3039,44 @@ code, .code {
transition: color .15s ease-in;
outline: 1px dotted currentColor; }
-/*
-
- LISTS
- http://tachyons.io/docs/elements/lists/
-
+/*
+
+ LISTS
+ http://tachyons.io/docs/elements/lists/
+
*/
.list {
list-style-type: none; }
-/*
-
- MAX WIDTHS
- Docs: http://tachyons.io/docs/layout/max-widths/
-
- Base:
- mw = max-width
-
- Modifiers
- 1 = 1st step in width scale
- 2 = 2nd step in width scale
- 3 = 3rd step in width scale
- 4 = 4th step in width scale
- 5 = 5th step in width scale
- 6 = 6st step in width scale
- 7 = 7nd step in width scale
- 8 = 8rd step in width scale
- 9 = 9th step in width scale
-
- -100 = literal value 100%
-
- -none = string value none
-
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ MAX WIDTHS
+ Docs: http://tachyons.io/docs/layout/max-widths/
+
+ Base:
+ mw = max-width
+
+ Modifiers
+ 1 = 1st step in width scale
+ 2 = 2nd step in width scale
+ 3 = 3rd step in width scale
+ 4 = 4th step in width scale
+ 5 = 5th step in width scale
+ 6 = 6st step in width scale
+ 7 = 7nd step in width scale
+ 8 = 8rd step in width scale
+ 9 = 9th step in width scale
+
+ -100 = literal value 100%
+
+ -none = string value none
+
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
/* Max Width Percentages */
.mw-100, .edit-form textarea {
@@ -3186,46 +3186,46 @@ code, .code {
.mw-none-l {
max-width: none; } }
-/*
-
- WIDTHS
- Docs: http://tachyons.io/docs/layout/widths/
-
- Base:
- w = width
-
- Modifiers
- 1 = 1st step in width scale
- 2 = 2nd step in width scale
- 3 = 3rd step in width scale
- 4 = 4th step in width scale
- 5 = 5th step in width scale
-
- -10 = literal value 10%
- -20 = literal value 20%
- -25 = literal value 25%
- -30 = literal value 30%
- -33 = literal value 33%
- -34 = literal value 34%
- -40 = literal value 40%
- -50 = literal value 50%
- -60 = literal value 60%
- -70 = literal value 70%
- -75 = literal value 75%
- -80 = literal value 80%
- -90 = literal value 90%
- -100 = literal value 100%
-
- -third = 100% / 3 (Not supported in opera mini or IE8)
- -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)
- -auto = string value auto
-
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ WIDTHS
+ Docs: http://tachyons.io/docs/layout/widths/
+
+ Base:
+ w = width
+
+ Modifiers
+ 1 = 1st step in width scale
+ 2 = 2nd step in width scale
+ 3 = 3rd step in width scale
+ 4 = 4th step in width scale
+ 5 = 5th step in width scale
+
+ -10 = literal value 10%
+ -20 = literal value 20%
+ -25 = literal value 25%
+ -30 = literal value 30%
+ -33 = literal value 33%
+ -34 = literal value 34%
+ -40 = literal value 40%
+ -50 = literal value 50%
+ -60 = literal value 60%
+ -70 = literal value 70%
+ -75 = literal value 75%
+ -80 = literal value 80%
+ -90 = literal value 90%
+ -100 = literal value 100%
+
+ -third = 100% / 3 (Not supported in opera mini or IE8)
+ -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)
+ -auto = string value auto
+
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
/* Width Scale */
.w1 {
@@ -3441,15 +3441,15 @@ code, .code {
.w-auto-l {
width: auto; } }
-/*
-
- OVERFLOW
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ OVERFLOW
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.overflow-visible {
overflow: visible; }
@@ -3565,16 +3565,16 @@ code, .code {
.overflow-y-auto-l {
overflow-y: auto; } }
-/*
-
- POSITIONING
- Docs: http://tachyons.io/docs/layout/position/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ POSITIONING
+ Docs: http://tachyons.io/docs/layout/position/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.static {
position: static; }
@@ -3618,11 +3618,11 @@ code, .code {
.fixed-l {
position: fixed; } }
-/*
-
- OPACITY
- Docs: http://tachyons.io/docs/themes/opacity/
-
+/*
+
+ OPACITY
+ Docs: http://tachyons.io/docs/themes/opacity/
+
*/
.o-100 {
opacity: 1; }
@@ -3663,10 +3663,10 @@ code, .code {
.o-0 {
opacity: 0; }
-/*
-
- ROTATIONS
-
+/*
+
+ ROTATIONS
+
*/
.rotate-45 {
transform: rotate(45deg); }
@@ -3737,15 +3737,15 @@ code, .code {
.rotate-315-l {
transform: rotate(315deg); } }
-/*
-
- SKINS
- Docs: http://tachyons.io/docs/themes/skins/
-
- Classes for setting foreground and background colors on elements.
- If you haven't declared a border color, but set border on an element, it will
- be set to the current text color.
-
+/*
+
+ SKINS
+ Docs: http://tachyons.io/docs/themes/skins/
+
+ Classes for setting foreground and background colors on elements.
+ If you haven't declared a border color, but set border on an element, it will
+ be set to the current text color.
+
*/
/* Text colors */
.black-90 {
@@ -4088,13 +4088,13 @@ code, .code {
.bg-inherit {
background-color: inherit; }
-/*
-
- SKINS:PSEUDO
-
- Customize the color of an element when
- it is focused or hovered over.
-
+/*
+
+ SKINS:PSEUDO
+
+ Customize the color of an element when
+ it is focused or hovered over.
+
*/
.hover-black:hover,
.hover-black:focus {
@@ -4541,39 +4541,39 @@ code, .code {
background-color: inherit; }
/* Variables */
-/*
- SPACING
- Docs: http://tachyons.io/docs/layout/spacing/
-
- An eight step powers of two scale ranging from 0 to 16rem.
-
- Base:
- p = padding
- m = margin
-
- Modifiers:
- a = all
- h = horizontal
- v = vertical
- t = top
- r = right
- b = bottom
- l = left
-
- 0 = none
- 1 = 1st step in spacing scale
- 2 = 2nd step in spacing scale
- 3 = 3rd step in spacing scale
- 4 = 4th step in spacing scale
- 5 = 5th step in spacing scale
- 6 = 6th step in spacing scale
- 7 = 7th step in spacing scale
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+ SPACING
+ Docs: http://tachyons.io/docs/layout/spacing/
+
+ An eight step powers of two scale ranging from 0 to 16rem.
+
+ Base:
+ p = padding
+ m = margin
+
+ Modifiers:
+ a = all
+ h = horizontal
+ v = vertical
+ t = top
+ r = right
+ b = bottom
+ l = left
+
+ 0 = none
+ 1 = 1st step in spacing scale
+ 2 = 2nd step in spacing scale
+ 3 = 3rd step in spacing scale
+ 4 = 4th step in spacing scale
+ 5 = 5th step in spacing scale
+ 6 = 6th step in spacing scale
+ 7 = 7th step in spacing scale
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.pa0 {
padding: 0; }
@@ -5745,32 +5745,32 @@ input[type=submit]:not(.button-small), .notice {
margin-left: 16rem;
margin-right: 16rem; } }
-/*
- NEGATIVE MARGINS
-
- Base:
- n = negative
-
- Modifiers:
- a = all
- t = top
- r = right
- b = bottom
- l = left
-
- 1 = 1st step in spacing scale
- 2 = 2nd step in spacing scale
- 3 = 3rd step in spacing scale
- 4 = 4th step in spacing scale
- 5 = 5th step in spacing scale
- 6 = 6th step in spacing scale
- 7 = 7th step in spacing scale
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+ NEGATIVE MARGINS
+
+ Base:
+ n = negative
+
+ Modifiers:
+ a = all
+ t = top
+ r = right
+ b = bottom
+ l = left
+
+ 1 = 1st step in spacing scale
+ 2 = 2nd step in spacing scale
+ 3 = 3rd step in spacing scale
+ 4 = 4th step in spacing scale
+ 5 = 5th step in spacing scale
+ 6 = 6th step in spacing scale
+ 7 = 7th step in spacing scale
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.na1 {
margin: -0.25rem; }
@@ -6093,11 +6093,11 @@ input[type=submit]:not(.button-small), .notice {
.nt7-l {
margin-top: -16rem; } }
-/*
-
- TABLES
- Docs: http://tachyons.io/docs/elements/tables/
-
+/*
+
+ TABLES
+ Docs: http://tachyons.io/docs/elements/tables/
+
*/
.collapse {
border-collapse: collapse;
@@ -6121,17 +6121,17 @@ input[type=submit]:not(.button-small), .notice {
.stripe-dark:nth-child(odd) {
background-color: rgba(0, 0, 0, 0.1); }
-/*
-
- TEXT DECORATION
- Docs: http://tachyons.io/docs/typography/text-decoration/
-
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ TEXT DECORATION
+ Docs: http://tachyons.io/docs/typography/text-decoration/
+
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.strike {
text-decoration: line-through; }
@@ -6166,25 +6166,25 @@ input[type=submit]:not(.button-small), .notice {
.no-underline-l {
text-decoration: none; } }
-/*
-
- TEXT ALIGN
- Docs: http://tachyons.io/docs/typography/text-align/
-
- Base
- t = text-align
-
- Modifiers
- l = left
- r = right
- c = center
- j = justify
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ TEXT ALIGN
+ Docs: http://tachyons.io/docs/typography/text-align/
+
+ Base
+ t = text-align
+
+ Modifiers
+ l = left
+ r = right
+ c = center
+ j = justify
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.tl, .edit-form .edit-form-row > :first-child {
text-align: left; }
@@ -6228,25 +6228,25 @@ input[type=submit]:not(.button-small), .notice {
.tj-l {
text-align: justify; } }
-/*
-
- TEXT TRANSFORM
- Docs: http://tachyons.io/docs/typography/text-transform/
-
- Base:
- tt = text-transform
-
- Modifiers
- c = capitalize
- l = lowercase
- u = uppercase
- n = none
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ TEXT TRANSFORM
+ Docs: http://tachyons.io/docs/typography/text-transform/
+
+ Base:
+ tt = text-transform
+
+ Modifiers
+ c = capitalize
+ l = lowercase
+ u = uppercase
+ n = none
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.ttc {
text-transform: capitalize; }
@@ -6290,32 +6290,32 @@ input[type=submit]:not(.button-small), .notice {
.ttn-l {
text-transform: none; } }
-/*
-
- TYPE SCALE
- Docs: http://tachyons.io/docs/typography/scale/
-
- Base:
- f = font-size
-
- Modifiers
- 1 = 1st step in size scale
- 2 = 2nd step in size scale
- 3 = 3rd step in size scale
- 4 = 4th step in size scale
- 5 = 5th step in size scale
- 6 = 6th step in size scale
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
+/*
+
+ TYPE SCALE
+ Docs: http://tachyons.io/docs/typography/scale/
+
+ Base:
+ f = font-size
+
+ Modifiers
+ 1 = 1st step in size scale
+ 2 = 2nd step in size scale
+ 3 = 3rd step in size scale
+ 4 = 4th step in size scale
+ 5 = 5th step in size scale
+ 6 = 6th step in size scale
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
*/
-/*
- * For Hero/Marketing Titles
- *
- * These generally are too large for mobile
- * so be careful using them on smaller screens.
+/*
+ * For Hero/Marketing Titles
+ *
+ * These generally are too large for mobile
+ * so be careful using them on smaller screens.
* */
.f-6,
.f-headline {
@@ -6413,16 +6413,16 @@ input[type=submit]:not(.button-small), .notice {
.f7-l {
font-size: 0.75rem; } }
-/*
-
- TYPOGRAPHY
- http://tachyons.io/docs/typography/measure/
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ TYPOGRAPHY
+ http://tachyons.io/docs/typography/measure/
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
/* Measure is limited to ~66 characters */
.measure {
@@ -6505,15 +6505,15 @@ input[type=submit]:not(.button-small), .notice {
overflow: hidden;
text-overflow: ellipsis; } }
-/*
-
- UTILITIES
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ UTILITIES
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
/* Equivalent to .overflow-y-scroll */
.overflow-container {
@@ -6556,19 +6556,19 @@ input[type=submit]:not(.button-small), .notice {
.ml-auto-l {
margin-left: auto; } }
-/*
-
- VISIBILITY
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ VISIBILITY
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
-/*
- Text that is hidden but accessible
- Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+/*
+ Text that is hidden but accessible
+ Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*/
.clip {
position: fixed !important;
@@ -6601,15 +6601,15 @@ input[type=submit]:not(.button-small), .notice {
/* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px); } }
-/*
-
- WHITE SPACE
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ WHITE SPACE
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.ws-normal {
white-space: normal; }
@@ -6644,15 +6644,15 @@ input[type=submit]:not(.button-small), .notice {
.pre-l {
white-space: pre; } }
-/*
-
- VERTICAL ALIGN
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
+/*
+
+ VERTICAL ALIGN
+
+ Media Query Extensions:
+ -ns = not-small
+ -m = medium
+ -l = large
+
*/
.v-base {
vertical-align: baseline; }
@@ -6696,24 +6696,24 @@ input[type=submit]:not(.button-small), .notice {
.v-btm-l {
vertical-align: bottom; } }
-/*
-
- HOVER EFFECTS
- Docs: http://tachyons.io/docs/themes/hovers/
-
- - Dim
- - Glow
- - Hide Child
- - Underline text
- - Grow
- - Pointer
- - Shadow
-
+/*
+
+ HOVER EFFECTS
+ Docs: http://tachyons.io/docs/themes/hovers/
+
+ - Dim
+ - Glow
+ - Hide Child
+ - Underline text
+ - Grow
+ - Pointer
+ - Shadow
+
*/
-/*
-
- Dim element on hover by adding the dim class.
-
+/*
+
+ Dim element on hover by adding the dim class.
+
*/
.dim {
opacity: 1;
@@ -6728,10 +6728,10 @@ input[type=submit]:not(.button-small), .notice {
opacity: .8;
transition: opacity .15s ease-out; }
-/*
-
- Animate opacity to 100% on hover by adding the glow class.
-
+/*
+
+ Animate opacity to 100% on hover by adding the glow class.
+
*/
.glow {
transition: opacity .15s ease-in; }
@@ -6741,19 +6741,19 @@ input[type=submit]:not(.button-small), .notice {
opacity: 1;
transition: opacity .15s ease-in; }
-/*
-
- Hide child & reveal on hover:
-
- Put the hide-child class on a parent element and any nested element with the
- child class will be hidden and displayed on hover or focus.
-
-
-
Hidden until hover or focus
-
Hidden until hover or focus
-
Hidden until hover or focus
-
Hidden until hover or focus
-
+/*
+
+ Hide child & reveal on hover:
+
+ Put the hide-child class on a parent element and any nested element with the
+ child class will be hidden and displayed on hover or focus.
+
+
+
Hidden until hover or focus
+
Hidden until hover or focus
+
Hidden until hover or focus
+
Hidden until hover or focus
+
*/
.hide-child .child {
opacity: 0;
@@ -6769,7 +6769,7 @@ input[type=submit]:not(.button-small), .notice {
.underline-hover:focus {
text-decoration: underline; }
-/* Can combine this with overflow-hidden to make background images grow on hover
+/* Can combine this with overflow-hidden to make background images grow on hover
* even if you are using background-size: cover */
.grow {
-moz-osx-font-smoothing: grayscale;
@@ -6801,11 +6801,11 @@ input[type=submit]:not(.button-small), .notice {
.pointer:hover {
cursor: pointer; }
-/*
- Add shadow on hover.
-
- Performant box-shadow animation pattern from
- http://tobiasahlin.com/blog/how-to-animate-box-shadow/
+/*
+ Add shadow on hover.
+
+ Performant box-shadow animation pattern from
+ http://tobiasahlin.com/blog/how-to-animate-box-shadow/
*/
.shadow-hover {
cursor: pointer;
@@ -6829,46 +6829,46 @@ input[type=submit]:not(.button-small), .notice {
.shadow-hover:focus::after {
opacity: 1; }
-/* Combine with classes in skins and skins-pseudo for
+/* Combine with classes in skins and skins-pseudo for
* many different transition possibilities. */
.bg-animate,
.bg-animate:hover,
.bg-animate:focus {
transition: background-color .15s ease-in-out; }
-/*
-
- Z-INDEX
-
- Base
- z = z-index
-
- Modifiers
- -0 = literal value 0
- -1 = literal value 1
- -2 = literal value 2
- -3 = literal value 3
- -4 = literal value 4
- -5 = literal value 5
- -999 = literal value 999
- -9999 = literal value 9999
-
- -max = largest accepted z-index value as integer
-
- -inherit = string value inherit
- -initial = string value initial
- -unset = string value unset
-
- MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index
- Spec: http://www.w3.org/TR/CSS2/zindex.html
- Articles:
- https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
-
- Tips on extending:
- There might be a time worth using negative z-index values.
- Or if you are using tachyons with another project, you might need to
- adjust these values to suit your needs.
-
+/*
+
+ Z-INDEX
+
+ Base
+ z = z-index
+
+ Modifiers
+ -0 = literal value 0
+ -1 = literal value 1
+ -2 = literal value 2
+ -3 = literal value 3
+ -4 = literal value 4
+ -5 = literal value 5
+ -999 = literal value 999
+ -9999 = literal value 9999
+
+ -max = largest accepted z-index value as integer
+
+ -inherit = string value inherit
+ -initial = string value initial
+ -unset = string value unset
+
+ MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index
+ Spec: http://www.w3.org/TR/CSS2/zindex.html
+ Articles:
+ https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
+
+ Tips on extending:
+ There might be a time worth using negative z-index values.
+ Or if you are using tachyons with another project, you might need to
+ adjust these values to suit your needs.
+
*/
.z-0 {
z-index: 0; }
@@ -6906,12 +6906,12 @@ input[type=submit]:not(.button-small), .notice {
.z-unset {
z-index: unset; }
-/*
-
- NESTED
- Tachyons module for styling nested elements
- that are generated by a cms.
-
+/*
+
+ NESTED
+ Tachyons module for styling nested elements
+ that are generated by a cms.
+
*/
.nested-copy-line-height p,
.nested-copy-line-height ul,
@@ -6954,32 +6954,32 @@ input[type=submit]:not(.button-small), .notice {
color: #96ccff;
transition: color .15s ease-in; }
-/*
-
- STYLES
-
- Add custom styles here.
-
+/*
+
+ STYLES
+
+ Add custom styles here.
+
*/
-/*
-Inserts a CSS expression with one or more custom variables.
-You can provide an arbitrary number of strings in the second
-argument, separated by spaces. Any strings corresponding to
-variable names will be replaced by the correct values, while
-other strings are left untouched.
-
-Example usage:
-
-@include usevar(border-color, dimmer-color);
-@include usevar(background, "linear-gradient(" dim-background-transparent "," dim-background ")");
-
-For clarity and to avoid syntax issues, you are encouraged to
-use unquoted strings for variables and quoted strings for
-everything else.
-
-For convenience in common cases, if only a single argument
-is provided and it does not match an existing variable, this
-will throw an error.
+/*
+Inserts a CSS expression with one or more custom variables.
+You can provide an arbitrary number of strings in the second
+argument, separated by spaces. Any strings corresponding to
+variable names will be replaced by the correct values, while
+other strings are left untouched.
+
+Example usage:
+
+@include usevar(border-color, dimmer-color);
+@include usevar(background, "linear-gradient(" dim-background-transparent "," dim-background ")");
+
+For clarity and to avoid syntax issues, you are encouraged to
+use unquoted strings for variables and quoted strings for
+everything else.
+
+For convenience in common cases, if only a single argument
+is provided and it does not match an existing variable, this
+will throw an error.
*/
pre, code, .codeblock {
/* Comment */
@@ -8404,10 +8404,10 @@ input[type=button],
input[type=submit] {
color: black;
color: var(--form-button-color);
- background-color: #fff;
- background-color: var(--form-button-background);
- border-color: #ccc;
- border-color: var(--form-button-border-color);
+ background-color: #666;
+ background-color: var(--theme-color);
+ border-color: #666;
+ border-color: var(--theme-color);
border-width: 1px;
border-style: solid;
display: inline-block;
@@ -8422,8 +8422,10 @@ input[type=submit] {
input[type=submit]:hover {
color: #4c9ed9;
color: var(--form-button-color-active);
- background-color: #f2f2f2;
- background-color: var(--form-button-background-active); }
+ background-color: #aaa;
+ background-color: var(--theme-color-dim);
+ border-color: #aaa;
+ border-color: var(--theme-color-dim); }
button.lite,
.button.lite,
@@ -8527,6 +8529,7 @@ input[type=submit] {
width: 40px;
height: 40px;
flex-shrink: 0;
+ object-fit: cover;
border-radius: 100%;
overflow: hidden;
object-fit: cover;
diff --git a/public/themes/dark/theme.css b/public/themes/dark/theme.css
index bcb5d540..d9a2d2e8 100644
--- a/public/themes/dark/theme.css
+++ b/public/themes/dark/theme.css
@@ -270,7 +270,7 @@ pre, code, .codeblock {
--landing-search-background-hover: #181818;
--editor-toolbar-background: #282828;
--editor-toolbar-border-color: #333;
- --editor-toolbar-button-background: 282828;
+ --editor-toolbar-button-background: #282828;
--editor-toolbar-button-background-hover: #333;
--editor-toolbar-button-border-color: #333;
--post-blockquote-border-color: #555;
diff --git a/src/rawdata/scss/_forms.scss b/src/rawdata/scss/_forms.scss
index c699a2c0..b656b4bf 100644
--- a/src/rawdata/scss/_forms.scss
+++ b/src/rawdata/scss/_forms.scss
@@ -150,8 +150,8 @@ input, select, textarea {
}
@include usevar('color', 'form-button-color');
- @include usevar('background-color', 'form-button-background');
- @include usevar('border-color', 'form-button-border-color');
+ @include usevar('background-color', 'theme-color');
+ @include usevar('border-color', 'theme-color');
border-width: 1px;
border-style: solid;
@@ -163,7 +163,8 @@ input, select, textarea {
&:hover {
@include usevar('color', 'form-button-color-active');
- @include usevar('background-color', 'form-button-background-active');
+ @include usevar('background-color', 'theme-color-dim');
+ @include usevar('border-color', 'theme-color-dim');
}
&.lite {
diff --git a/src/rawdata/scss/_forum.scss b/src/rawdata/scss/_forum.scss
index c63b29f7..0de61653 100644
--- a/src/rawdata/scss/_forum.scss
+++ b/src/rawdata/scss/_forum.scss
@@ -54,6 +54,7 @@
width: 40px;
height: 40px;
flex-shrink: 0;
+ object-fit: cover;
border-radius: 100%;
overflow: hidden;
object-fit: cover;
diff --git a/src/rawdata/scss/themes/dark/_variables.scss b/src/rawdata/scss/themes/dark/_variables.scss
index 48f13e07..72ec76a3 100644
--- a/src/rawdata/scss/themes/dark/_variables.scss
+++ b/src/rawdata/scss/themes/dark/_variables.scss
@@ -77,7 +77,7 @@ $vars: (
editor-toolbar-background: #282828,
editor-toolbar-border-color: #333,
- editor-toolbar-button-background: 282828,
+ editor-toolbar-button-background: #282828,
editor-toolbar-button-background-hover: #333,
editor-toolbar-button-border-color: #333,
diff --git a/src/templates/src/project.css b/src/templates/src/project.css
index 2c90d94a..5ca44745 100644
--- a/src/templates/src/project.css
+++ b/src/templates/src/project.css
@@ -38,11 +38,20 @@ header .content-title .subtitle {
border-top-color: var(--theme-dim);
}
-a, .thread:before, button, .button, input[type=button], input[type=submit] {
+a, .thread:before, button, .button, input[type=button] {
color: {{ $linkColor }};
color: var(--link-color);
}
-a:hover, button:hover, .button:hover, input[type=button]:hover, input[type=submit]:hover {
+
+.submit, input[type=submit] {
+ color: white;
+}
+
+a.submit:hover, .submit:hover, input[type=submit]:hover {
+ color: white;
+}
+
+a:hover, button:hover, .button:hover, input[type=button]:hover {
color: {{ $linkHoverColor }};
color: var(--link-hover-color);
}
diff --git a/src/templates/src/project_edit.html b/src/templates/src/project_edit.html
index 58387834..c96548a7 100644
--- a/src/templates/src/project_edit.html
+++ b/src/templates/src/project_edit.html
@@ -141,7 +141,7 @@
{{ if .Editing }}
{{ else }}
- Next
+ Next
{{ end }}
@@ -196,7 +196,7 @@
{{ if .Editing }}
{{ else }}
- Next
+ Next
{{ end }}
diff --git a/src/templates/src/user_profile.html b/src/templates/src/user_profile.html
index 7994c850..961afbb8 100644
--- a/src/templates/src/user_profile.html
+++ b/src/templates/src/user_profile.html
@@ -137,7 +137,7 @@
{{ end }}
{{ if .OwnProfile }}
{{ if .CanAddProject }}
- Add New Project
+ Add New Project
{{ else }}
You have reached the maximum number of personal projects.
{{ end }}