diff --git a/package.json b/package.json index 16a3345..4e3de43 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ }, "license": "MIT", "devDependencies": { + "cssnano": "^3.10.0", "perfect-scrollbar": "git://github.com/CartoDB/perfect-scrollbar.git#master", "postcss": "^5.2.8", "postcss-browser-reporter": "^0.5.0", diff --git a/src/components/_avatars.scss b/src/components/_avatars.css similarity index 91% rename from src/components/_avatars.scss rename to src/components/_avatars.css index b6d6558..ba95446 100644 --- a/src/components/_avatars.scss +++ b/src/components/_avatars.css @@ -29,7 +29,7 @@ .CDB-AvatarList-item { display: inline-block; margin-left: -12px; - border: 2px solid $cWhite; + border: 2px solid white; border-radius: 50%; vertical-align: middle; } @@ -38,9 +38,9 @@ display: inline-block; margin-left: -12px; padding: 2px 6px; - border-left: 2px solid $cWhite; + border-left: 2px solid white; border-radius: 50px; - background: $cSecondaryLine; + background: var(--color-line-secondary); } .CDB-AvatarList-itemMedia { diff --git a/src/components/_boxes.scss b/src/components/_boxes.css similarity index 86% rename from src/components/_boxes.scss rename to src/components/_boxes.css index fbdcd66..f90cf58 100644 --- a/src/components/_boxes.scss +++ b/src/components/_boxes.css @@ -12,9 +12,9 @@ .CDB-Box-modal { min-width: 160px; - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: 4px; - background: $cWhite; + background: white; box-shadow: 0 $baseSize $baseSize * 2 0 rgba(0, 0, 0, 0.16); box-sizing: border-box; } @@ -25,7 +25,7 @@ .CDB-Box-modalHeaderItem { @include display-flex(); padding: $baseSize + 4 $baseSize * 2; - border-bottom: 1px solid $cMainLine; + border-bottom: 1px solid var(--color-line); } .CDB-Box-modalHeaderItem--block { display: block; diff --git a/src/components/_buttons.scss b/src/components/_buttons.css similarity index 90% rename from src/components/_buttons.scss rename to src/components/_buttons.css index daab640..4f99d24 100644 --- a/src/components/_buttons.scss +++ b/src/components/_buttons.css @@ -238,42 +238,42 @@ Layout Component: } .CDB-Button--primary { - background: $cBlue; - color: $cWhite; + background: var(--color-blue); + color: white; &:hover, &:active { - background: $cBlueHover; + background: var(--color-blue-hover); } &.is-loading { &:hover, &:active { - background: $cBlue; + background: var(--color-blue); } } &.is-disabled { &:hover, &:active { - background: $cBlue; + background: var(--color-blue); } } } .CDB-Button--alert { - background: $cAlert; - color: $cWhite; + background: var(--color-alert); + color: white; &:hover, &:active { - background: darken($cAlert, 8%); + background: darken(var(--color-alert), 8%); } &.is-disabled { &:hover, &:active { - background: $cAlert; + background: var(--color-alert); } } } @@ -281,34 +281,34 @@ Layout Component: .CDB-Button--error, .CDB-Button--negative { - background: $cError; - color: $cWhite; + background: var(--color-error); + color: white; &:hover, &:active { - background: darken($cError, 8%); + background: darken(var(--color-error), 8%); } &.is-disabled { &:hover, &:active { - background: $cError; + background: var(--color-error); } } } .CDB-Button--dashed { padding: 13px 0; - border: 1px dashed $cHintText; - color: $cBlue; + border: 1px dashed var(--color-text-alt); + color: var(--color-blue); &:hover { - border-color: $cBlue; + border-color: var(--color-blue); } &.is-disabled { &:hover { - border-color: $cHintText; + border-color: var(--color-text-alt); } } } @@ -419,23 +419,23 @@ Layout Component: .CDB-Button--secondary { - color: $cBlue; - box-shadow: inset 0 0 0 1px $cBlue; + color: var(--color-blue); + box-shadow: inset 0 0 0 1px var(--color-blue); &:hover { - background: rgba($cBlue, 0.08); - box-shadow: inset 0 0 0 2px $cBlueHover; + background: rgba(var(--color-blue), 0.08); + box-shadow: inset 0 0 0 2px var(--color-blue-hover); } &:active { - background: $cBlue; - color: $cWhite; + background: var(--color-blue); + color: white; } &.is-disabled { &:hover { background: transparent; - box-shadow: inset 0 0 0 1px $cBlue; + box-shadow: inset 0 0 0 1px var(--color-blue); } &:active { @@ -449,27 +449,27 @@ Layout Component: &:hover, &:active { background: none; - color: $cBlue; + color: var(--color-blue); } } &--background { - background-color: $cWhite; + background-color: white; } } .CDB-Button--white { - color: $cWhite; - box-shadow: inset 0 0 0 1px $cWhite; + color: white; + box-shadow: inset 0 0 0 1px white; &:hover { - background: rgba($cWhite, 0.08); - box-shadow: inset 0 0 0 2px darken($cWhite, 8%); + background: rgba(white, 0.08); + box-shadow: inset 0 0 0 2px darken(white, 8%); } &:active { background: rgba($cMainBg, 0.08); - color: $cWhite; + color: white; } &.is-disabled { @@ -477,12 +477,12 @@ Layout Component: &:hover { background: transparent; - box-shadow: inset 0 0 0 1px $cWhite; + box-shadow: inset 0 0 0 1px white; } &:active { background: transparent; - color: $cWhite; + color: white; } } @@ -492,7 +492,7 @@ Layout Component: &:hover, &:active { background: none; - color: $cWhite; + color: white; } } } diff --git a/src/components/_colors.scss b/src/components/_colors.css similarity index 84% rename from src/components/_colors.scss rename to src/components/_colors.css index 98cb077..74487ce 100644 --- a/src/components/_colors.scss +++ b/src/components/_colors.css @@ -16,11 +16,11 @@ */ .Color-Blue { - background: $cBlue; + background: var(--color-blue); } .Color-White { border: 1px solid #E5E5E5; - background: $cWhite; + background: white; } .Color-Dark { background: $cBlack; @@ -36,7 +36,7 @@ background: $cSecondaryBackground; } .Color-ThirdBackground { - background: $cThirdBackground; + background: var(--color-softgray); } @@ -54,13 +54,13 @@ .Color-HoverLine { - background: $cHoverLine; + background: var(--color-line-hover); } .Color-MainLine { - background: $cMainLine; + background: var(--color-line); } .Color-SecondaryLine { - background: $cSecondaryLine; + background: var(--color-line-secondary); } @@ -80,13 +80,13 @@ .Color-Type02 { - background: $cSecondaryText; + background: var(--color-text-secondary); } .Color-Type03 { - background: $cAltText; + background: var(--color-text-alt); } .Color-Type04 { - background: $cHintText; + background: var(--color-text-alt); } @@ -108,7 +108,7 @@ background: $cHighlight; } .Color-Alert { - background: $cAlert; + background: var(--color-alert); } .Color-Public { background: $cPublic; @@ -120,5 +120,5 @@ background: $cPassword; } .Color-Error { - background: $cError; + background: var(--color-error); } diff --git a/src/components/_headers.scss b/src/components/_headers.css similarity index 98% rename from src/components/_headers.scss rename to src/components/_headers.css index 2f89782..a0efbee 100644 --- a/src/components/_headers.scss +++ b/src/components/_headers.css @@ -211,10 +211,10 @@ width: $baseSize * 3; min-width: $baseSize * 3; height: $baseSize * 3; - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: 4px; - background-color: $cWhite; - color: $cAltText; + background-color: white; + color: var(--color-text-alt); font-size: $sFontSize-small; line-height: 23px; text-align: center; diff --git a/src/components/_layer-selector.scss b/src/components/_layer-selector.css similarity index 91% rename from src/components/_layer-selector.scss rename to src/components/_layer-selector.css index 62d5391..6a0b4b4 100644 --- a/src/components/_layer-selector.scss +++ b/src/components/_layer-selector.css @@ -14,7 +14,7 @@ position: relative; } .CDB-SelectorLayer.is-disabled { - background-color: $cThirdBackground; + background-color: var(--color-softgray); } .CDB-SelectorLayer-letter { height: 14px; diff --git a/src/components/_lists.scss b/src/components/_lists.css similarity index 90% rename from src/components/_lists.scss rename to src/components/_lists.css index 3c016b6..e70d220 100644 --- a/src/components/_lists.scss +++ b/src/components/_lists.css @@ -11,7 +11,7 @@ */ .CDB-ListDecoration-item { - border-bottom: 1px solid $cSecondaryLine; + border-bottom: 1px solid var(--color-line-secondary); &:last-child { border-bottom: 0; diff --git a/src/components/_loader.scss b/src/components/_loader.css similarity index 96% rename from src/components/_loader.scss rename to src/components/_loader.css index 1834d4d..97f17b7 100644 --- a/src/components/_loader.scss +++ b/src/components/_loader.css @@ -19,7 +19,7 @@ This is the generic loader for widgets, maps, components, ... width: 50%; height: 3px; transform: translateX(-200%); - background-image: linear-gradient(90deg, rgba($cBlue, 1) 0%, #32BBFE 90%, #FAFEFF 95%); + background-image: linear-gradient(90deg, rgba(var(--color-blue), 1) 0%, #32BBFE 90%, #FAFEFF 95%); z-index: 2; } @@ -138,7 +138,7 @@ This is the generic loader for widgets, maps, components, ... stroke: rgba(0, 0, 0, 0.24); } .CDB-LoaderIcon.is-blue .CDB-LoaderIcon-path { - stroke: $cBlue; + stroke: var(--color-blue); } @keyframes rotate { diff --git a/src/components/_menu.scss b/src/components/_menu.css similarity index 89% rename from src/components/_menu.scss rename to src/components/_menu.css index ba018c0..92ac1eb 100644 --- a/src/components/_menu.scss +++ b/src/components/_menu.css @@ -136,7 +136,7 @@ .CDB-NavMenu-inner { position: relative; margin-bottom: 18px; - border-bottom: 1px solid $cMainLine; + border-bottom: 1px solid var(--color-line); &--no-margin { margin-bottom: 0; @@ -158,10 +158,10 @@ transition: border-color 0.2s ease-in; border-bottom: 2px solid transparent; border-radius: 0; - color: $cBlue; + color: var(--color-blue); &:hover { - border-bottom: 2px solid $cBlueHover; + border-bottom: 2px solid var(--color-blue-hover); } } @@ -179,12 +179,12 @@ .CDB-NavMenu-item.is-disabled .CDB-NavMenu-link { pointer-events: none; - color: $cHintText; + color: var(--color-text-alt); cursor: default; } .CDB-NavSubmenu { - border-bottom: 2px solid $cSecondaryLine; + border-bottom: 2px solid var(--color-line-secondary); &--inside { position: absolute; @@ -206,16 +206,16 @@ transition: border-color 0.2s ease-in; border-bottom: 2px solid transparent; border-radius: 0; - color: $cBlue; + color: var(--color-blue); &:hover { - border-bottom: 2px solid $cBlueHover; + border-bottom: 2px solid var(--color-blue-hover); } } .CDB-NavSubmenu-item.is-selected .CDB-NavSubmenu-link { - border-bottom: 2px solid $cMainLine; + border-bottom: 2px solid var(--color-line); color: $cMainText; } @@ -226,16 +226,16 @@ .CDB-NavMenu.is-dark { .CDB-NavMenu-inner, .CDB-NavSubmenu { - border-bottom: 1px solid $cSecondaryText; + border-bottom: 1px solid var(--color-text-secondary); } .CDB-NavMenu-link, .CDB-NavSubmenu-link { margin-bottom: -1px; - color: $cAltText; + color: var(--color-text-alt); &:hover { - border-bottom: 2px solid darken($cMainLine, 8%); + border-bottom: 2px solid darken(var(--color-line), 8%); } } @@ -246,16 +246,16 @@ } .CDB-NavMenu-item.is-selected .CDB-NavMenu-link { - border-bottom: 2px solid $cMainLine; - color: $cWhite; + border-bottom: 2px solid var(--color-line); + color: white; } .CDB-NavSubmenu-item.is-selected .CDB-NavSubmenu-link { - border-bottom: 2px solid $cMainLine; - color: $cWhite; + border-bottom: 2px solid var(--color-line); + color: white; } .CDB-NavSubmenu-status { - color: $cSecondaryText; + color: var(--color-text-secondary); } } diff --git a/src/components/_tags.scss b/src/components/_tags.css similarity index 93% rename from src/components/_tags.scss rename to src/components/_tags.css index 9ba0c5b..1166d08 100644 --- a/src/components/_tags.scss +++ b/src/components/_tags.css @@ -25,9 +25,9 @@ .CDB-Tag { padding: 0 3px; - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); border-radius: 2px; - color: $cBlue; + color: var(--color-blue); &.is-public { border: 1px solid $cPublic; @@ -42,8 +42,8 @@ color: $cPassword; } &.is-private { - border: 1px solid $cError; - color: $cError; + border: 1px solid var(--color-error); + color: var(--color-error); } } @@ -93,7 +93,7 @@ @include display-flex(); padding: $halfBaseSize $halfBaseSize $halfBaseSize $baseSize; border-radius: $halfBaseSize; - background: rgba($cBlue, 0.16); + background: rgba(var(--color-blue), 0.16); } /* SG diff --git a/src/components/_tooltips.scss b/src/components/_tooltips.css similarity index 93% rename from src/components/_tooltips.scss rename to src/components/_tooltips.css index f90333d..22bbc0d 100644 --- a/src/components/_tooltips.scss +++ b/src/components/_tooltips.css @@ -93,16 +93,16 @@ .is-error { &.CDB-InfoTooltip.CDB-InfoTooltip--up::after { - border-bottom-color: $cError; + border-bottom-color: var(--color-error); } &.CDB-InfoTooltip.CDB-InfoTooltip--down::after { - border-top-color: $cError; + border-top-color: var(--color-error); } &.CDB-InfoTooltip.CDB-InfoTooltip--left::after { - border-right-color: $cError; + border-right-color: var(--color-error); } &.CDB-InfoTooltip.CDB-InfoTooltip--right::after { - border-left-color: $cError; + border-left-color: var(--color-error); } } @@ -135,9 +135,9 @@ } .CDB-InfoTooltip.is-error { - background: $cError; + background: var(--color-error); } .CDB-InfoTooltip-text { - color: $cWhite; + color: white; } diff --git a/src/components/_typography.scss b/src/components/_typography.css similarity index 90% rename from src/components/_typography.scss rename to src/components/_typography.css index 2726ca0..5f2f5f4 100644 --- a/src/components/_typography.scss +++ b/src/components/_typography.css @@ -32,7 +32,7 @@ } .is-underlined { - border-bottom: 1px dotted $cMainLine; + border-bottom: 1px dotted var(--color-line); } .CDB-Size-huge { @@ -46,8 +46,8 @@ } .CDB-Size-medium { - font-size: $sFontSize-medium; - line-height: $sLineHeight-medium; + font-size: var(--font-size-medium); + line-height: var(--line-height-medium); } .CDB-Size-small { @@ -65,7 +65,7 @@ } .CDB-FontSize-medium { - font-size: $sFontSize-medium; + font-size: var(--font-size-medium); } .CDB-IconFont.is-disabled { diff --git a/src/components/forms/_checkbox.scss b/src/components/forms/_checkbox.scss deleted file mode 100644 index 5202f46..0000000 --- a/src/components/forms/_checkbox.scss +++ /dev/null @@ -1,113 +0,0 @@ -// CheckBoxes styles -// ---------------------------------------------- - -/* SG -# Forms/Checkbox - -``` -
- - -
-
- - -
-
- - -
-``` -*/ - -.CDB-Checkbox { - position: absolute; - width: $baseSize * 2; - height: $baseSize * 2; - opacity: 0; - vertical-align: middle; - z-index: 1; -} - -.CDB-Checkbox-face { - position: relative; - width: $baseSize * 2; - height: $baseSize * 2; - border: 1px solid $cMainLine; - border-radius: 3px; - background: $cWhite; - cursor: pointer; - box-sizing: border-box; - z-index: 2; - pointer-events: none; - - &::before, - &::after { - display: block; - position: absolute; - bottom: 3px; - width: 2px; - border-radius: 1px; - background: $cWhite; - content: ''; - } - - &::before { - right: $baseSize / 2; - height: $baseSize; - transform: rotate(45deg); - } - - &::after { - left: $baseSize / 2; - height: $baseSize - 2; - transform: rotate(-45deg); - } -} - -.CDB-Checkbox:checked + .CDB-Checkbox-face { - transition: background 300ms; - border: 1px solid $cBlue; - background: $cBlue; - - &::before, - &::after { - background: $cWhite; - } -} - -.CDB-Checkbox:checked:hover + .CDB-Checkbox-face { - border: 1px solid $cBlue; - - &::before, - &::after { - background: $cWhite; - } -} - -.CDB-Checkbox:hover + .CDB-Checkbox-face { - border: 1px solid $cBlueHover; - - &::before, - &::after { - background: $cHoverLine; - } -} -.CDB-Checkbox:active + .CDB-Checkbox-face { - border: 1px solid $cBlue; - - &::before, - &::after { - background: $cBlue; - } -} - -.CDB-Checkbox:disabled + .CDB-Checkbox-face { - border: 1px solid $cSecondaryLine; - background: $cThirdBackground; - - &::before, - &::after { - opacity: 0; - } -} diff --git a/src/components/forms/_dropdowns.scss b/src/components/forms/_dropdowns.css similarity index 94% rename from src/components/forms/_dropdowns.scss rename to src/components/forms/_dropdowns.css index ff77ab7..d46ed53 100644 --- a/src/components/forms/_dropdowns.scss +++ b/src/components/forms/_dropdowns.css @@ -125,13 +125,13 @@ .CDB-Dropdown-calculations { box-sizing: border-box; padding: $sMargin-element; - border-right: 1px solid $cMainLine; + border-right: 1px solid var(--color-line); border-radius: 4px 0 0 4px; background-color: $cSecondaryBackground; } .CDB-Dropdown-calculationsElement { - margin-bottom: $sLineHeight-medium; + margin-bottom: var(--line-height-medium); color: $cMainBg; font-size: $sFontSize-small; @@ -143,22 +143,22 @@ .CDB-Dropdown-options { width: $baseSize * 20; border-radius: 0 4px 4px 0; - background-color: $cWhite; + background-color: white; vertical-align: top; } .CDB-Dropdown-optionsElement { @include text-overflow(); padding: 12px 10px; - border-bottom: 1px solid $cMainLine; - color: $cBlue; + border-bottom: 1px solid var(--color-line); + color: var(--color-blue); &:last-child { border-bottom: 0; } &:hover { - background-color: rgba($cBlue, 0.08); + background-color: rgba(var(--color-blue), 0.08); color: $cMainBg; cursor: pointer; } @@ -168,7 +168,7 @@ } &.is-disabled { - color: $cHintText; + color: var(--color-text-alt); &:hover { background-color: transparent; diff --git a/src/components/forms/_inputs.scss b/src/components/forms/_inputs.css similarity index 73% rename from src/components/forms/_inputs.scss rename to src/components/forms/_inputs.css index 5f222ba..1c1e8f9 100644 --- a/src/components/forms/_inputs.scss +++ b/src/components/forms/_inputs.css @@ -15,10 +15,10 @@ width: 100%; min-height: 32px; padding: 7px 8px; - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: $baseSize / 2; - font-size: $sFontSize-medium; - line-height: $sLineHeight-medium; + font-size: var(--font-size-medium); + line-height: var(--line-height-medium); box-sizing: border-box; &.is-cursor { @@ -26,7 +26,7 @@ } &.is-empty { - color: $cHintText; + color: var(--color-text-alt); } &.is-number { @@ -34,12 +34,12 @@ } &.is-null { - color: $cHintText; + color: var(--color-text-alt); font-style: italic; } &:hover { - border: 1px solid $cBlueHover; + border: 1px solid var(--color-blue-hover); } &:focus { @@ -49,8 +49,8 @@ &:disabled, &.is-disabled { - border-color: $cSecondaryLine; - background: $cThirdBackground; + border-color: var(--color-line-secondary); + background: var(--color-softgray); cursor: default; } @@ -67,8 +67,8 @@ width: 100%; border: 0; background: transparent; - font-size: $sFontSize-medium; - line-height: $sLineHeight-medium; + font-size: var(--font-size-medium); + line-height: var(--line-height-medium); box-sizing: border-box; } diff --git a/src/components/forms/_legends.scss b/src/components/forms/_legends.css similarity index 100% rename from src/components/forms/_legends.scss rename to src/components/forms/_legends.css diff --git a/src/components/forms/_option-input.scss b/src/components/forms/_option-input.css similarity index 96% rename from src/components/forms/_option-input.scss rename to src/components/forms/_option-input.css index 52b8944..6fd6bfd 100644 --- a/src/components/forms/_option-input.scss +++ b/src/components/forms/_option-input.css @@ -124,7 +124,7 @@ justify-content: center; width: 100%; height: 100%; - font-size: $sFontSize-medium; + font-size: var(--font-size-medium); &.is-active, &:hover, @@ -143,10 +143,10 @@ } .CDB-OptionInput-container--border .CDB-OptionInput-item { - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); &:hover { - border: 1px solid $cBlueHover; + border: 1px solid var(--color-blue-hover); } &.is-active, @@ -186,7 +186,7 @@ } &:hover::after { - background-color: $cBlueHover; + background-color: var(--color-blue-hover); } &.is-active::after, diff --git a/src/components/forms/_radio.scss b/src/components/forms/_radio.css similarity index 75% rename from src/components/forms/_radio.scss rename to src/components/forms/_radio.css index ca261d3..d10a460 100644 --- a/src/components/forms/_radio.scss +++ b/src/components/forms/_radio.css @@ -34,9 +34,9 @@ position: relative; width: $baseSize * 2; height: $baseSize * 2; - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: 50%; - background: $cWhite; + background: white; text-indent: 20px; cursor: pointer; box-sizing: border-box; @@ -50,24 +50,24 @@ margin-top: -3px; margin-left: -3px; border-radius: 50%; - background: $cWhite; + background: white; content: ''; } } .CDB-Radio:checked + .CDB-Radio-face { transition: background 300ms; - border: 1px solid $cBlue; - background: $cBlue; + border: 1px solid var(--color-blue); + background: var(--color-blue); &::before { - background: $cWhite; + background: white; } } .CDB-Radio:disabled + .CDB-Radio-face { - border: 1px solid $cSecondaryLine; - background: $cThirdBackground; + border: 1px solid var(--color-line-secondary); + background: var(--color-softgray); &::before { opacity: 0; @@ -75,30 +75,30 @@ } .CDB-Radio:disabled:hover + .CDB-Radio-face { - border: 1px solid $cSecondaryLine; + border: 1px solid var(--color-line-secondary); } .CDB-Radio:hover + .CDB-Radio-face { - border: 1px solid $cBlueHover; + border: 1px solid var(--color-blue-hover); &::before { - background: $cHoverLine; + background: var(--color-line-hover); } } .CDB-Radio:focus + .CDB-Radio-face, .CDB-Radio:checked:hover + .CDB-Radio-face { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); } .CDB-Radio:checked:hover + .CDB-Radio-face { &::before { - background: $cWhite; + background: white; } } .CDB-Radio:active + .CDB-Radio-face { &::before { - background: $cBlue; + background: var(--color-blue); } } diff --git a/src/components/forms/_selects.scss b/src/components/forms/_selects.css similarity index 89% rename from src/components/forms/_selects.scss rename to src/components/forms/_selects.css index 3a69340..aed4cb2 100644 --- a/src/components/forms/_selects.scss +++ b/src/components/forms/_selects.css @@ -69,23 +69,23 @@ appearance: none; width: 100%; padding: 7px 8px 6px; - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: $baseSize / 2; - background: $cWhite; - font-size: $sFontSize-medium; - line-height: $sLineHeight-medium; + background: white; + font-size: var(--font-size-medium); + line-height: var(--line-height-medium); box-sizing: border-box; &:hover { - border: 1px solid $cHoverLine; + border: 1px solid var(--color-line-hover); } &:focus { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); outline: none; } &:disabled { - border-color: $cSecondaryLine; - background: $cThirdBackground; + border-color: var(--color-line-secondary); + background: var(--color-softgray); } &.has-error { @include default-form-error-style(); diff --git a/src/components/forms/_tabsForms.scss b/src/components/forms/_tabsForms.css similarity index 96% rename from src/components/forms/_tabsForms.scss rename to src/components/forms/_tabsForms.css index b1655ba..b263feb 100644 --- a/src/components/forms/_tabsForms.scss +++ b/src/components/forms/_tabsForms.css @@ -73,14 +73,14 @@ */ .CDB-TabsForms { - border: 1px solid $cMainLine; + border: 1px solid var(--color-line); border-radius: 4px; } .CDB-TabsForms-inner { @include display-flex(); } .CDB-TabsForms-item { - border-left: 1px solid $cSecondaryLine; + border-left: 1px solid var(--color-line-secondary); } .CDB-TabsForms-item:first-child { border-left: 0; diff --git a/src/components/forms/_textarea.scss b/src/components/forms/_textarea.scss deleted file mode 100644 index e6ace99..0000000 --- a/src/components/forms/_textarea.scss +++ /dev/null @@ -1,43 +0,0 @@ -// Textarea styles -// ---------------------------------------------- - -/* SG -# Forms/Textareas - -``` - - - -``` -*/ - -.CDB-Textarea { - width: 100%; - padding: 7px 8px 6px; - border: 1px solid $cMainLine; - border-radius: $baseSize / 2; - font-size: $sFontSize-medium; - line-height: $sLineHeight-medium; - box-sizing: border-box; - - &:hover { - border: 1px solid $cHoverLine; - } - &:focus { - border: 1px solid $cBlue; - outline-color: transparent; - outline-style: none; - } - &:disabled, - &.is-disabled { - border-color: $cSecondaryLine; - background: $cThirdBackground; - } - &:has-error { - @include default-form-error-style(); - } -} -.CDB-FieldError .CDB-Textarea, -.CDB-Textarea.has-error { - @include default-form-error-style(); -} diff --git a/src/components/forms/_toggle.scss b/src/components/forms/_toggle.scss deleted file mode 100644 index 46972f8..0000000 --- a/src/components/forms/_toggle.scss +++ /dev/null @@ -1,83 +0,0 @@ -// Radio Button styles -// ---------------------------------------------- - -/* SG -# Forms/Toggle - - -``` -
-
- - - - -
-
- -
- -
-
- - - - -
-
-``` -*/ - -.CDB-Toggle { - position: absolute; - width: $baseSize * 4; - height: $baseSize * 2; - opacity: 0; - z-index: 1; - - &:hover { - + .CDB-ToggleFace { - background: $cHintTextHover; - } - - &:checked + .CDB-ToggleFace { - background: $cHighlightHover; - } - } - - + .CDB-ToggleFace { - position: relative; - width: $baseSize * 4; - height: $baseSize * 2; - margin: 0 2px; - transition: background 300ms; - border-radius: 50px; - background: $cHintText; - - &::before { - position: absolute; - top: 2px; - left: 2px; - width: $baseSize + 4; - height: $baseSize + 4; - border-radius: 50%; - background: $cWhite; - box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.48); - content: ''; - } - } - - &:checked + .CDB-ToggleFace { - background: $cHighlight; - - &::before { - right: 2px; - left: auto; - } - } -} - -.Toggle .is-disabled { - opacity: 0.24; - pointer-events: none; -} diff --git a/src/components/forms/checkbox.css b/src/components/forms/checkbox.css new file mode 100644 index 0000000..4e9a779 --- /dev/null +++ b/src/components/forms/checkbox.css @@ -0,0 +1,91 @@ +.CDB-Checkbox { + position: absolute; + width: 16px; + height: 16px; + opacity: 0; + vertical-align: middle; + z-index: 1; +} + +.CDB-Checkbox-face { + position: relative; + width: 16px; + height: 16px; + border: 1px solid var(--color-line); + border-radius: 3px; + background: white; + cursor: pointer; + box-sizing: border-box; + z-index: 2; + pointer-events: none; + + &::before, + &::after { + display: block; + position: absolute; + bottom: 3px; + width: 2px; + border-radius: 1px; + background: white; + content: ''; + } + + &::before { + right: 4px; + height: 8px; + transform: rotate(45deg); + } + + &::after { + left: 4px; + height: 6px; + transform: rotate(-45deg); + } +} + +.CDB-Checkbox:checked + .CDB-Checkbox-face { + transition: background 300ms; + border: 1px solid var(--color-blue); + background: var(--color-blue); + + &::before, + &::after { + background: white; + } +} + +.CDB-Checkbox:checked:hover + .CDB-Checkbox-face { + border: 1px solid var(--color-blue); + + &::before, + &::after { + background: white; + } +} + +.CDB-Checkbox:hover + .CDB-Checkbox-face { + border: 1px solid var(--color-blue-hover); + + &::before, + &::after { + background: var(--color-line-hover); + } +} +.CDB-Checkbox:active + .CDB-Checkbox-face { + border: 1px solid var(--color-blue); + + &::before, + &::after { + background: var(--color-blue); + } +} + +.CDB-Checkbox:disabled + .CDB-Checkbox-face { + border: 1px solid var(--color-line-hover); + background: var(--color-softgray); + + &::before, + &::after { + opacity: 0; + } +} diff --git a/src/components/forms/textarea.css b/src/components/forms/textarea.css new file mode 100644 index 0000000..5d76904 --- /dev/null +++ b/src/components/forms/textarea.css @@ -0,0 +1,38 @@ +.CDB-Textarea { + width: 100%; + padding: 7px 8px 6px; + border: 1px solid var(--color-line); + border-radius: 4px; + font-size: var(--font-size-medium); + line-height: var(--line-height-medium); + box-sizing: border-box; + + &:hover { + border: 1px solid var(--color-line-hover); + } + + &:focus { + border: 1px solid var(--color-blue); + outline-color: transparent; + outline-style: none; + } + + &:disabled, + &.is-disabled { + border-color: var(--color-line-secondary); + background: var(--color-softgray); + } + + &:has-error { + border: 1px solid color(var(--color-error) alpha(0.48)); + background: color(var(--color-error) alpha(0.04)); + color: var(--color-error); + } +} + +.CDB-FieldError .CDB-Textarea, +.CDB-Textarea.has-error { + border: 1px solid color(var(--color-error) alpha(0.48)); + background: color(var(--color-error) alpha(0.04)); + color: var(--color-error); +} diff --git a/src/components/forms/toggle.css b/src/components/forms/toggle.css new file mode 100644 index 0000000..5fdfa92 --- /dev/null +++ b/src/components/forms/toggle.css @@ -0,0 +1,53 @@ +.CDB-Toggle { + position: absolute; + width: 32px; + height: 16px; + opacity: 0; + z-index: 1; + + &:hover { + + .CDB-ToggleFace { + background: var(--color-text-alt-hover); + } + + &:checked + .CDB-ToggleFace { + background: var(--color-highlight); + } + } + + + .CDB-ToggleFace { + position: relative; + width: 32px; + height: 16px; + margin: 0 2px; + transition: background 300ms; + border-radius: 50px; + background: var(--color-text-alt); + + &::before { + position: absolute; + top: 2px; + left: 2px; + width: 12px; + height: 12px; + border-radius: 50%; + background: white; + box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.48); + content: ''; + } + } + + &:checked + .CDB-ToggleFace { + background: var(--color-highlight); + + &::before { + right: 2px; + left: auto; + } + } +} + +.Toggle .is-disabled { + opacity: 0.24; + pointer-events: none; +} diff --git a/src/components/shapes/_add.scss b/src/components/shapes/_add.css similarity index 97% rename from src/components/shapes/_add.scss rename to src/components/shapes/_add.css index 2860a56..e148c21 100644 --- a/src/components/shapes/_add.scss +++ b/src/components/shapes/_add.css @@ -114,13 +114,13 @@ Description .CDB-Shape-add.is-blue { &::before, &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-add.is-white { &::before, &::after { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_arrow.scss b/src/components/shapes/_arrow.css similarity index 86% rename from src/components/shapes/_arrow.scss rename to src/components/shapes/_arrow.css index 2f5cc7d..44ac86f 100644 --- a/src/components/shapes/_arrow.scss +++ b/src/components/shapes/_arrow.css @@ -59,25 +59,25 @@ Description } .CDB-Shape-Arrow.is-blue { - background: $cBlue; + background: var(--color-blue); &::before { - background: $cBlue; + background: var(--color-blue); } &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-Arrow.is-white { - background: $cWhite; + background: white; &::before { - background: $cWhite; + background: white; } &::after { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_check-circle.scss b/src/components/shapes/_check-circle.css similarity index 93% rename from src/components/shapes/_check-circle.scss rename to src/components/shapes/_check-circle.css index 42323d8..46fb570 100644 --- a/src/components/shapes/_check-circle.scss +++ b/src/components/shapes/_check-circle.css @@ -67,10 +67,10 @@ Description transform: translateY(2px); } &.is-blue { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); } &.is-white { - border: 1px solid $cWhite; + border: 1px solid white; } } @@ -125,19 +125,19 @@ Description .CDB-Shape-tick.is-blue { &::before { - background: $cBlue; + background: var(--color-blue); } &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-tick.is-white { &::before { - background: $cWhite; + background: white; } &::after { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_close.scss b/src/components/shapes/_close.css similarity index 92% rename from src/components/shapes/_close.scss rename to src/components/shapes/_close.css index 5ecde8e..f2da5e1 100644 --- a/src/components/shapes/_close.scss +++ b/src/components/shapes/_close.css @@ -120,27 +120,27 @@ Description .CDB-Shape-close.is-blue { &::before { - background: $cBlue; + background: var(--color-blue); } &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-close.is-white { &::before { - background: $cWhite; + background: white; } &::after { - background: $cWhite; + background: white; } } .CDB-Shape-close.is-red { &::before { - background: $cError; + background: var(--color-error); } &::after { - background: $cError; + background: var(--color-error); } } diff --git a/src/components/shapes/_dash.scss b/src/components/shapes/_dash.css similarity index 96% rename from src/components/shapes/_dash.scss rename to src/components/shapes/_dash.css index 84c32f1..ce3c5b2 100644 --- a/src/components/shapes/_dash.scss +++ b/src/components/shapes/_dash.css @@ -69,12 +69,12 @@ Description .CDB-Shape-dash.is-blue { &::before { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-dash.is-white { &::before { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_dataset.scss b/src/components/shapes/_dataset.css similarity index 93% rename from src/components/shapes/_dataset.scss rename to src/components/shapes/_dataset.css index 4635801..584790d 100644 --- a/src/components/shapes/_dataset.scss +++ b/src/components/shapes/_dataset.css @@ -92,12 +92,12 @@ Description margin-left: -10px; border: 1px solid $cMainBg; border-radius: 50%; - background: $cWhite; + background: white; &:first-child { position: relative; margin-left: 0; - box-shadow: 3px 0 0 $cWhite; + box-shadow: 3px 0 0 white; z-index: 1; } } @@ -109,26 +109,26 @@ Description margin-left: -7px; &:first-child { margin-left: 0; - box-shadow: 2px 0 0 $cWhite; + box-shadow: 2px 0 0 white; } } } .CDB-Shape-Dataset.is-blue { .CDB-Shape-DatasetItem { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); } } .CDB-Shape-Dataset.is-grey { .CDB-Shape-DatasetItem { - border: 1px solid $cHoverLine; + border: 1px solid var(--color-line-hover); } } .CDB-Shape-Dataset.is-white { .CDB-Shape-DatasetItem { - border: 1px solid $cHoverLine; + border: 1px solid var(--color-line-hover); background: $cMainBg; &:first-child { box-shadow: 3px 0 $cMainBg; diff --git a/src/components/shapes/_dots.scss b/src/components/shapes/_dots.css similarity index 85% rename from src/components/shapes/_dots.scss rename to src/components/shapes/_dots.css index f082276..5a8bd7e 100644 --- a/src/components/shapes/_dots.scss +++ b/src/components/shapes/_dots.css @@ -17,9 +17,9 @@ You may resize and change the colors of the icons with the `glyph-`-classes. Ava width: $baseSize; height: $baseSize; border-radius: 50%; - background: $cSecondaryLine; + background: var(--color-line-secondary); &.is-selected { - background: $cSecondaryText; + background: var(--color-text-secondary); } } diff --git a/src/components/shapes/_error-circle.scss b/src/components/shapes/_error-circle.css similarity index 86% rename from src/components/shapes/_error-circle.scss rename to src/components/shapes/_error-circle.css index 12cc8eb..86bb401 100644 --- a/src/components/shapes/_error-circle.scss +++ b/src/components/shapes/_error-circle.css @@ -67,35 +67,35 @@ Description margin: 0 auto; } &.is-blue { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); } &.is-white { - border: 1px solid $cWhite; + border: 1px solid white; } &.is-green { border: 1px solid $cHighlight; } &.is-red { - border: 1px solid $cError; + border: 1px solid var(--color-error); } } .CDB-Shape-CircleItem--fill { &.is-blue { - border: 1px solid $cBlue; - background: $cBlue; + border: 1px solid var(--color-blue); + background: var(--color-blue); } &.is-white { - border: 1px solid $cWhite; - background: $cWhite; + border: 1px solid white; + background: white; } &.is-green { border: 1px solid $cHighlight; background: $cHighlight; } &.is-red { - border: 1px solid $cError; - background: $cError; + border: 1px solid var(--color-error); + background: var(--color-error); } } diff --git a/src/components/shapes/_hamburguer.scss b/src/components/shapes/_hamburguer.css similarity index 95% rename from src/components/shapes/_hamburguer.scss rename to src/components/shapes/_hamburguer.css index c1aeaf5..3aca767 100644 --- a/src/components/shapes/_hamburguer.scss +++ b/src/components/shapes/_hamburguer.css @@ -49,12 +49,12 @@ Description .CDB-Shape-hamburguer.is-blue { .CDB-Shape-hamburguerItem { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-hamburguer.is-white { .CDB-Shape-hamburguerItem { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_magnify.scss b/src/components/shapes/_magnify.css similarity index 94% rename from src/components/shapes/_magnify.scss rename to src/components/shapes/_magnify.css index 1c3466d..b96d3e9 100644 --- a/src/components/shapes/_magnify.scss +++ b/src/components/shapes/_magnify.css @@ -76,19 +76,19 @@ Description .CDB-Shape-magnify.is-blue { &::before { - border: 1px solid $cBlue; + border: 1px solid var(--color-blue); } &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-magnify.is-white { &::before { - border: 1px solid $cWhite; + border: 1px solid white; } &::after { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_move.scss b/src/components/shapes/_move.css similarity index 97% rename from src/components/shapes/_move.scss rename to src/components/shapes/_move.css index 792c34b..5db655f 100644 --- a/src/components/shapes/_move.scss +++ b/src/components/shapes/_move.css @@ -140,20 +140,20 @@ Description .CDB-Shape-rectsHandleItem--blue { &::before, &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-Shape-rectsHandleItem--white { &::before, &::after { - background: $cWhite; + background: white; } } .CDB-Shape-rectsHandleItem--grey { &::before, &::after { - background: $cHoverLine; + background: var(--color-line-hover); } } diff --git a/src/components/shapes/_paragraph.scss b/src/components/shapes/_paragraph.css similarity index 97% rename from src/components/shapes/_paragraph.scss rename to src/components/shapes/_paragraph.css index 36b736c..8a0b6a3 100644 --- a/src/components/shapes/_paragraph.scss +++ b/src/components/shapes/_paragraph.css @@ -88,12 +88,12 @@ Description display: inline-block; height: 1px; margin-bottom: 2px; - background: $cSecondaryLine; + background: var(--color-line-secondary); vertical-align: top; } .CDB-Shape-paragraph.is-active .CDB-Shape-paragraphBar { - background: $cBlue; + background: var(--color-blue); } .CDB-Shape-paragraphBar--01 { diff --git a/src/components/shapes/_threePoints.scss b/src/components/shapes/_threePoints.css similarity index 98% rename from src/components/shapes/_threePoints.scss rename to src/components/shapes/_threePoints.css index b15dad5..099e50d 100644 --- a/src/components/shapes/_threePoints.scss +++ b/src/components/shapes/_threePoints.css @@ -143,9 +143,9 @@ Description } .CDB-Shape-threePoints.is-blue .CDB-Shape-threePointsItem { - background: $cBlue; + background: var(--color-blue); } .CDB-Shape-threePoints.is-white .CDB-Shape-threePointsItem { - background: $cWhite; + background: white; } diff --git a/src/components/shapes/_toogle-arrow.scss b/src/components/shapes/_toogle-arrow.css similarity index 96% rename from src/components/shapes/_toogle-arrow.scss rename to src/components/shapes/_toogle-arrow.css index 240ea7a..3780856 100644 --- a/src/components/shapes/_toogle-arrow.scss +++ b/src/components/shapes/_toogle-arrow.css @@ -128,18 +128,18 @@ Description .CDB-ArrowToogle.is-blue { &::before { - background: $cBlue; + background: var(--color-blue); } &::after { - background: $cBlue; + background: var(--color-blue); } } .CDB-ArrowToogle.is-white { &::before { - background: $cWhite; + background: white; } &::after { - background: $cWhite; + background: white; } } diff --git a/src/components/shapes/_type.scss b/src/components/shapes/_type.css similarity index 94% rename from src/components/shapes/_type.scss rename to src/components/shapes/_type.css index a8aed38..436f5e9 100644 --- a/src/components/shapes/_type.scss +++ b/src/components/shapes/_type.css @@ -65,7 +65,7 @@ Description width: 3px; height: 3px; border-radius: 50%; - background: $cHoverLine; + background: var(--color-line-hover); } .CDB-Type-circle--01 { top: 0; @@ -91,7 +91,7 @@ Description right: 1px; bottom: 1px; left: 1px; - border: 1px solid $cHoverLine; + border: 1px solid var(--color-line-hover); content: ''; } @@ -104,6 +104,6 @@ Description left: 3px; width: 1px; transform: rotate(45deg); - background: $cHoverLine; + background: var(--color-line-hover); content: ''; } diff --git a/src/entry.css b/src/entry.css index 4d16617..8eeec76 100644 --- a/src/entry.css +++ b/src/entry.css @@ -1,6 +1,5 @@ @import 'variables/sizes'; @import 'variables/colors'; -@import 'utilities/mixins'; @import 'vendor/reset'; @import 'vendor/normalize'; diff --git a/src/utilities/_defaults.scss b/src/utilities/_defaults.scss deleted file mode 100644 index cf0f99d..0000000 --- a/src/utilities/_defaults.scss +++ /dev/null @@ -1,15 +0,0 @@ -// Default classes -// ---------------------------------------------- - -body { - color: $cMainText; -} - -a { - color: $cBlue; - text-decoration: none; -} - -a:hover { - text-decoration: underline; -} diff --git a/src/utilities/_mixins.scss b/src/utilities/_mixins.scss deleted file mode 100644 index d393024..0000000 --- a/src/utilities/_mixins.scss +++ /dev/null @@ -1,236 +0,0 @@ -// Mixins -// - Necessary SCSS functions -// - Browser support: -// · IE => 10 -// · Chrome => 21 -// · Sarafi => 6 -// · Firefox => 24 -// · Opera => 12 -// -------------------------------------------------- - -/* ADDS A BROWSER PREFIX TO THE PROPERTY */ -@mixin css3-prefix($property, $value) { - -webkit-#{$property}: #{$value}; - -khtml-#{$property}: #{$value}; - -moz-#{$property}: #{$value}; - -ms-#{$property}: #{$value}; - -o-#{$property}: #{$value}; - #{$property}: #{$value}; -} - -// Display inline -@mixin inline-block() { - display: inline-block; - vertical-align: middle; -} - -// Display flex functions -@mixin display-flex() { - display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ - display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ - display: -ms-flexbox; /* TWEENER - IE 10 */ - display: -webkit-flex; /* NEW - Chrome */ - display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ -} -@mixin flex($v) { - -webkit-box-flex: $v; - -moz-box-flex: $v; - -webkit-flex: $v; - -ms-flex: $v; - flex: $v; -} -@mixin flex-direction($v) { - -webkit-flex-direction: $v; - -moz-flex-direction: $v; - -ms-flex-direction: $v; - flex-direction: $v; - // IE10 doesn't support this property -} -@mixin flex-grow($v) { - -webkit-flex-grow: $v; - -moz-flex-grow: $v; - -ms-flex-grow: $v; - flex-grow: $v; - // IE10 fallback - -ms-flex: $v 0 auto; -} -@mixin flex-wrap($v) { - -webkit-flex-wrap: $v; - -moz-flex-wrap: $v; - -ms-flex-wrap: $v; - flex-wrap: $v; - // IE10 doesn't support this property -} -@mixin flex-order($v) { - -webkit-flex-order: $v; - -webkit-box-ordinal-group: $v; - -moz-box-ordinal-group: $v; - -moz-flex-order: $v; - -ms-flex-order: $v; - -ms-order: $v; - box-ordinal-group: $v; - flex-order: $v; - order: $v; -} -@mixin justify-content($v, $ie-v: "") { - -webkit-justify-content: $v; - -moz-justify-content: $v; - -ms-justify-content: $v; - justify-content: $v; - // Hello IE10 - -ms-flex-pack: if($ie-v != "", $ie-v, $v); -} -@mixin align-items($v, $ie-v: "") { - -webkit-align-items: $v; - -moz-align-items: $v; - -ms-align-items: $v; - align-items: $v; - // Hello IE10 - -ms-flex-align: if($ie-v != "", $ie-v, $v); -} -@mixin align-content($v, $ie-v: "") { - -webkit-align-content: $v; - -moz-align-content: $v; - -ms-align-content: $v; - align-content: $v; - // Hello IE10 - -ms-flex-align: if($ie-v != "", $ie-v, $v); -} - -// CSS3 typical functions -@mixin opacity($v) { - opacity:$v; - filter:alpha(opacity=($v*100)); // IE10 -} - -@mixin grayscale() { - -webkit-filter: grayscale(100%); - -moz-filter: grayscale(100%); - -ms-filter: grayscale(100%); - -o-filter: grayscale(100%); - filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+, Firefox on Android */ -} - - -@mixin background-gradient($startColor: #3C3C3C, $endColor: #999999) { - background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)); - background-image: -webkit-linear-gradient(top, $startColor, $endColor); - background-image: -moz-linear-gradient(top, $startColor, $endColor); - background-image: -ms-linear-gradient(top, $startColor, $endColor); - background-image: -o-linear-gradient(top, $startColor, $endColor); - background-image: linear-gradient(top, $startColor, $endColor); - filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}'); -} - -@mixin background-horizontal($startColor: #3C3C3C, $endColor: #999999) { - background-color: $startColor; - background-image: -webkit-gradient(linear, left top, right top, from($startColor), to($endColor)); - background-image: -webkit-linear-gradient(left, $startColor, $endColor); - background-image: -moz-linear-gradient(left, $startColor, $endColor); - background-image: -ms-linear-gradient(left, $startColor, $endColor); - background-image: -o-linear-gradient(left, $startColor, $endColor); - background-image: linear-gradient(left, $startColor, $endColor); - filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#{$startColor}', endColorStr='#{$endColor}', gradientType='1'); -} - -@mixin image-2x($image, $width, $height, $x: 0, $y: 0) { - @media (min--moz-device-pixel-ratio: 1.3), - (-o-min-device-pixel-ratio: 2.6/2), - (-webkit-min-device-pixel-ratio: 1.3), - (min-device-pixel-ratio: 1.3), - (min-resolution: 1.3dppx) { - /* on retina, use image that's scaled by 2 */ - background: url($image); - background-size: $width $height; - background-position: $x $y; - } -} - -@mixin transform($params) { - @include css3-prefix('transform', $params); -} - -@mixin transform-style($style: preserve-3d) { - @include css3-prefix('transform-style', $style); -} - -@mixin transition($properties...) { - - @if length($properties) >= 1 { - @include css3-prefix('transition', $properties); - } - - @else { - @include css3-prefix('transition', $what: all, $length: 1s, $easing: ease-in-out); - } -} - - -/* FONT FACE */ -@mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf', $svgFileSrc: 'myFont.svg', $svgFontID: '#myFont') { - @font-face { - font-family: $fontFamily; - src: url($eotFileSrc) format('eot'), - url($woffFileSrc) format('woff'), - url($ttfFileSrc) format('truetype'), - url($svgFileSrc + $svgFontID) format('svg'); - } -} - -@mixin keyframes($animation-name) { - @-webkit-keyframes #{$animation-name} { - @content; - } - @-moz-keyframes #{$animation-name} { - @content; - } - @-ms-keyframes #{$animation-name} { - @content; - } - @-o-keyframes #{$animation-name} { - @content; - } - @keyframes #{$animation-name} { - @content; - } -} - -@mixin text-overflow() { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} - -@mixin animation($str) { - @include css3-prefix('animation', $str); -} - -@mixin line-clamp($lines) { - height: $lines * $sLineHeight-normal; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: $lines; - overflow: hidden; - text-overflow: ellipsis; - &:after { - content: ' '; - display: block; - position: absolute; - bottom: 0; - right: 0; - height: $sLineHeight-normal; - width: 2 * $sLineHeight-normal; - @include background-horizontal(rgba(255,255,255,0), rgba(255,255,255,1)); - } -} - -@mixin media-query() { - @media only screen and (min-width: 320px) and (max-width: 960px) { - @content; - } -} -@mixin media-query-mobile() { - @media only screen and (max-width: 600px) { - @content; - } -} diff --git a/src/utilities/defaults.css b/src/utilities/defaults.css new file mode 100644 index 0000000..249f3e4 --- /dev/null +++ b/src/utilities/defaults.css @@ -0,0 +1,16 @@ +/** + * Base styles + */ + +body { + color: var(--color-text-primary); +} + +a { + color: var(--color-blue); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} diff --git a/src/utilities/_fonts.scss b/src/utilities/fonts.css similarity index 93% rename from src/utilities/_fonts.scss rename to src/utilities/fonts.css index 8013dc9..ae754da 100644 --- a/src/utilities/_fonts.scss +++ b/src/utilities/fonts.css @@ -1,6 +1,3 @@ -// Fonts -// -------------------------------------------------- - @font-face { font-family: 'Open Sans'; font-style: normal; diff --git a/src/utilities/_helpers.scss b/src/utilities/helpers.css similarity index 59% rename from src/utilities/_helpers.scss rename to src/utilities/helpers.css index e7ec814..abebef7 100644 --- a/src/utilities/_helpers.scss +++ b/src/utilities/helpers.css @@ -1,126 +1,165 @@ -// Helper classes -// ---------------------------------------------- +/* MARGINS */ + +.u-tSpace--s { + margin-top: 2px; +} -/* Margins */ .u-tSpace { margin-top: 4px; } + .u-tSpace--m { margin-top: 8px; } + .u-tSpace-xl { margin-top: 12px; } + .u-rSpace--s { margin-right: 2px; } + .u-rSpace { margin-right: 4px; } + .u-rSpace--m { margin-right: 8px; } + .u-rSpace--xl { margin-right: 12px; } + +.u-bSpace--s { + margin-bottom: 2px; +} + .u-bSpace { margin-bottom: 4px; } + .u-bSpace--m { margin-bottom: 8px; } + .u-bSpace--xl { margin-bottom: 12px; } -.u-lSpace { - margin-left: 4px; -} + .u-lSpace--s { margin-left: 2px; } + +.u-lSpace { + margin-left: 4px; +} + +.u-lSpace--m { + margin-left: 8px; +} + .u-lSpace--xl { margin-left: 12px; } +/* -- COLORS */ +.u-actionTextColor { + color: var(--color-blue); + + &:hover { + color: var(--color-blue-hover); + } +} + +.u-mainTextColor { + color: var(--color-text-primary); +} + +.u-secondaryTextColor { + color: var(--color-text-secondary); +} + +.u-altTextColor { + color: var(--color-text-alt); +} + +.u-hintTextColor { + color: var(--color-text-alt); +} + +.u-alertTextColor { + color: var(--color-alert); +} + +.u-whiteTextColor { + color: white; +} + +.u-errorTextColor { + color: var(--color-error); +} + +/* -- DISPLAYS */ + +.u-iBlock { + display: inline-block; + vertical-align: middle; +} + +.u-showDesktop { + display: block !important; +} + +.u-showMobile { + display: none !important; +} + +/* -- DECORATION */ + .u-ellipsis { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } -// Colors -// Main Text Color is default color -// ---------------------------------------------- - -.u-actionTextColor { - color: $cBlue; - - &:hover { - color: $cBlueHover; - } -} -.u-mainTextColor { - color: $cMainText; -} -.u-secondaryTextColor { - color: $cSecondaryText; -} -.u-altTextColor { - color: $cAltText; -} -.u-hintTextColor { - color: $cHintText; -} -.u-alertTextColor { - color: $cAlert; -} -.u-whiteTextColor { - color: $cWhite; -} -.u-errorTextColor { - color: $cError; -} - -/* Displays */ -.u-iBlock { - @include inline-block(); -} -.u-showDesktop { - display: block !important; -} -.u-showMobile { - display: none !important; -} - -/* Decoration */ .u-upperCase { text-transform: uppercase; } -/* Flex */ +/* -- FLEX */ + .u-flex { - @include display-flex(); + display: flex; } + .u-justifySpace { - @include justify-content(space-between); + justify-content: space-between; } + .u-justifyCenter { - @include justify-content(center); + justify-content: center; } + .u-justifyStart { - @include justify-content(flex-start); + justify-content: flex-start; } + .u-justifyEnd { - @include justify-content(flex-end); + justify-content: flex-end; } + .u-alignStart { - @include align-items(flex-start); + align-items: flex-start; } + .u-alignCenter { - @include align-items(center); + align-items: center; } + .u-alignEnd { - @include align-items(flex-end); + align-items: flex-end; } @@ -136,7 +175,7 @@ /* helper mixins */ @mixin default-form-error-style() { - border: 1px solid rgba($cError, 0.48); - background: rgba($cError, 0.04); - color: $cError; + border: 1px solid rgba(var(--color-error), 0.48); + background: rgba(var(--color-error), 0.04); + color: var(--color-error); } diff --git a/src/variables/_colors.scss b/src/variables/_colors.scss deleted file mode 100644 index 22b38fa..0000000 --- a/src/variables/_colors.scss +++ /dev/null @@ -1,36 +0,0 @@ -// -- General -$cBlue: #1785FB; -$cBlack: #000; -$cWhite: #FFF; -$cMainBg: #2E3C43; - -// -- Structure -$cSecondaryDark: #282C2F; -$cSecondaryBackground: #F2F6F9; -$cThirdBackground: #F9F9F9; - -// -- Lines -$cHoverLine: #AAA; -$cMainLine: #DDD; -$cSecondaryLine: rgba($cMainBg, 0.08); - -// -- Borders -$cBlackHover: #2E3C43; -$cBlueHover: #0F6CD2; - -// -- Typography -$cMainText: #2E3C43; -$cSecondaryText: #636D72; -$cAltText: #979EA1; -$cHintText: #CBCED0; -$cHintTextHover: #9C9FA1; - -// -- Others -$cHighlight: #9DE0AD; -$cHighlightHover: #82BB90; -$cAlert: #F19243; -$cPublic: #9BC63B; -$cLink: #FEB100; -$cPassword: #FB7B23; -$cError: #F15743; -$cHighlightYellow: #FFFFC0; diff --git a/src/variables/colors.css b/src/variables/colors.css new file mode 100644 index 0000000..bd4c00f --- /dev/null +++ b/src/variables/colors.css @@ -0,0 +1,23 @@ +:root { + --color-blue: #1785FB; + --color-blue-hover: color(var(--color-blue) l(-10%) s(-10%)); + --color-softgray: #F9F9F9; + + --color-highlight: #9DE0AD; + --color-alert: #FFFFC0; + --color-public: #9BC63B; + --color-share: #FEB100; + --color-password: #FB7B23; + --color-error: #F15743; + + --color-text-primary: #2E3C43; + --color-text-secondary: #747D82; + --color-text-alt: #BABEC0; + --color-text-alt-hover: color(var(--color-text-alt) l(-10%) s(-10%)); + + --color-bg-primary: #FFF; + --color-bg-secondary: #F2F6F9; + + --color-line: #DDD; + --color-line-hover: color(var(--color-line) l(-10%) s(-10%)); +} diff --git a/src/variables/sizes.css b/src/variables/sizes.css index ebb911a..3115884 100644 --- a/src/variables/sizes.css +++ b/src/variables/sizes.css @@ -1,31 +1,23 @@ -// Sizes variables -// ---------------------------------------------- +:root { + --layout-desktop: 352px; + --layout-mobile: 280px; -// Widths -$desktopLayout: 352px; -$mobileLayout: 280px; + --unit: 8px; -//Base -$baseSize: 8px; -$halfBaseSize: $baseSize / 2; + --margin-section: 24px; + --margin-element: 14px; -// Margins -$sMargin-section: 24px; // To separate main section -$sMargin-element: 14px; // To separate elements inside a group + --font-size-small: 10px; + --font-size-medium: 12px; + --font-size-large: 16px; + --font-size-huge: 26px; -// Font sizes -$sFontSize-small: 10px; -$sFontSize-medium: 12px; -$sFontSize-large: 16px; -$sFontSize-huge: 26px; + --font-weight-lighter: 300; + --font-weight-normal: 400; + --font-weight-semibold: 600; -// Font weights -$sFontWeight-lighter: 300; -$sFontWeight-normal: 400; -$sFontWeight-semibold: 600; - -// Line heights -$sLineHeight-small: 14px; -$sLineHeight-medium: 16px; -$sLineHeight-large: 22px; -$sLineHeight-huge: 34px; + --line-height-small: 14px; + --line-height-medium: 16px; + --line-height-large: 22px; + --line-height-huge: 34px; +} diff --git a/src/vendor/_normalize.scss b/src/vendor/_normalize.css similarity index 100% rename from src/vendor/_normalize.scss rename to src/vendor/_normalize.css diff --git a/src/vendor/_reset.scss b/src/vendor/_reset.css similarity index 100% rename from src/vendor/_reset.scss rename to src/vendor/_reset.css diff --git a/src/vendor/perfect-scrollbar/_main.scss b/src/vendor/perfect-scrollbar/_main.css similarity index 100% rename from src/vendor/perfect-scrollbar/_main.scss rename to src/vendor/perfect-scrollbar/_main.css diff --git a/src/vendor/perfect-scrollbar/_mixins.scss b/src/vendor/perfect-scrollbar/_mixins.css similarity index 100% rename from src/vendor/perfect-scrollbar/_mixins.scss rename to src/vendor/perfect-scrollbar/_mixins.css diff --git a/src/vendor/perfect-scrollbar/_themes.scss b/src/vendor/perfect-scrollbar/_themes.css similarity index 100% rename from src/vendor/perfect-scrollbar/_themes.scss rename to src/vendor/perfect-scrollbar/_themes.css diff --git a/src/vendor/perfect-scrollbar/_variables.scss b/src/vendor/perfect-scrollbar/_variables.css similarity index 100% rename from src/vendor/perfect-scrollbar/_variables.scss rename to src/vendor/perfect-scrollbar/_variables.css diff --git a/yarn.lock b/yarn.lock index 8231a53..cf7c785 100644 --- a/yarn.lock +++ b/yarn.lock @@ -13,6 +13,10 @@ ajv@^4.9.1: co "^4.6.0" json-stable-stringify "^1.0.1" +alphanum-sort@^1.0.1, alphanum-sort@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/alphanum-sort/-/alphanum-sort-1.0.2.tgz#97a1119649b211ad33691d9f9f486a8ec9fbe0a3" + ansi-regex@^2.0.0: version "2.1.1" resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df" @@ -49,6 +53,12 @@ are-we-there-yet@~1.1.2: delegates "^1.0.0" readable-stream "^2.0.6" +argparse@^1.0.7: + version "1.0.9" + resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.9.tgz#73d83bc263f86e97f8cc4f6bae1b0e90a7d22c86" + dependencies: + sprintf-js "~1.0.2" + arr-diff@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf" @@ -97,7 +107,7 @@ asynckit@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" -autoprefixer@^6.0.2: +autoprefixer@^6.0.2, autoprefixer@^6.3.1: version "6.7.7" resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.7.tgz#1dbd1c835658e35ce3f9984099db00585c782014" dependencies: @@ -169,7 +179,7 @@ braces@^1.8.2: preserve "^0.2.0" repeat-element "^1.1.2" -browserslist@^1.0.0, browserslist@^1.3.6, browserslist@^1.7.6: +browserslist@^1.0.0, browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6: version "1.7.7" resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-1.7.7.tgz#0bd76704258be829b2398bb50e4b62d1a166b0b9" dependencies: @@ -184,7 +194,7 @@ camelcase@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a" -caniuse-api@^1.5.3: +caniuse-api@^1.5.2, caniuse-api@^1.5.3: version "1.6.1" resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-1.6.1.tgz#b534e7c734c4f81ec5fbe8aca2ad24354b962c6c" dependencies: @@ -234,6 +244,12 @@ chokidar@^1.5.1: optionalDependencies: fsevents "^1.0.0" +clap@^1.0.9: + version "1.2.3" + resolved "https://registry.yarnpkg.com/clap/-/clap-1.2.3.tgz#4f36745b32008492557f46412d66d50cb99bce51" + dependencies: + chalk "^1.1.3" + cliui@^3.2.0: version "3.2.0" resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d" @@ -250,6 +266,12 @@ co@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/co/-/co-4.6.0.tgz#6ea6bdf3d853ae54ccb8e47bfa0bf3f9031fb184" +coa@~1.0.1: + version "1.0.4" + resolved "https://registry.yarnpkg.com/coa/-/coa-1.0.4.tgz#a9ef153660d6a86a8bdec0289a5c684d217432fd" + dependencies: + q "^1.1.2" + code-point-at@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77" @@ -289,6 +311,18 @@ color@^0.11.0, color@^0.11.3, color@^0.11.4: color-convert "^1.3.0" color-string "^0.3.0" +colormin@^1.0.5: + version "1.1.2" + resolved "https://registry.yarnpkg.com/colormin/-/colormin-1.1.2.tgz#ea2f7420a72b96881a38aae59ec124a6f7298133" + dependencies: + color "^0.11.0" + css-color-names "0.0.4" + has "^1.0.1" + +colors@~1.1.2: + version "1.1.2" + resolved "https://registry.yarnpkg.com/colors/-/colors-1.1.2.tgz#168a4701756b6a7f51a12ce0c97bfa28c084ed63" + combined-stream@^1.0.5, combined-stream@~1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.5.tgz#938370a57b4a51dea2c77c15d5c5fdf895164009" @@ -322,6 +356,54 @@ css-color-function@^1.2.0: debug "^3.1.0" rgb "~0.1.0" +css-color-names@0.0.4: + version "0.0.4" + resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0" + +cssnano@^3.10.0: + version "3.10.0" + resolved "https://registry.yarnpkg.com/cssnano/-/cssnano-3.10.0.tgz#4f38f6cea2b9b17fa01490f23f1dc68ea65c1c38" + dependencies: + autoprefixer "^6.3.1" + decamelize "^1.1.2" + defined "^1.0.0" + has "^1.0.1" + object-assign "^4.0.1" + postcss "^5.0.14" + postcss-calc "^5.2.0" + postcss-colormin "^2.1.8" + postcss-convert-values "^2.3.4" + postcss-discard-comments "^2.0.4" + postcss-discard-duplicates "^2.0.1" + postcss-discard-empty "^2.0.1" + postcss-discard-overridden "^0.1.1" + postcss-discard-unused "^2.2.1" + postcss-filter-plugins "^2.0.0" + postcss-merge-idents "^2.1.5" + postcss-merge-longhand "^2.0.1" + postcss-merge-rules "^2.0.3" + postcss-minify-font-values "^1.0.2" + postcss-minify-gradients "^1.0.1" + postcss-minify-params "^1.0.4" + postcss-minify-selectors "^2.0.4" + postcss-normalize-charset "^1.1.0" + postcss-normalize-url "^3.0.7" + postcss-ordered-values "^2.1.0" + postcss-reduce-idents "^2.2.2" + postcss-reduce-initial "^1.0.0" + postcss-reduce-transforms "^1.0.3" + postcss-svgo "^2.1.1" + postcss-unique-selectors "^2.0.2" + postcss-value-parser "^3.2.3" + postcss-zindex "^2.0.1" + +csso@~2.3.1: + version "2.3.2" + resolved "https://registry.yarnpkg.com/csso/-/csso-2.3.2.tgz#ddd52c587033f49e94b71fc55569f252e8ff5f85" + dependencies: + clap "^1.0.9" + source-map "^0.5.3" + dashdash@^1.12.0: version "1.14.1" resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0" @@ -340,7 +422,7 @@ debug@^3.1.0: dependencies: ms "2.0.0" -decamelize@^1.1.1: +decamelize@^1.1.1, decamelize@^1.1.2: version "1.2.0" resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290" @@ -348,6 +430,10 @@ deep-extend@~0.4.0: version "0.4.2" resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.4.2.tgz#48b699c27e334bf89f10892be432f6e4c7d34a7f" +defined@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693" + delayed-stream@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" @@ -386,6 +472,10 @@ escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4" +esprima@^2.6.0: + version "2.7.3" + resolved "https://registry.yarnpkg.com/esprima/-/esprima-2.7.3.tgz#96e3b70d5779f6ad49cd032673d1c312767ba581" + expand-brackets@^0.1.4: version "0.1.5" resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-0.1.5.tgz#df07284e342a807cd733ac5af72411e581d1177b" @@ -491,6 +581,10 @@ fstream@^1.0.0, fstream@^1.0.10, fstream@^1.0.2: mkdirp ">=0.5 0" rimraf "2" +function-bind@^1.0.2: + version "1.1.1" + resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d" + gather-stream@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/gather-stream/-/gather-stream-1.0.0.tgz#b33994af457a8115700d410f317733cbe7a0904b" @@ -596,6 +690,12 @@ has-unicode@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9" +has@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/has/-/has-1.0.1.tgz#8461733f538b0837c9361e39a9ab9e9704dc2f28" + dependencies: + function-bind "^1.0.2" + hawk@3.1.3, hawk@~3.1.3: version "3.1.3" resolved "https://registry.yarnpkg.com/hawk/-/hawk-3.1.3.tgz#078444bd7c1640b0fe540d2c9b73d59678e8e1c4" @@ -613,6 +713,10 @@ hosted-git-info@^2.1.4: version "2.5.0" resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.5.0.tgz#6d60e34b3abbc8313062c3b798ef8d901a07af3c" +html-comment-regex@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/html-comment-regex/-/html-comment-regex-1.1.1.tgz#668b93776eaae55ebde8f3ad464b307a4963625e" + http-signature@~1.1.0: version "1.1.1" resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.1.1.tgz#df72e267066cd0ac67fb76adf8e134a8fbcf91bf" @@ -644,6 +748,10 @@ invert-kv@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-1.0.0.tgz#104a8e4aaca6d3d8cd157a8ef8bfab2d7a3ffdb6" +is-absolute-url@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/is-absolute-url/-/is-absolute-url-2.1.0.tgz#50530dfb84fcc9aa7dbe7852e83a37b93b9f2aa6" + is-arrayish@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" @@ -706,6 +814,10 @@ is-number@^3.0.0: dependencies: kind-of "^3.0.2" +is-plain-obj@^1.0.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e" + is-posix-bracket@^0.1.0: version "0.1.1" resolved "https://registry.yarnpkg.com/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4" @@ -714,6 +826,12 @@ is-primitive@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/is-primitive/-/is-primitive-2.0.0.tgz#207bab91638499c07b2adf240a41a87210034575" +is-svg@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/is-svg/-/is-svg-2.1.0.tgz#cf61090da0d9efbcab8722deba6f032208dbb0e9" + dependencies: + html-comment-regex "^1.1.0" + is-typedarray@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a" @@ -744,6 +862,13 @@ js-base64@^2.1.9: version "2.4.0" resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.4.0.tgz#9e566fee624751a1d720c966cd6226d29d4025aa" +js-yaml@~3.7.0: + version "3.7.0" + resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.7.0.tgz#5c967ddd837a9bfdca5f2de84253abe8a1c03b80" + dependencies: + argparse "^1.0.7" + esprima "^2.6.0" + jsbn@~0.1.0: version "0.1.1" resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513" @@ -842,6 +967,10 @@ log-symbols@^1.0.2: dependencies: chalk "^1.0.0" +macaddress@^0.2.8: + version "0.2.8" + resolved "https://registry.yarnpkg.com/macaddress/-/macaddress-0.2.8.tgz#5904dc537c39ec6dbefeae902327135fa8511f12" + math-expression-evaluator@^1.2.14: version "1.2.17" resolved "https://registry.yarnpkg.com/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz#de819fdbcd84dccd8fae59c6aeb79615b9d266ac" @@ -888,7 +1017,7 @@ minimist@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284" -"mkdirp@>=0.5 0", mkdirp@^0.5.1: +"mkdirp@>=0.5 0", mkdirp@^0.5.1, mkdirp@~0.5.1: version "0.5.1" resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903" dependencies: @@ -948,6 +1077,15 @@ normalize-range@^0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942" +normalize-url@^1.4.0: + version "1.9.1" + resolved "https://registry.yarnpkg.com/normalize-url/-/normalize-url-1.9.1.tgz#2cc0d66b31ea23036458436e3620d85954c66c3c" + dependencies: + object-assign "^4.0.1" + prepend-http "^1.0.0" + query-string "^4.1.0" + sort-keys "^1.0.0" + npmlog@^4.0.2: version "4.1.2" resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.1.2.tgz#08a7f2a8bf734604779a9efa4ad5cc717abb954b" @@ -1105,7 +1243,7 @@ postcss-browser-reporter@^0.5.0: dependencies: postcss "^5.0.4" -postcss-calc@^5.0.0: +postcss-calc@^5.0.0, postcss-calc@^5.2.0: version "5.3.1" resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-5.3.1.tgz#77bae7ca928ad85716e2fda42f261bf7c1d65b5e" dependencies: @@ -1192,6 +1330,21 @@ postcss-color-rgba-fallback@^2.0.0: postcss-value-parser "^3.0.2" rgb-hex "^1.0.0" +postcss-colormin@^2.1.8: + version "2.2.2" + resolved "https://registry.yarnpkg.com/postcss-colormin/-/postcss-colormin-2.2.2.tgz#6631417d5f0e909a3d7ec26b24c8a8d1e4f96e4b" + dependencies: + colormin "^1.0.5" + postcss "^5.0.13" + postcss-value-parser "^3.2.3" + +postcss-convert-values@^2.3.4: + version "2.6.1" + resolved "https://registry.yarnpkg.com/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz#bbd8593c5c1fd2e3d1c322bb925dcae8dae4d62d" + dependencies: + postcss "^5.0.11" + postcss-value-parser "^3.1.2" + postcss-cssnext@^2.9.0: version "2.11.0" resolved "https://registry.yarnpkg.com/postcss-cssnext/-/postcss-cssnext-2.11.0.tgz#31e68f001e409604da703b66de14b8b8c8c9f2b1" @@ -1249,6 +1402,44 @@ postcss-custom-selectors@^3.0.0: postcss "^5.0.0" postcss-selector-matches "^2.0.0" +postcss-discard-comments@^2.0.4: + version "2.0.4" + resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz#befe89fafd5b3dace5ccce51b76b81514be00e3d" + dependencies: + postcss "^5.0.14" + +postcss-discard-duplicates@^2.0.1: + version "2.1.0" + resolved "https://registry.yarnpkg.com/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz#b9abf27b88ac188158a5eb12abcae20263b91932" + dependencies: + postcss "^5.0.4" + +postcss-discard-empty@^2.0.1: + version "2.1.0" + resolved "https://registry.yarnpkg.com/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz#d2b4bd9d5ced5ebd8dcade7640c7d7cd7f4f92b5" + dependencies: + postcss "^5.0.14" + +postcss-discard-overridden@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz#8b1eaf554f686fb288cd874c55667b0aa3668d58" + dependencies: + postcss "^5.0.16" + +postcss-discard-unused@^2.2.1: + version "2.2.3" + resolved "https://registry.yarnpkg.com/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz#bce30b2cc591ffc634322b5fb3464b6d934f4433" + dependencies: + postcss "^5.0.14" + uniqs "^2.0.0" + +postcss-filter-plugins@^2.0.0: + version "2.0.2" + resolved "https://registry.yarnpkg.com/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz#6d85862534d735ac420e4a85806e1f5d4286d84c" + dependencies: + postcss "^5.0.4" + uniqid "^4.0.0" + postcss-font-family-system-ui@^1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/postcss-font-family-system-ui/-/postcss-font-family-system-ui-1.0.2.tgz#3e1a5e3fb7e31e5e9e71439ccb0e8014556927c7" @@ -1298,16 +1489,95 @@ postcss-media-query-parser@^0.2.3: version "0.2.3" resolved "https://registry.yarnpkg.com/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz#27b39c6f4d94f81b1a73b8f76351c609e5cef244" +postcss-merge-idents@^2.1.5: + version "2.1.7" + resolved "https://registry.yarnpkg.com/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz#4c5530313c08e1d5b3bbf3d2bbc747e278eea270" + dependencies: + has "^1.0.1" + postcss "^5.0.10" + postcss-value-parser "^3.1.1" + +postcss-merge-longhand@^2.0.1: + version "2.0.2" + resolved "https://registry.yarnpkg.com/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz#23d90cd127b0a77994915332739034a1a4f3d658" + dependencies: + postcss "^5.0.4" + +postcss-merge-rules@^2.0.3: + version "2.1.2" + resolved "https://registry.yarnpkg.com/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz#d1df5dfaa7b1acc3be553f0e9e10e87c61b5f721" + dependencies: + browserslist "^1.5.2" + caniuse-api "^1.5.2" + postcss "^5.0.4" + postcss-selector-parser "^2.2.2" + vendors "^1.0.0" + postcss-message-helpers@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz#a4f2f4fab6e4fe002f0aed000478cdf52f9ba60e" +postcss-minify-font-values@^1.0.2: + version "1.0.5" + resolved "https://registry.yarnpkg.com/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz#4b58edb56641eba7c8474ab3526cafd7bbdecb69" + dependencies: + object-assign "^4.0.1" + postcss "^5.0.4" + postcss-value-parser "^3.0.2" + +postcss-minify-gradients@^1.0.1: + version "1.0.5" + resolved "https://registry.yarnpkg.com/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz#5dbda11373703f83cfb4a3ea3881d8d75ff5e6e1" + dependencies: + postcss "^5.0.12" + postcss-value-parser "^3.3.0" + +postcss-minify-params@^1.0.4: + version "1.2.2" + resolved "https://registry.yarnpkg.com/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz#ad2ce071373b943b3d930a3fa59a358c28d6f1f3" + dependencies: + alphanum-sort "^1.0.1" + postcss "^5.0.2" + postcss-value-parser "^3.0.2" + uniqs "^2.0.0" + +postcss-minify-selectors@^2.0.4: + version "2.1.1" + resolved "https://registry.yarnpkg.com/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz#b2c6a98c0072cf91b932d1a496508114311735bf" + dependencies: + alphanum-sort "^1.0.2" + has "^1.0.1" + postcss "^5.0.14" + postcss-selector-parser "^2.0.0" + postcss-nesting@^2.0.5: version "2.3.1" resolved "https://registry.yarnpkg.com/postcss-nesting/-/postcss-nesting-2.3.1.tgz#94a6b6a4ef707fbec20a87fee5c957759b4e01cf" dependencies: postcss "^5.0.19" +postcss-normalize-charset@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz#ef9ee71212d7fe759c78ed162f61ed62b5cb93f1" + dependencies: + postcss "^5.0.5" + +postcss-normalize-url@^3.0.7: + version "3.0.8" + resolved "https://registry.yarnpkg.com/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz#108f74b3f2fcdaf891a2ffa3ea4592279fc78222" + dependencies: + is-absolute-url "^2.0.0" + normalize-url "^1.4.0" + postcss "^5.0.14" + postcss-value-parser "^3.2.3" + +postcss-ordered-values@^2.1.0: + version "2.2.3" + resolved "https://registry.yarnpkg.com/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz#eec6c2a67b6c412a8db2042e77fe8da43f95c11d" + dependencies: + postcss "^5.0.4" + postcss-value-parser "^3.0.1" + postcss-pseudo-class-any-link@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/postcss-pseudo-class-any-link/-/postcss-pseudo-class-any-link-1.0.0.tgz#903239196401d335fe73ac756186fa62e693af26" @@ -1321,6 +1591,27 @@ postcss-pseudoelements@^3.0.0: dependencies: postcss "^5.0.4" +postcss-reduce-idents@^2.2.2: + version "2.4.0" + resolved "https://registry.yarnpkg.com/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz#c2c6d20cc958284f6abfbe63f7609bf409059ad3" + dependencies: + postcss "^5.0.4" + postcss-value-parser "^3.0.2" + +postcss-reduce-initial@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz#68f80695f045d08263a879ad240df8dd64f644ea" + dependencies: + postcss "^5.0.4" + +postcss-reduce-transforms@^1.0.3: + version "1.0.4" + resolved "https://registry.yarnpkg.com/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz#ff76f4d8212437b31c298a42d2e1444025771ae1" + dependencies: + has "^1.0.1" + postcss "^5.0.8" + postcss-value-parser "^3.0.1" + postcss-replace-overflow-wrap@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/postcss-replace-overflow-wrap/-/postcss-replace-overflow-wrap-1.0.0.tgz#f0a03b31eab9636a6936bfd210e2aef1b434a643" @@ -1358,7 +1649,7 @@ postcss-selector-parser@^1.1.4: indexes-of "^1.0.1" uniq "^1.0.1" -postcss-selector-parser@^2.2.0: +postcss-selector-parser@^2.0.0, postcss-selector-parser@^2.2.0, postcss-selector-parser@^2.2.2: version "2.2.3" resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz#f9437788606c3c9acee16ffe8d8b16297f27bb90" dependencies: @@ -1366,11 +1657,36 @@ postcss-selector-parser@^2.2.0: indexes-of "^1.0.1" uniq "^1.0.1" -postcss-value-parser@^3.0.2, postcss-value-parser@^3.2.3, postcss-value-parser@^3.3.0: +postcss-svgo@^2.1.1: + version "2.1.6" + resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-2.1.6.tgz#b6df18aa613b666e133f08adb5219c2684ac108d" + dependencies: + is-svg "^2.0.0" + postcss "^5.0.14" + postcss-value-parser "^3.2.3" + svgo "^0.7.0" + +postcss-unique-selectors@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz#981d57d29ddcb33e7b1dfe1fd43b8649f933ca1d" + dependencies: + alphanum-sort "^1.0.1" + postcss "^5.0.4" + uniqs "^2.0.0" + +postcss-value-parser@^3.0.1, postcss-value-parser@^3.0.2, postcss-value-parser@^3.1.1, postcss-value-parser@^3.1.2, postcss-value-parser@^3.2.3, postcss-value-parser@^3.3.0: version "3.3.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz#87f38f9f18f774a4ab4c8a232f5c5ce8872a9d15" -postcss@^5.0.0, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.19, postcss@^5.0.2, postcss@^5.0.21, postcss@^5.0.3, postcss@^5.0.4, postcss@^5.1.1, postcss@^5.2.0, postcss@^5.2.12, postcss@^5.2.16, postcss@^5.2.8: +postcss-zindex@^2.0.1: + version "2.2.0" + resolved "https://registry.yarnpkg.com/postcss-zindex/-/postcss-zindex-2.2.0.tgz#d2109ddc055b91af67fc4cb3b025946639d2af22" + dependencies: + has "^1.0.1" + postcss "^5.0.4" + uniqs "^2.0.0" + +postcss@^5.0.0, postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0.14, postcss@^5.0.16, postcss@^5.0.19, postcss@^5.0.2, postcss@^5.0.21, postcss@^5.0.3, postcss@^5.0.4, postcss@^5.0.5, postcss@^5.0.8, postcss@^5.1.1, postcss@^5.2.0, postcss@^5.2.12, postcss@^5.2.16, postcss@^5.2.8: version "5.2.18" resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.18.tgz#badfa1497d46244f6390f58b319830d9107853c5" dependencies: @@ -1387,6 +1703,10 @@ postcss@^6.0.1: source-map "^0.6.1" supports-color "^4.4.0" +prepend-http@^1.0.0: + version "1.0.4" + resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc" + preserve@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b" @@ -1405,10 +1725,21 @@ punycode@^1.4.1: version "1.4.1" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e" +q@^1.1.2: + version "1.5.1" + resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7" + qs@~6.4.0: version "6.4.0" resolved "https://registry.yarnpkg.com/qs/-/qs-6.4.0.tgz#13e26d28ad6b0ffaa91312cd3bf708ed351e7233" +query-string@^4.1.0: + version "4.3.4" + resolved "https://registry.yarnpkg.com/query-string/-/query-string-4.3.4.tgz#bbb693b9ca915c232515b228b1a02b609043dbeb" + dependencies: + object-assign "^4.1.0" + strict-uri-encode "^1.0.0" + randomatic@^1.1.3: version "1.1.7" resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-1.1.7.tgz#c7abe9cc8b87c0baa876b19fde83fd464797e38c" @@ -1564,6 +1895,10 @@ safe-buffer@^5.0.1, safe-buffer@~5.1.0, safe-buffer@~5.1.1: version "5.1.1" resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.1.tgz#893312af69b2123def71f57889001671eeb2c853" +sax@~1.2.1: + version "1.2.4" + resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9" + "semver@2 || 3 || 4 || 5", semver@^5.3.0: version "5.4.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.4.1.tgz#e059c09d8571f0540823733433505d3a2f00b18e" @@ -1586,7 +1921,13 @@ sntp@1.x.x: dependencies: hoek "2.x.x" -source-map@^0.5.6: +sort-keys@^1.0.0: + version "1.1.2" + resolved "https://registry.yarnpkg.com/sort-keys/-/sort-keys-1.1.2.tgz#441b6d4d346798f1b4e49e8920adfba0e543f9ad" + dependencies: + is-plain-obj "^1.0.0" + +source-map@^0.5.3, source-map@^0.5.6: version "0.5.7" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" @@ -1608,6 +1949,10 @@ spdx-license-ids@^1.0.2: version "1.2.2" resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz#c9df7a3424594ade6bd11900d596696dc06bac57" +sprintf-js@~1.0.2: + version "1.0.3" + resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" + sshpk@^1.7.0: version "1.13.1" resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.13.1.tgz#512df6da6287144316dc4c18fe1cf1d940739be3" @@ -1622,6 +1967,10 @@ sshpk@^1.7.0: jsbn "~0.1.0" tweetnacl "~0.14.0" +strict-uri-encode@^1.0.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz#279b225df1d582b1f54e65addd4352e18faa0713" + string-width@^1.0.1, string-width@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3" @@ -1672,6 +2021,18 @@ supports-color@^4.0.0, supports-color@^4.4.0: dependencies: has-flag "^2.0.0" +svgo@^0.7.0: + version "0.7.2" + resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.2.tgz#9f5772413952135c6fefbf40afe6a4faa88b4bb5" + dependencies: + coa "~1.0.1" + colors "~1.1.2" + csso "~2.3.1" + js-yaml "~3.7.0" + mkdirp "~0.5.1" + sax "~1.2.1" + whet.extend "~0.9.9" + tar-pack@^3.4.0: version "3.4.1" resolved "https://registry.yarnpkg.com/tar-pack/-/tar-pack-3.4.1.tgz#e1dbc03a9b9d3ba07e896ad027317eb679a10a1f" @@ -1717,6 +2078,16 @@ uniq@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/uniq/-/uniq-1.0.1.tgz#b31c5ae8254844a3a8281541ce2b04b865a734ff" +uniqid@^4.0.0: + version "4.1.1" + resolved "https://registry.yarnpkg.com/uniqid/-/uniqid-4.1.1.tgz#89220ddf6b751ae52b5f72484863528596bb84c1" + dependencies: + macaddress "^0.2.8" + +uniqs@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/uniqs/-/uniqs-2.0.0.tgz#ffede4b36b25290696e6e165d4a59edb998e6b02" + units-css@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/units-css/-/units-css-0.4.0.tgz#d6228653a51983d7c16ff28f8b9dc3b1ffed3a07" @@ -1739,6 +2110,10 @@ validate-npm-package-license@^3.0.1: spdx-correct "~1.0.0" spdx-expression-parse "~1.0.0" +vendors@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.1.tgz#37ad73c8ee417fb3d580e785312307d274847f22" + verror@1.10.0: version "1.10.0" resolved "https://registry.yarnpkg.com/verror/-/verror-1.10.0.tgz#3a105ca17053af55d6e270c1f8288682e18da400" @@ -1751,6 +2126,10 @@ viewport-dimensions@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/viewport-dimensions/-/viewport-dimensions-0.2.0.tgz#de740747db5387fd1725f5175e91bac76afdf36c" +whet.extend@~0.9.9: + version "0.9.9" + resolved "https://registry.yarnpkg.com/whet.extend/-/whet.extend-0.9.9.tgz#f877d5bf648c97e5aa542fadc16d6a259b9c11a1" + which-module@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"