diff --git a/opentech/static_src/src/app/src/components/Switcher/index.js b/opentech/static_src/src/app/src/components/Switcher/index.js index 1ece00ecff1271d821fc3c67ce0763190cfd4e5a..e818111a3107dd285635d34025d92fadd3a9eb8d 100644 --- a/opentech/static_src/src/app/src/components/Switcher/index.js +++ b/opentech/static_src/src/app/src/components/Switcher/index.js @@ -3,6 +3,8 @@ import ReactDOM from 'react-dom'; import ArrayIcon from 'images/icon-array.svg' import GridIcon from 'images/icon-grid.svg'; +import './styles.scss'; + class Switcher extends React.Component { constructor(props) { super(props); diff --git a/opentech/static_src/src/app/src/components/Switcher/styles.scss b/opentech/static_src/src/app/src/components/Switcher/styles.scss new file mode 100644 index 0000000000000000000000000000000000000000..8a86bd0441dc50bffb44b26c325145bfdc90dbd4 --- /dev/null +++ b/opentech/static_src/src/app/src/components/Switcher/styles.scss @@ -0,0 +1,24 @@ +.button { + &--switcher { + fill: transparentize($color--white, .5); + transition: fill $transition; + + &:hover, + &:focus { + fill: transparentize($color--white, .25); + } + + &:first-child { + margin-right: 10px; + } + + &.is-active { + fill: $color--white; + } + + svg { + width: 45px; + height: 45px; + } + } +} diff --git a/opentech/static_src/src/sass/apply/components/_button.scss b/opentech/static_src/src/sass/apply/components/_button.scss index a099b58f03e55468f0addd93f0ef90cc44199783..32efcfb5da86bc49602c897f429e5cad93fc46ab 100644 --- a/opentech/static_src/src/sass/apply/components/_button.scss +++ b/opentech/static_src/src/sass/apply/components/_button.scss @@ -208,27 +208,4 @@ fill: $color--white; } } - - &--switcher { - fill: transparentize($color--white, .5); - transition: fill $transition; - - &:hover, - &:focus { - fill: transparentize($color--white, .25); - } - - &:first-child { - margin-right: 10px; - } - - &.is-active { - fill: $color--white; - } - - svg { - width: 45px; - height: 45px; - } - } }