From aa55a7a169003586ef3a79eb610dc784a585932a Mon Sep 17 00:00:00 2001 From: CJ Patoilo Date: Sun, 17 May 2020 18:41:05 -0300 Subject: [PATCH] Move all files from tab to space --- src/_Base.sass | 18 ++-- src/_Blockquote.sass | 12 +-- src/_Button.sass | 110 +++++++++++----------- src/_Code.sass | 28 +++--- src/_Divider.sass | 6 +- src/_Form.sass | 80 ++++++++-------- src/_Grid.sass | 216 +++++++++++++++++++++---------------------- src/_Image.sass | 2 +- src/_Link.sass | 10 +- src/_List.sass | 20 ++-- src/_Spacing.sass | 6 +- src/_Table.sass | 18 ++-- src/_Typography.sass | 42 ++++----- src/_Utility.sass | 12 +-- 14 files changed, 290 insertions(+), 290 deletions(-) diff --git a/src/_Base.sass b/src/_Base.sass index ab1880f..0556df6 100644 --- a/src/_Base.sass +++ b/src/_Base.sass @@ -6,19 +6,19 @@ *, *:after, *:before - box-sizing: inherit + box-sizing: inherit // The base font-size is set at 62.5% for having the convenience // of sizing rems in a way that is similar to using px: 1.6rem = 16px html - box-sizing: border-box - font-size: 62.5% + box-sizing: border-box + font-size: 62.5% // Default body styles body - color: $color-secondary - font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif - font-size: 1.6em // Currently ems cause chrome bug misinterpreting rems on body element - font-weight: 300 - letter-spacing: .01em - line-height: 1.6 + color: $color-secondary + font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif + font-size: 1.6em // Currently ems cause chrome bug misinterpreting rems on body element + font-weight: 300 + letter-spacing: .01em + line-height: 1.6 diff --git a/src/_Blockquote.sass b/src/_Blockquote.sass index dff5eca..9bfce59 100644 --- a/src/_Blockquote.sass +++ b/src/_Blockquote.sass @@ -3,10 +3,10 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– blockquote - border-left: .3rem solid $color-quaternary - margin-left: 0 - margin-right: 0 - padding: 1rem 1.5rem + border-left: .3rem solid $color-quaternary + margin-left: 0 + margin-right: 0 + padding: 1rem 1.5rem - *:last-child - margin-bottom: 0 + *:last-child + margin-bottom: 0 diff --git a/src/_Button.sass b/src/_Button.sass index 9c422b7..c861c41 100644 --- a/src/_Button.sass +++ b/src/_Button.sass @@ -7,69 +7,69 @@ button, input[type='button'], input[type='reset'], input[type='submit'] - background-color: $color-primary - border: .1rem solid $color-primary - border-radius: .4rem - color: $color-initial - cursor: pointer - display: inline-block - font-size: 1.1rem - font-weight: 700 - height: 3.8rem - letter-spacing: .1rem - line-height: 3.8rem - padding: 0 3.0rem - text-align: center - text-decoration: none - text-transform: uppercase - white-space: nowrap + background-color: $color-primary + border: .1rem solid $color-primary + border-radius: .4rem + color: $color-initial + cursor: pointer + display: inline-block + font-size: 1.1rem + font-weight: 700 + height: 3.8rem + letter-spacing: .1rem + line-height: 3.8rem + padding: 0 3.0rem + text-align: center + text-decoration: none + text-transform: uppercase + white-space: nowrap - &:focus, - &:hover - background-color: $color-secondary - border-color: $color-secondary - color: $color-initial - outline: 0 + &:focus, + &:hover + background-color: $color-secondary + border-color: $color-secondary + color: $color-initial + outline: 0 - &[disabled] - cursor: default - opacity: .5 + &[disabled] + cursor: default + opacity: .5 - &:focus, - &:hover - background-color: $color-primary - border-color: $color-primary + &:focus, + &:hover + background-color: $color-primary + border-color: $color-primary - &.button-outline - background-color: transparent - color: $color-primary + &.button-outline + background-color: transparent + color: $color-primary - &:focus, - &:hover - background-color: transparent - border-color: $color-secondary - color: $color-secondary + &:focus, + &:hover + background-color: transparent + border-color: $color-secondary + color: $color-secondary - &[disabled] + &[disabled] - &:focus, - &:hover - border-color: inherit - color: $color-primary + &:focus, + &:hover + border-color: inherit + color: $color-primary - &.button-clear - background-color: transparent - border-color: transparent - color: $color-primary + &.button-clear + background-color: transparent + border-color: transparent + color: $color-primary - &:focus, - &:hover - background-color: transparent - border-color: transparent - color: $color-secondary + &:focus, + &:hover + background-color: transparent + border-color: transparent + color: $color-secondary - &[disabled] + &[disabled] - &:focus, - &:hover - color: $color-primary + &:focus, + &:hover + color: $color-primary diff --git a/src/_Code.sass b/src/_Code.sass index fd0d8df..12749ef 100644 --- a/src/_Code.sass +++ b/src/_Code.sass @@ -3,20 +3,20 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– code - background: $color-tertiary - border-radius: .4rem - font-size: 86% - margin: 0 .2rem - padding: .2rem .5rem - white-space: nowrap + background: $color-tertiary + border-radius: .4rem + font-size: 86% + margin: 0 .2rem + padding: .2rem .5rem + white-space: nowrap pre - background: $color-tertiary - border-left: .3rem solid $color-primary - overflow-y: hidden + background: $color-tertiary + border-left: .3rem solid $color-primary + overflow-y: hidden - & > code - border-radius: 0 - display: block - padding: 1rem 1.5rem - white-space: pre + & > code + border-radius: 0 + display: block + padding: 1rem 1.5rem + white-space: pre diff --git a/src/_Divider.sass b/src/_Divider.sass index 1583766..d8dceed 100644 --- a/src/_Divider.sass +++ b/src/_Divider.sass @@ -3,6 +3,6 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– hr - border: 0 - border-top: .1rem solid $color-tertiary - margin: 3.0rem 0 + border: 0 + border-top: .1rem solid $color-tertiary + margin: 3.0rem 0 diff --git a/src/_Form.sass b/src/_Form.sass index 8a0acac..0ce9d0f 100644 --- a/src/_Form.sass +++ b/src/_Form.sass @@ -2,62 +2,62 @@ // Form // –––––––––––––––––––––––––––––––––––––––––––––––––– -input[type=color], -input[type=date], -input[type=datetime], -input[type=datetime-local], -input[type=email], -input[type=month], -input[type=number], -input[type=password], -input[type=search], -input[type=tel], -input[type=text], -input[type=url], -input[type=week], +input[type='color'], +input[type='date'], +input[type='datetime'], +input[type='datetime-local'], +input[type='email'], +input[type='month'], +input[type='number'], +input[type='password'], +input[type='search'], +input[type='tel'], +input[type='text'], +input[type='url'], +input[type='week'], input:not([type]), textarea, select - appearance: none // Removes awkward default styles on some inputs for iOS - background-color: transparent - border: .1rem solid $color-quaternary - border-radius: .4rem - box-shadow: none - box-sizing: inherit // Forced to replace inherit values of the normalize.css - height: 3.8rem - padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit - width: 100% + appearance: none // Removes awkward default styles on some inputs for iOS + background-color: transparent + border: .1rem solid $color-quaternary + border-radius: .4rem + box-shadow: none + box-sizing: inherit // Forced to replace inherit values of the normalize.css + height: 3.8rem + padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit + width: 100% - &:focus - border-color: $color-primary - outline: 0 + &:focus + border-color: $color-primary + outline: 0 select - background: url('data:image/svg+xml;utf8,') center right no-repeat - padding-right: 3.0rem + background: url('data:image/svg+xml;utf8,') center right no-repeat + padding-right: 3.0rem - &:focus - background-image: url('data:image/svg+xml;utf8,') + &:focus + background-image: url('data:image/svg+xml;utf8,') textarea - min-height: 6.5rem + min-height: 6.5rem label, legend - display: block - font-size: 1.6rem - font-weight: 700 - margin-bottom: .5rem + display: block + font-size: 1.6rem + font-weight: 700 + margin-bottom: .5rem fieldset - border-width: 0 - padding: 0 + border-width: 0 + padding: 0 input[type='checkbox'], input[type='radio'] - display: inline + display: inline .label-inline - display: inline-block - font-weight: normal - margin-left: .5rem + display: inline-block + font-weight: normal + margin-left: .5rem diff --git a/src/_Grid.sass b/src/_Grid.sass index 67bff4b..c8367fe 100644 --- a/src/_Grid.sass +++ b/src/_Grid.sass @@ -4,11 +4,11 @@ // .container is main centered wrapper with a max width of 112.0rem (1120px) .container - margin: 0 auto - max-width: 112.0rem - padding: 0 2.0rem - position: relative - width: 100% + margin: 0 auto + max-width: 112.0rem + padding: 0 2.0rem + position: relative + width: 100% // Using flexbox for the grid, inspired by Philip Walton: // http://philipwalton.github.io/solved-by-flexbox/demos/grids/ @@ -16,143 +16,143 @@ // available width, and the height of each .column with take // up the height of the tallest .column in the same .row .row - display: flex - flex-direction: column - padding: 0 - width: 100% + display: flex + flex-direction: column + padding: 0 + width: 100% - &.row-no-padding - padding: 0 + &.row-no-padding + padding: 0 - &> .column - padding: 0 + &> .column + padding: 0 - &.row-wrap - flex-wrap: wrap + &.row-wrap + flex-wrap: wrap - // Vertically Align Columns - // .row-* vertically aligns every .col in the .row - &.row-top - align-items: flex-start + // Vertically Align Columns + // .row-* vertically aligns every .col in the .row + &.row-top + align-items: flex-start - &.row-bottom - align-items: flex-end + &.row-bottom + align-items: flex-end - &.row-center - align-items: center + &.row-center + align-items: center - &.row-stretch - align-items: stretch + &.row-stretch + align-items: stretch - &.row-baseline - align-items: baseline + &.row-baseline + align-items: baseline - .column - display: block - // IE 11 required specifying the flex-basis otherwise it breaks mobile - flex: 1 1 auto - margin-left: 0 - max-width: 100% - width: 100% + .column + display: block + // IE 11 required specifying the flex-basis otherwise it breaks mobile + flex: 1 1 auto + margin-left: 0 + max-width: 100% + width: 100% - // Column Offsets - &.column-offset-10 - margin-left: 10% + // Column Offsets + &.column-offset-10 + margin-left: 10% - &.column-offset-20 - margin-left: 20% + &.column-offset-20 + margin-left: 20% - &.column-offset-25 - margin-left: 25% + &.column-offset-25 + margin-left: 25% - &.column-offset-33, - &.column-offset-34 - margin-left: 33.3333% + &.column-offset-33, + &.column-offset-34 + margin-left: 33.3333% - &.column-offset-50 - margin-left: 50% + &.column-offset-50 + margin-left: 50% - &.column-offset-66, - &.column-offset-67 - margin-left: 66.6666% + &.column-offset-66, + &.column-offset-67 + margin-left: 66.6666% - &.column-offset-75 - margin-left: 75% + &.column-offset-75 + margin-left: 75% - &.column-offset-80 - margin-left: 80% + &.column-offset-80 + margin-left: 80% - &.column-offset-90 - margin-left: 90% + &.column-offset-90 + margin-left: 90% - // Explicit Column Percent Sizes - // By default each grid column will evenly distribute - // across the grid. However, you can specify individual - // columns to take up a certain size of the available area - &.column-10 - flex: 0 0 10% - max-width: 10% + // Explicit Column Percent Sizes + // By default each grid column will evenly distribute + // across the grid. However, you can specify individual + // columns to take up a certain size of the available area + &.column-10 + flex: 0 0 10% + max-width: 10% - &.column-20 - flex: 0 0 20% - max-width: 20% + &.column-20 + flex: 0 0 20% + max-width: 20% - &.column-25 - flex: 0 0 25% - max-width: 25% + &.column-25 + flex: 0 0 25% + max-width: 25% - &.column-33, - &.column-34 - flex: 0 0 33.3333% - max-width: 33.3333% + &.column-33, + &.column-34 + flex: 0 0 33.3333% + max-width: 33.3333% - &.column-40 - flex: 0 0 40% - max-width: 40% + &.column-40 + flex: 0 0 40% + max-width: 40% - &.column-50 - flex: 0 0 50% - max-width: 50% + &.column-50 + flex: 0 0 50% + max-width: 50% - &.column-60 - flex: 0 0 60% - max-width: 60% + &.column-60 + flex: 0 0 60% + max-width: 60% - &.column-66, - &.column-67 - flex: 0 0 66.6666% - max-width: 66.6666% + &.column-66, + &.column-67 + flex: 0 0 66.6666% + max-width: 66.6666% - &.column-75 - flex: 0 0 75% - max-width: 75% + &.column-75 + flex: 0 0 75% + max-width: 75% - &.column-80 - flex: 0 0 80% - max-width: 80% + &.column-80 + flex: 0 0 80% + max-width: 80% - &.column-90 - flex: 0 0 90% - max-width: 90% + &.column-90 + flex: 0 0 90% + max-width: 90% - // .column-* vertically aligns an individual .column - .column-top - align-self: flex-start + // .column-* vertically aligns an individual .column + .column-top + align-self: flex-start - .column-bottom - align-self: flex-end + .column-bottom + align-self: flex-end - .column-center - align-self: center + .column-center + align-self: center // Larger than mobile screen @media (min-width: 40.0rem) // Safari desktop has a bug using `rem`, but Safari mobile works - .row - flex-direction: row - margin-left: -1.0rem - width: calc(100% + 2.0rem) + .row + flex-direction: row + margin-left: -1.0rem + width: calc(100% + 2.0rem) - .column - margin-bottom: inherit - padding: 0 1.0rem + .column + margin-bottom: inherit + padding: 0 1.0rem diff --git a/src/_Image.sass b/src/_Image.sass index 9d460e2..8e1c8da 100644 --- a/src/_Image.sass +++ b/src/_Image.sass @@ -3,4 +3,4 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– img - max-width: 100% + max-width: 100% diff --git a/src/_Link.sass b/src/_Link.sass index e0885af..f026b5c 100644 --- a/src/_Link.sass +++ b/src/_Link.sass @@ -3,9 +3,9 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– a - color: $color-primary - text-decoration: none + color: $color-primary + text-decoration: none - &:focus, - &:hover - color: $color-secondary + &:focus, + &:hover + color: $color-secondary diff --git a/src/_List.sass b/src/_List.sass index d308683..5671b02 100644 --- a/src/_List.sass +++ b/src/_List.sass @@ -5,18 +5,18 @@ dl, ol, ul - list-style: none - margin-top: 0 - padding-left: 0 + list-style: none + margin-top: 0 + padding-left: 0 - dl, - ol, - ul - font-size: 90% - margin: 1.5rem 0 1.5rem 3.0rem + dl, + ol, + ul + font-size: 90% + margin: 1.5rem 0 1.5rem 3.0rem ol - list-style: decimal inside + list-style: decimal inside ul - list-style: circle inside + list-style: circle inside diff --git a/src/_Spacing.sass b/src/_Spacing.sass index 7df55bc..8912da1 100644 --- a/src/_Spacing.sass +++ b/src/_Spacing.sass @@ -7,13 +7,13 @@ button, dd, dt, li - margin-bottom: 1.0rem + margin-bottom: 1.0rem fieldset, input, select, textarea - margin-bottom: 1.5rem + margin-bottom: 1.5rem blockquote, dl, @@ -24,4 +24,4 @@ p, pre, table, ul - margin-bottom: 2.5rem + margin-bottom: 2.5rem diff --git a/src/_Table.sass b/src/_Table.sass index c27ec39..370d255 100644 --- a/src/_Table.sass +++ b/src/_Table.sass @@ -3,17 +3,17 @@ // –––––––––––––––––––––––––––––––––––––––––––––––––– table - border-spacing: 0 - width: 100% + border-spacing: 0 + width: 100% td, th - border-bottom: .1rem solid $color-quinary - padding: 1.2rem 1.5rem - text-align: left + border-bottom: .1rem solid $color-quinary + padding: 1.2rem 1.5rem + text-align: left - &:first-child - padding-left: 0 + &:first-child + padding-left: 0 - &:last-child - padding-right: 0 + &:last-child + padding-right: 0 diff --git a/src/_Typography.sass b/src/_Typography.sass index a4b9a5b..27e8e18 100644 --- a/src/_Typography.sass +++ b/src/_Typography.sass @@ -4,10 +4,10 @@ b, strong - font-weight: bold + font-weight: bold p - margin-top: 0 + margin-top: 0 h1, h2, @@ -15,34 +15,34 @@ h3, h4, h5, h6 - font-weight: 300 - letter-spacing: -.1rem - margin-bottom: 2.0rem - margin-top: 0 + font-weight: 300 + letter-spacing: -.1rem + margin-bottom: 2.0rem + margin-top: 0 h1 - font-size: 4.6rem - line-height: 1.2 + font-size: 4.6rem + line-height: 1.2 h2 - font-size: 3.6rem - line-height: 1.25 + font-size: 3.6rem + line-height: 1.25 h3 - font-size: 2.8rem - line-height: 1.3 + font-size: 2.8rem + line-height: 1.3 h4 - font-size: 2.2rem - letter-spacing: -.08rem - line-height: 1.35 + font-size: 2.2rem + letter-spacing: -.08rem + line-height: 1.35 h5 - font-size: 1.8rem - letter-spacing: -.05rem - line-height: 1.5 + font-size: 1.8rem + letter-spacing: -.05rem + line-height: 1.5 h6 - font-size: 1.6rem - letter-spacing: 0 - line-height: 1.4 + font-size: 1.6rem + letter-spacing: 0 + line-height: 1.4 diff --git a/src/_Utility.sass b/src/_Utility.sass index ae0dd97..9c3ea73 100644 --- a/src/_Utility.sass +++ b/src/_Utility.sass @@ -5,14 +5,14 @@ // Clear a float with .clearfix .clearfix - &:after - clear: both - content: ' ' // The space content is one way to avoid an Opera bug. - display: table + &:after + clear: both + content: ' ' // The space content is one way to avoid an Opera bug. + display: table // Float either direction .float-left - float: left + float: left .float-right - float: right + float: right