diff --git a/.babelrc b/.babelrc index 659fd54..79e96a1 100644 --- a/.babelrc +++ b/.babelrc @@ -6,5 +6,15 @@ ], "plugins": [ "add-module-exports" - ] + ], + "env": { + "test": { + "plugins": [ + [ "babel-plugin-webpack-alias", { + "config": "webpack.config.js", + "findConfig": true + } ] + ] + } + } } diff --git a/client/components/payment/credit-card-selector.jsx b/client/components/payment/credit-card-selector.jsx index 43d7843..2510daa 100644 --- a/client/components/payment/credit-card-selector.jsx +++ b/client/components/payment/credit-card-selector.jsx @@ -1,5 +1,3 @@ -require( './credit-card-selector.scss' ); - /** * External dependencies */ @@ -16,6 +14,8 @@ var StoredCard = require( './stored-card' ), ScreenReaderText = require( '../screen-reader-text' ); // upgradesActions = require( 'lib/upgrades/actions' ); +require( './credit-card-selector.scss' ); + var CreditCardSelector = React.createClass( { propTypes: { onSelectPayment: React.PropTypes.func.isRequired, diff --git a/client/demo.js b/client/demo.js index 824650b..b427bc0 100644 --- a/client/demo.js +++ b/client/demo.js @@ -1,4 +1,4 @@ -require( 'babel/polyfill' ); +require( 'babel-polyfill' ); var Demo, Tabs = require( './components/tabs' ), Sidebar = require( './components/sidebar' ), diff --git a/client/lib/credit-card-details/validation.js b/client/lib/credit-card-details/validation.js index 653e5b2..09e666b 100644 --- a/client/lib/credit-card-details/validation.js +++ b/client/lib/credit-card-details/validation.js @@ -6,7 +6,7 @@ var creditcards = require( 'creditcards' ), isArray = require( 'lodash/isArray' ), isEmpty = require( 'lodash/isEmpty' ), toArray = require( 'lodash/toArray' ), - inRange = require( 'lodash/number/inRange' ), + inRange = require( 'lodash/inRange' ), capitalize = require( 'lodash/capitalize' ); /** diff --git a/client/load-script/README.md b/client/lib/load-script/README.md similarity index 92% rename from client/load-script/README.md rename to client/lib/load-script/README.md index 0110ea4..3d59ce0 100644 --- a/client/load-script/README.md +++ b/client/lib/load-script/README.md @@ -5,7 +5,7 @@ This utility function allows us to use a standardized method of loading remote s ### Usage ```js -loadScript = require( 'load-script' ); +loadScript = require( '@automattic/dops-components/client/lib/load-script' ); loadScript.loadScript( REMOTE_SCRIPT_URL, function( error ) { if ( error ) { debug( 'Script ' + error.src + ' failed to load.' ); diff --git a/client/load-script/index.js b/client/lib/load-script/index.js similarity index 100% rename from client/load-script/index.js rename to client/lib/load-script/index.js diff --git a/client/lib/paygate-loader/index.js b/client/lib/paygate-loader/index.js index f6f1411..162f1b6 100644 --- a/client/lib/paygate-loader/index.js +++ b/client/lib/paygate-loader/index.js @@ -6,7 +6,7 @@ var debug = require( 'debug' )( 'calypso:paygate' ); /** * Internal dependencies */ -var loadScript = require( 'load-script' ), +var loadScript = require( '../load-script' ), config = require( 'config' ); var PAYGATE_URL = 'https://pay-js.automattic.com/v1/paygate.js'; diff --git a/client/lib/wpcom-undocumented/lib/undocumented.js b/client/lib/wpcom-undocumented/lib/undocumented.js index ca017a9..69c811f 100644 --- a/client/lib/wpcom-undocumented/lib/undocumented.js +++ b/client/lib/wpcom-undocumented/lib/undocumented.js @@ -4,7 +4,7 @@ var debug = require( 'debug' )( 'calypso:wpcom-undocumented:undocumented' ), isPlainObject = require( 'lodash/isPlainObject' ), clone = require( 'lodash/clone' ), - omit = require( 'lodash/object/omit' ), + omit = require( 'lodash/omit' ), camelCase = require( 'lodash/camelCase' ), snakeCase = require( 'lodash/snakeCase' ); diff --git a/dist/demo.css b/dist/demo.css index 3ceaa52..105b827 100644 --- a/dist/demo.css +++ b/dist/demo.css @@ -1 +1 @@ -.dops-tabs-vertical:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-vertical>ul{width:30%;float:left}.dops-tabs-vertical>ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-vertical>ul>li{list-style:none;margin:0}.dops-tabs-vertical>ul>li>button{display:block;border-left:2px solid transparent;color:#999;margin:0 10px 10px 0;padding:4px 6px;text-decoration:none}.dops-tabs-vertical>ul>li button:focus,.dops-tabs-vertical>ul>li button:hover,.dops-tabs-vertical>ul>li.active button{color:#000;background-color:#f9f9f9}.dops-tabs-vertical>ul>li button:focus{box-shadow:0 0 4px rgba(0,0,0,.15)}.dops-tabs-vertical>ul>li.active button{border-color:#000}.dops-tabs-vertical>div{float:right;width:70%}.dops-tabs-horizontal:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-horizontal>ul{border-bottom:1px solid #eee;margin-left:0;margin-top:0;clear:both}.dops-tabs-horizontal>ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-horizontal>ul>li{list-style:none;display:inline-block}.dops-tabs-horizontal>ul>li>button{color:#aaa;display:block;font-size:14px;margin:0;padding:15px 20px;text-align:center;text-transform:uppercase;text-decoration:none}.dops-tabs-horizontal>ul>li button:focus,.dops-tabs-horizontal>ul>li button:hover,.dops-tabs-horizontal>ul>li.active button{color:#000}.dops-tabs-horizontal>ul>li button:focus{box-shadow:0 0 4px rgba(0,0,0,.15)}.dops-tabs-horizontal>ul>li.active{border-bottom:2px solid #000}@media (max-width:480px){.dops-tabs-horizontal>ul{text-align:center}}.site-icon{position:relative;background:#c8d7e1;border:1px solid #fff;overflow:hidden;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;margin:0}.site-icon.is-blank .noticon{color:#fff;text-align:center;z-index:0}.site-icon__img{background:#fff;position:relative}.all-sites-icon{margin-right:9pt;position:relative;left:0;top:0;height:2pc;width:2pc}.all-sites-icon .site-icon.is-blank:before{display:none}.all-sites-icon.is-shape-1:after,.all-sites-icon.is-shape-1:before,.all-sites-icon.is-shape-2:after,.all-sites-icon.is-shape-2:before,.all-sites-icon.is-shape-3:before{background:#2e4453;content:'';display:block;height:9px;width:9px;position:absolute;left:17px;top:17px}.all-sites-icon.is-shape-1:after,.all-sites-icon.is-shape-2:after{position:absolute;left:6px;top:6px}.all-sites-icon .site-icon{-webkit-align-self:auto;-ms-flex-item-align:auto;align-self:auto;background:#87a6bc;border:none;margin-right:0;height:15px;width:15px;position:absolute}.all-sites-icon.is-shape-1 .site-icon{overflow:visible}.all-sites-icon.is-shape-1 .site-icon:after{background:#87a6bc;content:'';display:block;position:absolute;left:-17px;top:17px;height:15px;width:15px}.all-sites-icon.is-shape-1 .site-icon,.all-sites-icon.is-shape-2 .site-icon{left:auto;right:0;top:0}.all-sites-icon.is-shape-1 .site-icon+.site-icon,.all-sites-icon.is-shape-2 .site-icon+.site-icon{left:0;right:auto;bottom:0;top:auto}.all-sites-icon.is-shape-3 .site-icon{left:0;right:auto;top:0}.all-sites-icon.is-shape-3 .site-icon+.site-icon{bottom:0;left:0;right:auto;top:auto}.all-sites-icon.is-shape-3 .site-icon+.site-icon+.site-icon{bottom:auto;left:auto;right:0;top:0}.site{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:0;position:relative}.site.is-private .site__title:before{content:"\F470"}.site.is-private .site__title:before,.site.is-redirect .site__title:before{font-size:1pc;vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;color:#87a6bc;margin:0 3px 2px 0;vertical-align:bottom}.site.is-redirect .site__title:before{content:"\F458"}.site__content{border-radius:2px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:1pc;width:100%}.site .site-icon,.site__content{overflow:hidden;position:relative}.site .site-icon{background:#c8d7e1;border:1px solid #fff;height:30px;width:30px;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;margin-right:9pt}.site__info{width:0;-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto}.site__title{color:#2e4453;display:block;font-weight:400;line-height:1.4}.site__domain{color:#87a6bc;display:block;max-width:95%;font-size:.8em;font-style:italic;line-height:1.4}.site__domain,.site__title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-selector{font-size:13px;position:relative;z-index:20;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-top:0;padding:0;width:100%;box-sizing:border-box}.site-selector.is-large .search{display:block}.site-selector .all-sites .site-icon__img,.site-selector .site .site-icon__img{-webkit-transform:translateZ(0)}.site-selector .all-sites:not(.is-selected) .site-icon__img,.site-selector .site:not(.is-selected) .site-icon__img{filter:url("data:image/svg+xml;utf8,#grayscale");-webkit-filter:grayscale(100%);filter:grayscale(100%);opacity:.7}.site-selector .all-sites.is-selected,.site-selector .site.is-selected{background:#fff}.notouch .site-selector .all-sites:hover,.notouch .site-selector .site:hover{background:#fff;cursor:pointer}.notouch .site-selector .all-sites:hover .site__domain,.notouch .site-selector .all-sites:hover .site__title,.notouch .site-selector .site:hover .site__domain,.notouch .site-selector .site:hover .site__title{color:#00aadc}.notouch .site-selector .all-sites:hover .site-icon__img,.notouch .site-selector .site:hover .site-icon__img{-webkit-filter:none;filter:none;opacity:1}.site-selector .search{border:none;display:none;clear:both;height:auto;position:relative;top:0;width:auto}.site-selector .search .noticon-search{background-color:transparent;border-left:none;color:#87a6bc;padding:0;width:auto;position:absolute;left:9pt;top:8px}.site-selector .search .noticon-search:before{font-size:1pc}.site-selector .search input{background-color:#f3f6f8;border:1px solid #c8d7e1;border-radius:40px;display:block;font-size:9pt;height:auto;line-height:1.5;margin:10px 4px 15px 0;opacity:1;padding:6px 10px 6px 33px;position:static;width:99.5%;-webkit-appearance:none}.site-selector .search input:focus{outline:0;border:1px solid #c8d7e1}.site-selector .search input::-webkit-input-placeholder{color:#87a6bc}.site-selector .search input::-moz-placeholder{color:#87a6bc}.site-selector .search input::-webkit-search-cancel-button{-webkit-appearance:searchfield-cancel-button}.site-selector .search.open{width:100%}.site-selector .search.open .noticon-close-alt{color:#87a6bc;display:none;margin:0;opacity:1;padding:6px 20px}.site-selector .search.open .noticon-close-alt:before{font-size:9pt;margin:0}.site-selector__no-results{color:#87a6bc;font-style:italic;padding:10px 20px}.site-selector__add-new-wordpress{border-top:1px solid #c8d7e1;clear:both;color:#4f748e;display:block;font-size:10px;font-weight:400;padding:15px 0;text-transform:uppercase}.site-selector__add-new-wordpress .noticon{color:inherit;font-size:9pt;margin-left:15px;margin-right:5px;position:static}.site-selector__add-new-wordpress:hover{color:#00aadc}.site-selector .site-action{padding-top:15px}.current-site{margin:0 0 20px;padding:0}.current-site.is-loading .site-icon{-webkit-animation:pulse-light .8s ease-in-out infinite;animation:pulse-light .8s ease-in-out infinite}.current-site.is-loading .site__title{color:#4f748e;line-height:35px}.current-site.is-loading .current-site__switch-sites{cursor:default}.current-site.is-loading .current-site__switch-sites:before{visibility:hidden}.current-site .site{box-shadow:0 1px 0 rgba(46,68,83,.05)}.current-site__add-new-wordpress,.current-site__switch-sites{background-color:#f3f6f8;color:#4f748e;cursor:pointer;font-size:10px;display:block;line-height:1.8;margin-top:1px;padding:8px 0 8px 18px;text-transform:uppercase}.current-site__add-new-wordpress:before,.current-site__switch-sites:before{font-size:18px;content:"\F430";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;margin-right:4px}.current-site__add-new-wordpress:hover,.current-site__switch-sites:hover{background-color:#2e4453;color:#fff}.current-site__add-new-wordpress:before{content:'\F510';font-size:13px;margin-right:4px;margin-top:1px}.rtl .current-site__switch-sites:before{content:'\F429'}.sidebar{font-size:13px;position:relative;margin:0;z-index:10;list-style-type:none}.sidebar .noticon-external{color:#87a6bc;font-size:1pc;-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.sidebar .sidebar-menu{clear:both;margin:0 0 1pc;overflow:hidden;padding:0}@media only screen and (max-width:660px){.sidebar .sidebar-menu{margin-top:0}}.sidebar .sidebar-menu:first-child{margin-top:0}.sidebar .sidebar-menu ul{list-style:none;margin:0}.sidebar .sidebar-menu li{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.sidebar .sidebar-menu a{border-radius:2px;color:#2e4453;border:none;display:block;padding:9pt 1pc;text-decoration:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;box-sizing:border-box}.sidebar .sidebar-menu a:focus{outline:0}.sidebar .sidebar-menu a:first-child{-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;width:0}.sidebar .sidebar-menu a:first-child:before{font-size:1pc;content:"\F475";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;min-width:18px;color:#87a6bc;margin-right:14px}.sidebar .sidebar-menu a .menu-link-text{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;width:0;line-height:1pc}.sidebar .sidebar-menu a.add-new{background-color:#f3f6f8;border-radius:2px;color:#87a6bc;font-size:10px;padding:4px 10px;margin-right:10px;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.sidebar .sidebar-menu a.add-new:before{display:none}.sidebar .sidebar-menu .selected{background-color:#00aadc}.sidebar .sidebar-menu .selected a,.sidebar .sidebar-menu .selected a:first-child:before{color:#fff}.sidebar .sidebar-menu .selected a.add-new{background:#fff;color:#00aadc}.rtl .sidebar>.sidebar-menu .action.new:before{margin:10px -58% 0 0}.sidebar-heading{color:#87a6bc;font-size:11px;display:inline-block;margin-bottom:8px;padding:0 8px 0 0;position:relative;text-transform:uppercase;vertical-align:top}.sidebar-heading:after{border-top:1px solid #c8d7e1;content:'';display:block;position:absolute;left:100%;top:8px;width:15pc;width:100vw}.sites-navigation{position:relative}.sites-navigation .navigation-sidebar,.sites-navigation .sites-list{-webkit-transition:all .15s cubic-bezier(0.77,0,0.175,1),opacity .2s linear;transition:all .15s cubic-bezier(0.77,0,0.175,1),opacity .2s linear;opacity:1;position:absolute;top:1px;left:1px;right:1px;bottom:0}.sites-navigation .sites-list,.sites-navigation.focus-sites .navigation-sidebar{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.sites-navigation .navigation-sidebar,.sites-navigation.focus-sites .sites-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}.dops-col-right{width:50%;float:right}@media all and (max-width:590px){.dops-col-right{width:100%;float:none}}.dops-col-left{width:50%;float:left;padding-right:10px}@media all and (max-width:590px){.dops-col-left{width:100%;float:none;padding-right:0}}body.dops-modal-showing{overflow:hidden;position:fixed}.dops-modal-wrapper{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;display:block;overflow-x:hidden;overflow-y:auto;text-align:center;-webkit-overflow-scrolling:touch;outline:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear;background-color:rgba(0,0,0,.5);cursor:pointer}.dops-modal-wrapper:before{content:'';display:inline-block;height:100%;vertical-align:middle}.dops-modal-wrapper .dops-modal{position:relative;display:inline-block;margin:0;width:100%;max-width:550px;vertical-align:middle;text-align:left;background-color:#fff;-webkit-transition:all .5s;transition:all .5s;z-index:100;clear:both;cursor:default}@media (min-width:481px){.dops-modal-wrapper .dops-modal{margin:0 auto;height:auto;border-radius:5px;box-shadow:0 4px 20px rgba(0,0,0,.2)}}.gridicon{fill:currentColor}.gridicon.needs-offset g{-webkit-transform:translate(1px, 1px);transform:translate(1px, 1px)}.gridicon.needs-offset-x g{-webkit-transform:translate(1px, 0);transform:translate(1px, 0)}.gridicon.needs-offset-y g{-webkit-transform:translate(0, 1px);transform:translate(0, 1px)}._1qeO-zpPfVaJifww0RFQZ5{clip:rect(1px,1px,1px,1px);position:absolute!important;height:1px;width:1px;overflow:hidden}._1qeO-zpPfVaJifww0RFQZ5:focus{background-color:#fff;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;color:#666;display:block;font-size:.875em;font-weight:700;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}form ul{margin:0;padding:0;list-style:none}.checkbox-tristate,.dops-password-box .dops-text-input,input[type=checkbox],input[type=email],input[type=number],input[type=password],input[type=radio],input[type=search],input[type=tel],input[type=text],input[type=url],textarea{margin:0;padding:7px 14px;width:100%;color:#2e4453;font-size:1pc;line-height:1.5;border:1px solid #c8d7e1;background-color:#fff;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;box-sizing:border-box}.checkbox-tristate::-webkit-input-placeholder,.dops-password-box .dops-text-input::-webkit-input-placeholder,input[type=checkbox]::-webkit-input-placeholder,input[type=email]::-webkit-input-placeholder,input[type=number]::-webkit-input-placeholder,input[type=password]::-webkit-input-placeholder,input[type=radio]::-webkit-input-placeholder,input[type=search]::-webkit-input-placeholder,input[type=tel]::-webkit-input-placeholder,input[type=text]::-webkit-input-placeholder,input[type=url]::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#87a6bc}.checkbox-tristate::-moz-placeholder,.dops-password-box .dops-text-input::-moz-placeholder,input[type=checkbox]::-moz-placeholder,input[type=email]::-moz-placeholder,input[type=number]::-moz-placeholder,input[type=password]::-moz-placeholder,input[type=radio]::-moz-placeholder,input[type=search]::-moz-placeholder,input[type=tel]::-moz-placeholder,input[type=text]::-moz-placeholder,input[type=url]::-moz-placeholder,textarea::-moz-placeholder{color:#87a6bc}.checkbox-tristate:-ms-input-placeholder,.dops-password-box .dops-text-input:-ms-input-placeholder,input[type=checkbox]:-ms-input-placeholder,input[type=email]:-ms-input-placeholder,input[type=number]:-ms-input-placeholder,input[type=password]:-ms-input-placeholder,input[type=radio]:-ms-input-placeholder,input[type=search]:-ms-input-placeholder,input[type=tel]:-ms-input-placeholder,input[type=text]:-ms-input-placeholder,input[type=url]:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#87a6bc}.checkbox-tristate::placeholder,.dops-password-box .dops-text-input::placeholder,input[type=checkbox]::placeholder,input[type=email]::placeholder,input[type=number]::placeholder,input[type=password]::placeholder,input[type=radio]::placeholder,input[type=search]::placeholder,input[type=tel]::placeholder,input[type=text]::placeholder,input[type=url]::placeholder,textarea::placeholder{color:#87a6bc}.checkbox-tristate:hover,.dops-password-box .dops-text-input:hover,input[type=checkbox]:hover,input[type=email]:hover,input[type=number]:hover,input[type=password]:hover,input[type=radio]:hover,input[type=search]:hover,input[type=tel]:hover,input[type=text]:hover,input[type=url]:hover,textarea:hover{border-color:#a8bece}.checkbox-tristate:focus,.dops-password-box .dops-text-input:focus,input[type=checkbox]:focus,input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=radio]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,textarea:focus{border-color:#0087be;outline:0;box-shadow:0 0 0 2px #78dcfa}.checkbox-tristate:focus::-ms-clear,.dops-password-box .dops-text-input:focus::-ms-clear,input[type=checkbox]:focus::-ms-clear,input[type=email]:focus::-ms-clear,input[type=number]:focus::-ms-clear,input[type=password]:focus::-ms-clear,input[type=radio]:focus::-ms-clear,input[type=search]:focus::-ms-clear,input[type=tel]:focus::-ms-clear,input[type=text]:focus::-ms-clear,input[type=url]:focus::-ms-clear,textarea:focus::-ms-clear{display:none}.checkbox-tristate:disabled,.dops-password-box .dops-text-input:disabled,input[type=checkbox]:disabled,input[type=email]:disabled,input[type=number]:disabled,input[type=password]:disabled,input[type=radio]:disabled,input[type=search]:disabled,input[type=tel]:disabled,input[type=text]:disabled,input[type=url]:disabled,textarea:disabled{background:#f3f6f8;border-color:#e9eff3;color:#a8bece}.checkbox-tristate:disabled:hover,.dops-password-box .dops-text-input:disabled:hover,input[type=checkbox]:disabled:hover,input[type=email]:disabled:hover,input[type=number]:disabled:hover,input[type=password]:disabled:hover,input[type=radio]:disabled:hover,input[type=search]:disabled:hover,input[type=tel]:disabled:hover,input[type=text]:disabled:hover,input[type=url]:disabled:hover,textarea:disabled:hover{cursor:default}.checkbox-tristate:disabled::-webkit-input-placeholder,.dops-password-box .dops-text-input:disabled::-webkit-input-placeholder,input[type=checkbox]:disabled::-webkit-input-placeholder,input[type=email]:disabled::-webkit-input-placeholder,input[type=number]:disabled::-webkit-input-placeholder,input[type=password]:disabled::-webkit-input-placeholder,input[type=radio]:disabled::-webkit-input-placeholder,input[type=search]:disabled::-webkit-input-placeholder,input[type=tel]:disabled::-webkit-input-placeholder,input[type=text]:disabled::-webkit-input-placeholder,input[type=url]:disabled::-webkit-input-placeholder,textarea:disabled::-webkit-input-placeholder{color:#a8bece}.checkbox-tristate:disabled::-moz-placeholder,.dops-password-box .dops-text-input:disabled::-moz-placeholder,input[type=checkbox]:disabled::-moz-placeholder,input[type=email]:disabled::-moz-placeholder,input[type=number]:disabled::-moz-placeholder,input[type=password]:disabled::-moz-placeholder,input[type=radio]:disabled::-moz-placeholder,input[type=search]:disabled::-moz-placeholder,input[type=tel]:disabled::-moz-placeholder,input[type=text]:disabled::-moz-placeholder,input[type=url]:disabled::-moz-placeholder,textarea:disabled::-moz-placeholder{color:#a8bece}.checkbox-tristate:disabled:-ms-input-placeholder,.dops-password-box .dops-text-input:disabled:-ms-input-placeholder,input[type=checkbox]:disabled:-ms-input-placeholder,input[type=email]:disabled:-ms-input-placeholder,input[type=number]:disabled:-ms-input-placeholder,input[type=password]:disabled:-ms-input-placeholder,input[type=radio]:disabled:-ms-input-placeholder,input[type=search]:disabled:-ms-input-placeholder,input[type=tel]:disabled:-ms-input-placeholder,input[type=text]:disabled:-ms-input-placeholder,input[type=url]:disabled:-ms-input-placeholder,textarea:disabled:-ms-input-placeholder{color:#a8bece}.checkbox-tristate:disabled::placeholder,.dops-password-box .dops-text-input:disabled::placeholder,input[type=checkbox]:disabled::placeholder,input[type=email]:disabled::placeholder,input[type=number]:disabled::placeholder,input[type=password]:disabled::placeholder,input[type=radio]:disabled::placeholder,input[type=search]:disabled::placeholder,input[type=tel]:disabled::placeholder,input[type=text]:disabled::placeholder,input[type=url]:disabled::placeholder,textarea:disabled::placeholder{color:#a8bece}textarea{min-height:92px}fieldset,input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],label,select,textarea{box-sizing:border-box}.checkbox-tristate,input[type=checkbox],input[type=radio]{clear:none;cursor:pointer;display:inline-block;line-height:0;height:1pc;margin:4px 0 0;float:left;outline:0;padding:0;text-align:center;vertical-align:middle;width:1pc;min-width:1pc;-webkit-appearance:none;-moz-appearance:none;appearance:none}.checkbox-tristate+span,input[type=checkbox]+span,input[type=radio]+span{display:block;margin-left:24px}.checkbox-tristate:checked:before,input[type=checkbox]:checked:before{content:'\F418';margin:-4px 0 0 -5px;float:left;display:inline-block;vertical-align:middle;width:1pc;font:400 23px/1 Noticons;speak:none;color:#00aadc}.checkbox-tristate:disabled:checked:before,input[type=checkbox]:disabled:checked:before{color:#e9eff3}input[type=radio]{border-radius:50%;margin-right:4px;line-height:10px}input[type=radio]:checked:before{float:left;display:inline-block;content:'\2022';margin:3px;width:8px;height:8px;text-indent:-9999px;background:#00aadc;vertical-align:middle;border-radius:50%;-webkit-animation:grow .2s ease-in-out;animation:grow .2s ease-in-out}input[type=radio]:disabled:checked:before{background:#e9eff3}@-webkit-keyframes grow{0%{-webkit-transform:scale(0.3);transform:scale(0.3)}60%{-webkit-transform:scale(1.15);transform:scale(1.15)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes grow{0%{-webkit-transform:scale(0.3);transform:scale(0.3)}60%{-webkit-transform:scale(1.15);transform:scale(1.15)}to{-webkit-transform:scale(1);transform:scale(1)}}.checkbox-tristate{position:relative;margin:20px 0 19px 20px}.checkbox-tristate:before{position:absolute;color:#00aadc;font-family:Noticons}.some-selected .checkbox-tristate:before{content:'\F421';top:7px;left:0}.all-selected .checkbox-tristate:before{content:'\F418';top:8px;left:-5px;font-size:23px}.toggle[type=checkbox]{display:none}.toggle+.toggle-label{position:relative;display:inline-block;border-radius:9pt;padding:2px;width:40px;height:24px;background:#a8bece;vertical-align:middle;outline:0;cursor:pointer;-webkit-transition:all .4s ease;transition:all .4s ease}.toggle+.toggle-label:after,.toggle+.toggle-label:before{position:relative;display:block;content:"";width:20px;height:20px}.toggle+.toggle-label:after{left:0;border-radius:50%;background:#fff;-webkit-transition:all .2s ease;transition:all .2s ease}.toggle+.toggle-label:before{display:none}.toggle+.toggle-label:hover{background:#c8d7e1}.toggle:focus+.toggle-label{box-shadow:0 0 0 2px #00aadc}.toggle:focus:checked+.toggle-label{box-shadow:0 0 0 2px #78dcfa}.toggle:checked+.toggle-label{background:#00aadc}.toggle:checked+.toggle-label:after{left:1pc}.toggle:checked:hover+.toggle-label{background:#78dcfa}.toggle:disabled+.toggle-label,.toggle:disabled:hover+.toggle-label{background:#e9eff3}.toggle.is-toggling+.toggle-label{background:#00aadc}.toggle.is-toggling:checked+.toggle-label{background:#c8d7e1}select{background:#fff url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiAgICAgICAgPHRpdGxlPmFycm93LWRvd248L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4gICAgICAgIDxnIGlkPSJhcnJvdy1kb3duIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiBmaWxsPSIjQzhEN0UxIj4gICAgICAgICAgICA8cGF0aCBkPSJNMTUuNSw2IEwxNyw3LjUgTDEwLjI1LDE0LjI1IEwzLjUsNy41IEw1LDYgTDEwLjI1LDExLjI1IEwxNS41LDYgWiIgaWQ9IkRvd24tQXJyb3ciIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==) no-repeat right 10px center;border-color:#c8d7e1;border-style:solid;border-radius:4px;border-width:1px 1px 2px;color:#2e4453;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-size:14px;line-height:21px;font-weight:600;text-overflow:ellipsis;text-decoration:none;vertical-align:top;white-space:nowrap;box-sizing:border-box;padding:7px 2pc 9px 14px;-webkit-appearance:none;-moz-appearance:none;appearance:none}select:hover{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiAgICAgICAgPHRpdGxlPmFycm93LWRvd248L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4gICAgICAgIDxnIGlkPSJhcnJvdy1kb3duIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiBmaWxsPSIjYThiZWNlIj4gICAgICAgICAgICA8cGF0aCBkPSJNMTUuNSw2IEwxNyw3LjUgTDEwLjI1LDE0LjI1IEwzLjUsNy41IEw1LDYgTDEwLjI1LDExLjI1IEwxNS41LDYgWiIgaWQ9IkRvd24tQXJyb3ciIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==)}select:focus{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiA8dGl0bGU+YXJyb3ctZG93bjwvdGl0bGU+IDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiA8ZGVmcz48L2RlZnM+IDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPiA8ZyBpZD0iYXJyb3ctZG93biIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCIgZmlsbD0iIzJlNDQ1MyI+IDxwYXRoIGQ9Ik0xNS41LDYgTDE3LDcuNSBMMTAuMjUsMTQuMjUgTDMuNSw3LjUgTDUsNiBMMTAuMjUsMTEuMjUgTDE1LjUsNiBaIiBpZD0iRG93bi1BcnJvdyIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPiA8L2c+IDwvZz48L3N2Zz4=);border-color:#00aadc;box-shadow:0 0 0 2px #78dcfa;outline:0;-moz-outline:none;-moz-user-focus:ignore}select:disabled,select:hover:disabled{background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM6c2tldGNoPSJodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2gvbnMiPiAgICAgICAgPHRpdGxlPmFycm93LWRvd248L3RpdGxlPiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gICAgPGRlZnM+PC9kZWZzPiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4gICAgICAgIDxnIGlkPSJhcnJvdy1kb3duIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiBmaWxsPSIjZTllZmYzIj4gICAgICAgICAgICA8cGF0aCBkPSJNMTUuNSw2IEwxNyw3LjUgTDEwLjI1LDE0LjI1IEwzLjUsNy41IEw1LDYgTDEwLjI1LDExLjI1IEwxNS41LDYgWiIgaWQ9IkRvd24tQXJyb3ciIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPjwvcGF0aD4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==) no-repeat right 10px center}select.is-compact{min-width:0;padding:0 20px 2px 6px;margin:0 4px;background-position:right 5px center;background-size:9pt 9pt}label select,label+select{display:block;min-width:200px}label select.is-compact,label+select.is-compact{display:inline-block;min-width:0}select::-ms-expand{display:none}select::-ms-value{background:none;color:#2e4453}select:-moz-focusring{color:transparent;text-shadow:0 0 0 #2e4453}input[type=search]::-webkit-search-decoration{display:none}.dops-password-box{position:relative}.dops-password-box .dops-text-input{display:block;width:100%;padding-right:2pc}.dops-password-box.dops-password-box--hidden .dops-text-input{color:#779ab3}.dops-password-box .dops-password-box__toggle-visibility{display:block;cursor:pointer;position:absolute;right:8px;top:8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dops-password-box .dops-password-box__toggle-visibility .gridicon,.dops-password-box .dops-password-box__toggle-visibility .gridicon:hover{fill:#668eaa}.dops-password-box .dops-password-box__toggle-visibility:focus .gridicon{outline:1px dotted #668eaa}.dops-card{position:relative;margin:0 auto .625rem;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px rgba(200,215,225,.5),0 1px 2px #e9eff3}.dops-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.dops-card{margin-bottom:1rem;padding:1.5rem}}.dops-card.is-compact{margin-bottom:1px}@media (min-width:481px){.dops-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.dops-card-title{background-color:#f9f9f9;color:#000;font-family:Helvetica,Arial,sans-serif;font-size:9pt;font-weight:400;text-transform:uppercase;border-bottom:1px solid #ddd;padding:10px 1pc;margin:0}@media (min-width:481px){.dops-card-title{padding:1pc 24px}}.dops-card-title .dops-card-meta{color:#aaa;float:right}.dops-card-section{font-size:14px;padding:1pc;border-bottom:1px solid #ddd}.dops-card-section:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.dops-card-section{padding:24px}}.dops-card-section:last-child{border-bottom:none}.dops-card-section .dops-card-section-label{color:#000;font-size:9pt;font-weight:400;text-transform:uppercase}.dops-card-section .dops-card-section-orient-vertical .dops-card-section-label{margin-bottom:10px}.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-label{float:left;width:30%}@media all and (max-width:590px){.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-label{margin-bottom:10px;float:none;width:100%}}.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-content{float:right;width:70%}@media all and (max-width:590px){.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-content{float:none;width:100%}}.dops-card-footer{background:#f9f9f9;padding:15px 20px}.dops-card-icon{float:right;text-transform:capitalize}.dops-card-icon .genericon{border-radius:50%;width:1pc;height:1pc;margin-right:10px;color:#fff;background:#81bf16}.genericon .dops-hovericon{display:none;font-size:9pt;font-family:Helvetica,Arial,sans-serif;padding:5px 5px 8px;position:absolute;left:0;top:100%;z-index:999}.genericon .dops-hovericon.dops-hovericon-light{border-radius:3px;box-shadow:5px 5px 5px rgba(0,0,0,.3);border:1px solid #bbb;background-color:#fff;color:#000}.genericon .dops-hovericon.dops-hovericon-dark{border-radius:3px;background:rgba(0,0,0,.9);color:#fff}.genericon:hover .dops-hovericon{display:block}.slideDown-enter{overflow-y:hidden;max-height:0;-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.slideDown-enter-active,.slideDown-leave{overflow-y:hidden;max-height:25pc}.slideDown-leave{-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.slideDown-leave-active{overflow-y:hidden;max-height:0}.slideRTL-enter{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all .2s linear;transition:all .2s linear}.slideRTL-enter-active{-webkit-transform:translateX(0%);transform:translateX(0%)}.slideRTL-leave{position:absolute;opacity:1;-webkit-transition:all .2s linear;transition:all .2s linear}.slideRTL-leave-active{opacity:0}.slideLTR-enter{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all .2s linear;transition:all .2s linear}.slideLTR-enter-active{-webkit-transform:translateX(0%);transform:translateX(0%)}.slideLTR-leave{position:absolute;opacity:1;-webkit-transition:all .2s linear;transition:all .2s linear}.slideLTR-leave-active{opacity:0}.dops-button{background:#fff;border-color:#c8d7e1;border-style:solid;border-width:1px 1px 2px;color:#2e4453;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-weight:500;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;line-height:21px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.dops-button:hover{border-color:#a8bece;color:#2e4453}.dops-button:active{border-width:2px 1px 1px}.dops-button:visited{color:#2e4453}.dops-button:disabled,.dops-button[disabled]{color:#e9eff3;background:#fff;border-color:#e9eff3;cursor:default}.dops-button:disabled:active,.dops-button[disabled]:active{border-width:1px 1px 2px}.dops-button:focus{border-color:#00aadc;box-shadow:0 0 0 2px #78dcfa}.dops-button.is-compact{padding:7px;color:#668eaa;font-size:11px;line-height:1;text-transform:uppercase}.dops-button.is-compact:disabled{color:#e9eff3}.dops-button.is-compact .gridicon{top:4px;margin-top:-8px}.dops-button.is-compact .gridicons-plus-small{margin-left:-4px}.dops-button.is-compact .gridicons-plus-small:last-of-type{margin-left:0}.dops-button.is-compact .gridicons-plus-small+.gridicon{margin-left:-4px}.dops-button.hidden{display:none}.dops-button .gridicon{position:relative;top:4px;margin-top:-2px;width:18px;height:18px}.dops-button.is-primary{background:#00aadc;border-color:#0087be;color:#fff}.dops-button.is-primary:focus,.dops-button.is-primary:hover{border-color:#005082;color:#fff}.dops-button.is-primary:disabled,.dops-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.dops-button.is-primary.is-compact{color:#fff}.dops-button.is-scary{color:#d94f4f}.dops-button.is-scary:focus,.dops-button.is-scary:hover{border-color:#d94f4f}.dops-button.is-scary:focus{box-shadow:0 0 0 2px #eba3a3}.dops-button.is-scary:disabled,.dops-button.is-scary[disabled]{color:#f4cdcd;border-color:#e9eff3}.dops-button.is-primary.is-scary{background:#d94f4f;border-color:#a02222;color:#fff}.dops-button.is-primary.is-scary:focus,.dops-button.is-primary.is-scary:hover{border-color:#4c1010}.dops-button.is-primary.is-scary:disabled,.dops-button.is-primary.is-scary[disabled]{background:#eba3a3;border-color:#e48484}.dops-button.is-borderless{border:none;color:#668eaa;padding-left:0;padding-right:0}.dops-button.is-borderless:hover{color:#2e4453}.dops-button.is-borderless:focus{box-shadow:none}.dops-button.is-borderless .gridicon{width:24px;height:24px;top:6px}.dops-button.is-borderless:disabled,.dops-button.is-borderless[disabled]{color:#e9eff3;background:#fff;cursor:default}.dops-button.is-borderless:disabled:active,.dops-button.is-borderless[disabled]:active{border-width:0}.dops-button.is-borderless.is-scary{color:#d94f4f}.dops-button.is-borderless.is-scary:focus,.dops-button.is-borderless.is-scary:hover{color:#a02222}.dops-button.is-borderless.is-scary[disabled]{color:#f4cdcd}.dops-button.is-borderless.is-compact{background:transparent;border-radius:0}.dops-button.is-borderless.is-compact .gridicon{width:18px;height:18px;top:5px}.form-input-validation{color:#4ab866;position:relative;padding:6px 24px 11px 28px;border-radius:1px;box-sizing:border-box;font-size:14px;-webkit-animation:appear .3s ease-in-out;animation:appear .3s ease-in-out}.form-input-validation:before{font-size:1pc;content:"\F418";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;position:absolute;left:0;font-size:24px;line-height:1}.form-input-validation.is-error{color:#d94f4f}.form-input-validation.is-error:before{content:"\F424"}input[type=checkbox]+span,input[type=radio]+span{line-height:2}.dops-form-section-title{font-weight:700;color:#333;border-bottom:1px solid #ddd;padding-bottom:3px;margin-bottom:5px;margin-top:15px}.dops-field-description{font-size:.8em;font-style:italic}label+.dops-field-description{margin-top:-5px}.dops-form-section-body:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-form-checkbox{max-width:100%}.dops-form-checkbox input[type=checkbox]{margin-right:10px}.dops-form-text{max-width:100%}.dops-form-text input{width:100%;box-shadow:none;background:#fff;border:1px solid #d5d5d5;padding:8px 10px}.dops-form-select{max-width:100%}.dops-form-select.dops-form-inline{display:inline}.dops-form-select.dops-form-inline select{width:auto;margin-right:10px}.dops-form-error input,.dops-form-error select,.dops-form-errormessage{border:1px solid #dd3d36}.dops-form-errormessage{color:#a00;display:block;margin:5px 0 0;padding:5px}.dops-form-label{max-width:100%;margin-bottom:5px;position:relative}.dops-form-label label{display:block;margin-top:10px;float:none;margin-bottom:10px;width:auto}.dops-form-label label.floating{color:#999;display:inline-block;z-index:2;position:absolute;top:0;left:0;font-weight:400;height:2pc;padding:10px 9pt;margin:0}.dops-form-label label.floating--floated{color:#333;z-index:0;font-weight:700;left:auto;height:auto;padding:0 5px;bottom:auto;font-size:11px;opacity:0;-webkit-transition:top .25s,opacity .25s;transition:top .25s,opacity .25s}.dops-form-label label.floating--floated-active{top:-1pc;opacity:1}.dops-form-row:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-form-actionbar{background:#f9f9f9;color:#aaa;padding:15px 20px}.dops-floating-label-input{position:relative;margin-top:18px}.dops-floating-label-input__input{position:relative;z-index:1}.dops-slider{position:relative}.dops-slider .handle{cursor:pointer}.dops-slider .handle.active{background-color:grey}.dops-slider .bar{border-radius:5px;top:10px;height:10px}.dops-slider .bar-0{background-color:#4ab866}.dops-slider .bar-1{background-color:#ddd}.styleguide{padding:20px;background-color:#fff}.styleguide .clear:after,.styleguide .styleguide-section:after{content:".";display:block;height:0;clear:both;visibility:hidden}.styleguide .styleguide-section>h2{font-size:14px;margin:20px 0;padding-bottom:10px;border-bottom:1px solid #ccc}.styleguide .styleguide-section .styleguide-subsection{float:left;clear:left;width:200px;padding-right:20px;margin-bottom:20px;font-size:10px}.styleguide .styleguide-section .styleguide-subsection>h3{font-size:9pt}.styleguide .styleguide-section .styleguide-section-demo{float:right;padding:20px;border:1px solid #ccc;width:calc(100% - 200px)}a,abbr,acronym,address,applet,b,blockquote,body,caption,center,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,u,ul,var{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,footer,header,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}body{margin:0;font-family:Open Sans,sans-serif}.core-container{max-width:750pt;margin:0 auto;padding:0 20px}.core-content{background:#f5f5f5;padding:57px 0}.core-content:after{clear:both;content:'';display:block}.core-content .primary{clear:none;float:right;margin:0 0 0 -300px;width:100%}.core-content .demo-container{overflow:hidden;margin:0 0 0 300px;font-size:14px}.core-content .secondary{clear:none;float:left;overflow:hidden;width:260px}.sites-navigation a,.sites-navigation a:active,.sites-navigation a:focus,.sites-navigation a:hover{text-decoration:none}.sidebar .sidebar-menu a:first-child:before{font:normal normal normal 14px/1 FontAwesome!important}.sidebar .sidebar-menu .briefcase a:first-child:before{content:'\F0B1'}.sidebar .sidebar-menu .moon a:first-child:before{content:'\F186'}.sidebar .sidebar-menu .leaf a:first-child:before{content:'\F06C'} \ No newline at end of file +.dops-tabs-vertical:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-vertical>ul{width:30%;float:left}.dops-tabs-vertical>ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-vertical>ul>li{list-style:none;margin:0}.dops-tabs-vertical>ul>li>button{display:block;border-left:2px solid transparent;color:#999;margin:0 10px 10px 0;padding:4px 6px;text-decoration:none}.dops-tabs-vertical>ul>li button:focus,.dops-tabs-vertical>ul>li button:hover,.dops-tabs-vertical>ul>li.active button{color:#000;background-color:#f9f9f9}.dops-tabs-vertical>ul>li button:focus{box-shadow:0 0 4px rgba(0,0,0,.15)}.dops-tabs-vertical>ul>li.active button{border-color:#000}.dops-tabs-vertical>div{float:right;width:70%}.dops-tabs-horizontal:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-horizontal>ul{border-bottom:1px solid #eee;margin-left:0;margin-top:0;clear:both}.dops-tabs-horizontal>ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-tabs-horizontal>ul>li{list-style:none;display:inline-block}.dops-tabs-horizontal>ul>li>button{color:#aaa;display:block;font-size:14px;margin:0;padding:15px 20px;text-align:center;text-transform:uppercase;text-decoration:none}.dops-tabs-horizontal>ul>li button:focus,.dops-tabs-horizontal>ul>li button:hover,.dops-tabs-horizontal>ul>li.active button{color:#000}.dops-tabs-horizontal>ul>li button:focus{box-shadow:0 0 4px rgba(0,0,0,.15)}.dops-tabs-horizontal>ul>li.active{border-bottom:2px solid #000}@media (max-width:480px){.dops-tabs-horizontal>ul{text-align:center}}.site-icon{position:relative;background:#c8d7e1;border:1px solid #fff;overflow:hidden;-ms-flex-item-align:center;align-self:center;margin:0}.site-icon.is-blank .noticon{color:#fff;text-align:center;z-index:0}.site-icon__img{background:#fff;position:relative}.all-sites-icon{margin-right:9pt;position:relative;left:0;top:0;height:2pc;width:2pc}.all-sites-icon .site-icon.is-blank:before{display:none}.all-sites-icon.is-shape-1:after,.all-sites-icon.is-shape-1:before,.all-sites-icon.is-shape-2:after,.all-sites-icon.is-shape-2:before,.all-sites-icon.is-shape-3:before{background:#2e4453;content:'';display:block;height:9px;width:9px;position:absolute;left:17px;top:17px}.all-sites-icon.is-shape-1:after,.all-sites-icon.is-shape-2:after{position:absolute;left:6px;top:6px}.all-sites-icon .site-icon{-ms-flex-item-align:auto;align-self:auto;background:#87a6bc;border:none;margin-right:0;height:15px;width:15px;position:absolute}.all-sites-icon.is-shape-1 .site-icon{overflow:visible}.all-sites-icon.is-shape-1 .site-icon:after{background:#87a6bc;content:'';display:block;position:absolute;left:-17px;top:17px;height:15px;width:15px}.all-sites-icon.is-shape-1 .site-icon,.all-sites-icon.is-shape-2 .site-icon{left:auto;right:0;top:0}.all-sites-icon.is-shape-1 .site-icon+.site-icon,.all-sites-icon.is-shape-2 .site-icon+.site-icon{left:0;right:auto;bottom:0;top:auto}.all-sites-icon.is-shape-3 .site-icon{left:0;right:auto;top:0}.all-sites-icon.is-shape-3 .site-icon+.site-icon{bottom:0;left:0;right:auto;top:auto}.all-sites-icon.is-shape-3 .site-icon+.site-icon+.site-icon{bottom:auto;left:auto;right:0;top:0}@-webkit-keyframes appear{0%{opacity:0}to{opacity:1}}@keyframes appear{0%{opacity:0}to{opacity:1}}.site{box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:0;position:relative}.site.is-private .site__title:before{content:"\F470"}.site.is-private .site__title:before,.site.is-redirect .site__title:before{font-size:1pc;vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;color:#87a6bc;margin:0 3px 2px 0;vertical-align:bottom}.site.is-redirect .site__title:before{content:"\F458"}.site__content{border-radius:2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding:1pc;width:100%}.site .site-icon,.site__content{overflow:hidden;position:relative}.site .site-icon{background:#c8d7e1;border:1px solid #fff;height:30px;width:30px;-ms-flex-item-align:center;align-self:center;margin-right:9pt}.site__info{width:0;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto}.site__title{color:#2e4453;display:block;font-weight:400;line-height:1.4}.site__domain{color:#87a6bc;display:block;max-width:95%;font-size:.8em;font-style:italic;line-height:1.4}.site__domain,.site__title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-selector{font-size:13px;position:relative;z-index:20;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-top:0;padding:0;width:100%;box-sizing:border-box}.site-selector.is-large .search{display:block}.site-selector .all-sites .site-icon__img,.site-selector .site .site-icon__img{-webkit-transform:translateZ(0)}.site-selector .all-sites:not(.is-selected) .site-icon__img,.site-selector .site:not(.is-selected) .site-icon__img{filter:url("data:image/svg+xml;utf8,#grayscale");-webkit-filter:grayscale(100%);filter:grayscale(100%);opacity:.7}.site-selector .all-sites.is-selected,.site-selector .site.is-selected{background:#fff}.notouch .site-selector .all-sites:hover,.notouch .site-selector .site:hover{background:#fff;cursor:pointer}.notouch .site-selector .all-sites:hover .site__domain,.notouch .site-selector .all-sites:hover .site__title,.notouch .site-selector .site:hover .site__domain,.notouch .site-selector .site:hover .site__title{color:#00aadc}.notouch .site-selector .all-sites:hover .site-icon__img,.notouch .site-selector .site:hover .site-icon__img{-webkit-filter:none;filter:none;opacity:1}.site-selector .search{border:none;display:none;clear:both;height:auto;position:relative;top:0;width:auto}.site-selector .search .noticon-search{background-color:transparent;border-left:none;color:#87a6bc;padding:0;width:auto;position:absolute;left:9pt;top:8px}.site-selector .search .noticon-search:before{font-size:1pc}.site-selector .search input{background-color:#f3f6f8;border:1px solid #c8d7e1;border-radius:40px;display:block;font-size:9pt;height:auto;line-height:1.5;margin:10px 4px 15px 0;opacity:1;padding:6px 10px 6px 33px;position:static;width:99.5%;-webkit-appearance:none}.site-selector .search input:focus{outline:0;border:1px solid #c8d7e1}.site-selector .search input::-webkit-input-placeholder{color:#87a6bc}.site-selector .search input::-moz-placeholder{color:#87a6bc}.site-selector .search input::-webkit-search-cancel-button{-webkit-appearance:searchfield-cancel-button}.site-selector .search.open{width:100%}.site-selector .search.open .noticon-close-alt{color:#87a6bc;display:none;margin:0;opacity:1;padding:6px 20px}.site-selector .search.open .noticon-close-alt:before{font-size:9pt;margin:0}.site-selector__no-results{color:#87a6bc;font-style:italic;padding:10px 20px}.site-selector__add-new-wordpress{border-top:1px solid #c8d7e1;clear:both;color:#4f748e;display:block;font-size:10px;font-weight:400;padding:15px 0;text-transform:uppercase}.site-selector__add-new-wordpress .noticon{color:inherit;font-size:9pt;margin-left:15px;margin-right:5px;position:static}.site-selector__add-new-wordpress:hover{color:#00aadc}.site-selector .site-action{padding-top:15px}@-webkit-keyframes appear{0%{opacity:0}to{opacity:1}}@keyframes appear{0%{opacity:0}to{opacity:1}}.current-site{margin:0 0 20px;padding:0}.current-site.is-loading .site-icon{-webkit-animation:pulse-light .8s ease-in-out infinite;animation:pulse-light .8s ease-in-out infinite}.current-site.is-loading .site__title{color:#4f748e;line-height:35px}.current-site.is-loading .current-site__switch-sites{cursor:default}.current-site.is-loading .current-site__switch-sites:before{visibility:hidden}.current-site .site{box-shadow:0 1px 0 rgba(46,68,83,.05)}.current-site__add-new-wordpress,.current-site__switch-sites{background-color:#f3f6f8;color:#4f748e;cursor:pointer;font-size:10px;display:block;line-height:1.8;margin-top:1px;padding:8px 0 8px 18px;text-transform:uppercase}.current-site__add-new-wordpress:before,.current-site__switch-sites:before{font-size:18px;content:"\F430";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;margin-right:4px}.current-site__add-new-wordpress:hover,.current-site__switch-sites:hover{background-color:#2e4453;color:#fff}.current-site__add-new-wordpress:before{content:'\F510';font-size:13px;margin-right:4px;margin-top:1px}.rtl .current-site__switch-sites:before{content:'\F429'}@-webkit-keyframes appear{0%{opacity:0}to{opacity:1}}@keyframes appear{0%{opacity:0}to{opacity:1}}.sidebar{font-size:13px;position:relative;margin:0;z-index:10;list-style-type:none}.sidebar .noticon-external{color:#87a6bc;font-size:1pc;-ms-flex-item-align:end;align-self:flex-end}.sidebar .sidebar-menu{clear:both;margin:0 0 1pc;overflow:hidden;padding:0}@media only screen and (max-width:660px){.sidebar .sidebar-menu{margin-top:0}}.sidebar .sidebar-menu:first-child{margin-top:0}.sidebar .sidebar-menu ul{list-style:none;margin:0}.sidebar .sidebar-menu li{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.sidebar .sidebar-menu a{border-radius:2px;color:#2e4453;border:none;display:block;padding:9pt 1pc;text-decoration:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;box-sizing:border-box}.sidebar .sidebar-menu a:focus{outline:0}.sidebar .sidebar-menu a:first-child{-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;width:0}.sidebar .sidebar-menu a:first-child:before{font-size:1pc;content:"\F475";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;line-height:1;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;min-width:18px;color:#87a6bc;margin-right:14px}.sidebar .sidebar-menu a .menu-link-text{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;width:0;line-height:1pc}.sidebar .sidebar-menu a.add-new{background-color:#f3f6f8;border-radius:2px;color:#87a6bc;font-size:10px;padding:4px 10px;margin-right:10px;-ms-flex-item-align:center;align-self:center}.sidebar .sidebar-menu a.add-new:before{display:none}.sidebar .sidebar-menu .selected{background-color:#00aadc}.sidebar .sidebar-menu .selected a,.sidebar .sidebar-menu .selected a:first-child:before{color:#fff}.sidebar .sidebar-menu .selected a.add-new{background:#fff;color:#00aadc}.rtl .sidebar>.sidebar-menu .action.new:before{margin:10px -58% 0 0}.sidebar-heading{color:#87a6bc;font-size:11px;display:inline-block;margin-bottom:8px;padding:0 8px 0 0;position:relative;text-transform:uppercase;vertical-align:top}.sidebar-heading:after{border-top:1px solid #c8d7e1;content:'';display:block;position:absolute;left:100%;top:8px;width:15pc;width:100vw}.sites-navigation{position:relative}.sites-navigation .navigation-sidebar,.sites-navigation .sites-list{-webkit-transition:all .15s cubic-bezier(0.77,0,0.175,1),opacity .2s linear;transition:all .15s cubic-bezier(0.77,0,0.175,1),opacity .2s linear;opacity:1;position:absolute;top:1px;left:1px;right:1px;bottom:0}.sites-navigation .sites-list,.sites-navigation.focus-sites .navigation-sidebar{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);opacity:0}.sites-navigation .navigation-sidebar,.sites-navigation.focus-sites .sites-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}.dops-col-right{width:50%;float:right}@media all and (max-width:590px){.dops-col-right{width:100%;float:none}}.dops-col-left{width:50%;float:left;padding-right:10px}@media all and (max-width:590px){.dops-col-left{width:100%;float:none;padding-right:0}}body.dops-modal-showing{overflow:hidden;position:fixed}.dops-modal-wrapper{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;display:block;overflow-x:hidden;overflow-y:auto;text-align:center;-webkit-overflow-scrolling:touch;outline:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear;background-color:rgba(0,0,0,.5);cursor:pointer}.dops-modal-wrapper:before{content:'';display:inline-block;height:100%;vertical-align:middle}.dops-modal-wrapper .dops-modal{position:relative;display:inline-block;margin:0;width:100%;max-width:550px;vertical-align:middle;text-align:left;background-color:#fff;-webkit-transition:all .5s;transition:all .5s;z-index:100;clear:both;cursor:default}@media (min-width:481px){.dops-modal-wrapper .dops-modal{margin:0 auto;height:auto;border-radius:5px;box-shadow:0 4px 20px rgba(0,0,0,.2)}}.gridicon{fill:currentColor}.gridicon.needs-offset g{-webkit-transform:translate(1px, 1px);transform:translate(1px, 1px)}.gridicon.needs-offset-x g{-webkit-transform:translate(1px, 0);transform:translate(1px, 0)}.gridicon.needs-offset-y g{-webkit-transform:translate(0, 1px);transform:translate(0, 1px)}._1qeO-zpPfVaJifww0RFQZ5{clip:rect(1px,1px,1px,1px);position:absolute!important;height:1px;width:1px;overflow:hidden}._1qeO-zpPfVaJifww0RFQZ5:focus{background-color:#fff;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;color:#666;display:block;font-size:.875em;font-weight:700;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}.dops-password-box{position:relative}.dops-password-box .dops-text-input{margin:0;padding:7px 14px;color:#2e4453;font-size:1pc;line-height:1.5;border:1px solid #c8d7e1;background-color:#fff;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;box-sizing:border-box;display:block;width:100%;padding-right:2pc}.dops-password-box .dops-text-input::-webkit-input-placeholder{color:#87a6bc}.dops-password-box .dops-text-input::-moz-placeholder{color:#87a6bc}.dops-password-box .dops-text-input:-ms-input-placeholder{color:#87a6bc}.dops-password-box .dops-text-input::placeholder{color:#87a6bc}.dops-password-box .dops-text-input:hover{border-color:#a8bece}.dops-password-box .dops-text-input:focus{border-color:#0087be;outline:0;box-shadow:0 0 0 2px #78dcfa}.dops-password-box .dops-text-input:focus::-ms-clear{display:none}.dops-password-box .dops-text-input:disabled{background:#f3f6f8;border-color:#e9eff3;color:#a8bece}.dops-password-box .dops-text-input:disabled:hover{cursor:default}.dops-password-box .dops-text-input:disabled::-webkit-input-placeholder{color:#a8bece}.dops-password-box .dops-text-input:disabled::-moz-placeholder{color:#a8bece}.dops-password-box .dops-text-input:disabled:-ms-input-placeholder{color:#a8bece}.dops-password-box .dops-text-input:disabled::placeholder{color:#a8bece}.dops-password-box.dops-password-box--hidden .dops-text-input{color:#779ab3}.dops-password-box .dops-password-box__toggle-visibility{display:block;cursor:pointer;position:absolute;right:8px;top:8px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dops-password-box .dops-password-box__toggle-visibility .gridicon,.dops-password-box .dops-password-box__toggle-visibility .gridicon:hover{fill:#668eaa}.dops-password-box .dops-password-box__toggle-visibility:focus .gridicon{outline:1px dotted #668eaa}.dops-card{position:relative;margin:0 auto .625rem;padding:1rem;box-sizing:border-box;background:#fff;box-shadow:0 0 0 1px rgba(200,215,225,.5),0 1px 2px #e9eff3}.dops-card:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.dops-card{margin-bottom:1rem;padding:1.5rem}}.dops-card.is-compact{margin-bottom:1px}@media (min-width:481px){.dops-card.is-compact{margin-bottom:1px;padding:1rem 1.5rem}}.dops-card-title{background-color:#f9f9f9;color:#000;font-family:Helvetica,Arial,sans-serif;font-size:9pt;font-weight:400;text-transform:uppercase;border-bottom:1px solid #ddd;padding:10px 1pc;margin:0}@media (min-width:481px){.dops-card-title{padding:1pc 24px}}.dops-card-title .dops-card-meta{color:#aaa;float:right}.dops-card-section{font-size:14px;padding:1pc;border-bottom:1px solid #ddd}.dops-card-section:after{content:".";display:block;height:0;clear:both;visibility:hidden}@media (min-width:481px){.dops-card-section{padding:24px}}.dops-card-section:last-child{border-bottom:none}.dops-card-section .dops-card-section-label{color:#000;font-size:9pt;font-weight:400;text-transform:uppercase}.dops-card-section .dops-card-section-orient-vertical .dops-card-section-label{margin-bottom:10px}.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-label{float:left;width:30%}@media all and (max-width:590px){.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-label{margin-bottom:10px;float:none;width:100%}}.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-content{float:right;width:70%}@media all and (max-width:590px){.dops-card-section .dops-card-section-orient-horizontal .dops-card-section-content{float:none;width:100%}}.dops-card-footer{background:#f9f9f9;padding:15px 20px}.dops-card-icon{float:right;text-transform:capitalize}.dops-card-icon .genericon{border-radius:50%;width:1pc;height:1pc;margin-right:10px;color:#fff;background:#81bf16}.genericon .dops-hovericon{display:none;font-size:9pt;font-family:Helvetica,Arial,sans-serif;padding:5px 5px 8px;position:absolute;left:0;top:100%;z-index:999}.genericon .dops-hovericon.dops-hovericon-light{border-radius:3px;box-shadow:5px 5px 5px rgba(0,0,0,.3);border:1px solid #bbb;background-color:#fff;color:#000}.genericon .dops-hovericon.dops-hovericon-dark{border-radius:3px;background:rgba(0,0,0,.9);color:#fff}.genericon:hover .dops-hovericon{display:block}.slideDown-enter{overflow-y:hidden;max-height:0;-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.slideDown-enter-active,.slideDown-leave{overflow-y:hidden;max-height:25pc}.slideDown-leave{-webkit-transition:all .5s ease-out;transition:all .5s ease-out}.slideDown-leave-active{overflow-y:hidden;max-height:0}.slideRTL-enter{-webkit-transform:translateX(100%);transform:translateX(100%);-webkit-transition:all .2s linear;transition:all .2s linear}.slideRTL-enter-active{-webkit-transform:translateX(0%);transform:translateX(0%)}.slideRTL-leave{position:absolute;opacity:1;-webkit-transition:all .2s linear;transition:all .2s linear}.slideRTL-leave-active{opacity:0}.slideLTR-enter{-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all .2s linear;transition:all .2s linear}.slideLTR-enter-active{-webkit-transform:translateX(0%);transform:translateX(0%)}.slideLTR-leave{position:absolute;opacity:1;-webkit-transition:all .2s linear;transition:all .2s linear}.slideLTR-leave-active{opacity:0}.dops-button{background:#fff;border-color:#c8d7e1;border-style:solid;border-width:1px 1px 2px;color:#2e4453;cursor:pointer;display:inline-block;margin:0;outline:0;overflow:hidden;font-weight:500;text-overflow:ellipsis;text-decoration:none;vertical-align:top;box-sizing:border-box;font-size:14px;line-height:21px;border-radius:4px;padding:7px 14px 9px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.dops-button:hover{border-color:#a8bece;color:#2e4453}.dops-button:active{border-width:2px 1px 1px}.dops-button:visited{color:#2e4453}.dops-button:disabled,.dops-button[disabled]{color:#e9eff3;background:#fff;border-color:#e9eff3;cursor:default}.dops-button:disabled:active,.dops-button[disabled]:active{border-width:1px 1px 2px}.dops-button:focus{outline:0;border-color:#00aadc;box-shadow:0 0 0 2px #78dcfa}.dops-button.is-compact{padding:7px;color:#668eaa;font-size:11px;line-height:1;text-transform:uppercase}.dops-button.is-compact:disabled{color:#e9eff3}.dops-button.is-compact .gridicon{top:4px;margin-top:-8px}.dops-button.is-compact .gridicons-plus-small{margin-left:-4px}.dops-button.is-compact .gridicons-plus-small:last-of-type{margin-left:0}.dops-button.is-compact .gridicons-plus-small+.gridicon{margin-left:-4px}.dops-button.hidden{display:none}.dops-button .gridicon{position:relative;top:4px;margin-top:-2px;width:18px;height:18px}.dops-button.is-primary{background:#00aadc;border-color:#0087be;color:#fff}.dops-button.is-primary:focus,.dops-button.is-primary:hover{border-color:#005082;color:#fff}.dops-button.is-primary:disabled,.dops-button.is-primary[disabled]{background:#bceefd;border-color:#8cc9e2;color:#fff}.dops-button.is-primary.is-compact{color:#fff}.dops-button.is-scary{color:#d94f4f}.dops-button.is-scary:focus,.dops-button.is-scary:hover{border-color:#d94f4f}.dops-button.is-scary:focus{box-shadow:0 0 0 2px #eba3a3}.dops-button.is-scary:disabled,.dops-button.is-scary[disabled]{color:#f4cdcd;border-color:#e9eff3}.dops-button.is-primary.is-scary{background:#d94f4f;border-color:#a02222;color:#fff}.dops-button.is-primary.is-scary:focus,.dops-button.is-primary.is-scary:hover{border-color:#4c1010}.dops-button.is-primary.is-scary:disabled,.dops-button.is-primary.is-scary[disabled]{background:#eba3a3;border-color:#e48484}.dops-button.is-borderless{border:none;color:#668eaa;padding-left:0;padding-right:0}.dops-button.is-borderless:hover{color:#2e4453}.dops-button.is-borderless:focus{box-shadow:none}.dops-button.is-borderless .gridicon{width:24px;height:24px;top:6px}.dops-button.is-borderless:disabled,.dops-button.is-borderless[disabled]{color:#e9eff3;background:#fff;cursor:default}.dops-button.is-borderless:disabled:active,.dops-button.is-borderless[disabled]:active{border-width:0}.dops-button.is-borderless.is-scary{color:#d94f4f}.dops-button.is-borderless.is-scary:focus,.dops-button.is-borderless.is-scary:hover{color:#a02222}.dops-button.is-borderless.is-scary[disabled]{color:#f4cdcd}.dops-button.is-borderless.is-compact{background:transparent;border-radius:0}.dops-button.is-borderless.is-compact .gridicon{width:18px;height:18px;top:5px}.form-input-validation{color:#4ab866;position:relative;padding:6px 24px 11px 28px;border-radius:1px;box-sizing:border-box;font-size:14px;-webkit-animation:appear .3s ease-in-out;animation:appear .3s ease-in-out}.form-input-validation:before{font-size:1pc;content:"\F418";vertical-align:top;text-align:center;display:inline-block;font-family:Noticons;font-style:normal;font-weight:400;font-variant:normal;text-decoration:inherit;text-transform:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;speak:none;position:absolute;left:0;font-size:24px;line-height:1}.form-input-validation.is-error{color:#d94f4f}.form-input-validation.is-error:before{content:"\F424"}input[type=checkbox]+span,input[type=radio]+span{line-height:2}.dops-form-section-title{font-weight:700;color:#333;border-bottom:1px solid #ddd;padding-bottom:3px;margin-bottom:5px;margin-top:15px}.dops-field-description{font-size:.8em;font-style:italic}label+.dops-field-description{margin-top:-5px}.dops-form-section-body:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-form-checkbox{max-width:100%}.dops-form-checkbox input[type=checkbox]{margin-right:10px}.dops-form-text{max-width:100%}.dops-form-text input{width:100%;box-shadow:none;background:#fff;border:1px solid #d5d5d5;padding:8px 10px}.dops-form-select{max-width:100%}.dops-form-select.dops-form-inline{display:inline}.dops-form-select.dops-form-inline select{width:auto;margin-right:10px}.dops-form-error input,.dops-form-error select,.dops-form-errormessage{border:1px solid #dd3d36}.dops-form-errormessage{color:#a00;display:block;margin:5px 0 0;padding:5px}.dops-form-label{max-width:100%;margin-bottom:5px;position:relative}.dops-form-label label{display:block;margin-top:10px;float:none;margin-bottom:10px;width:auto}.dops-form-label label.floating{color:#999;display:inline-block;z-index:2;position:absolute;top:0;left:0;font-weight:400;height:2pc;padding:10px 9pt;margin:0}.dops-form-label label.floating--floated{color:#333;z-index:0;font-weight:700;left:auto;height:auto;padding:0 5px;bottom:auto;font-size:11px;opacity:0;-webkit-transition:top .25s,opacity .25s;transition:top .25s,opacity .25s}.dops-form-label label.floating--floated-active{top:-1pc;opacity:1}.dops-form-row:after{content:".";display:block;height:0;clear:both;visibility:hidden}.dops-form-actionbar{background:#f9f9f9;color:#aaa;padding:15px 20px}.dops-floating-label-input{position:relative;margin-top:18px}.dops-floating-label-input__input{position:relative;z-index:1}.dops-slider{position:relative}.dops-slider .handle{cursor:pointer}.dops-slider .handle.active{background-color:grey}.dops-slider .bar{border-radius:5px;top:10px;height:10px}.dops-slider .bar-0{background-color:#4ab866}.dops-slider .bar-1{background-color:#ddd}.styleguide{padding:20px;background-color:#fff}.styleguide .clear:after,.styleguide .styleguide-section:after{content:".";display:block;height:0;clear:both;visibility:hidden}.styleguide .styleguide-section>h2{font-size:14px;margin:20px 0;padding-bottom:10px;border-bottom:1px solid #ccc}.styleguide .styleguide-section .styleguide-subsection{float:left;clear:left;width:200px;padding-right:20px;margin-bottom:20px;font-size:10px}.styleguide .styleguide-section .styleguide-subsection>h3{font-size:9pt}.styleguide .styleguide-section .styleguide-section-demo{float:right;padding:20px;border:1px solid #ccc;width:calc(100% - 200px)}a,abbr,acronym,address,applet,b,blockquote,body,caption,center,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,u,ul,var{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,footer,header,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}body{margin:0;font-family:Open Sans,sans-serif}.core-container{max-width:750pt;margin:0 auto;padding:0 20px}.core-content{background:#f5f5f5;padding:57px 0}.core-content:after{clear:both;content:'';display:block}.core-content .primary{clear:none;float:right;margin:0 0 0 -300px;width:100%}.core-content .demo-container{overflow:hidden;margin:0 0 0 300px;font-size:14px}.core-content .secondary{clear:none;float:left;overflow:hidden;width:260px}.sites-navigation a,.sites-navigation a:active,.sites-navigation a:focus,.sites-navigation a:hover{text-decoration:none}.sidebar .sidebar-menu a:first-child:before{font:normal normal normal 14px/1 FontAwesome!important}.sidebar .sidebar-menu .briefcase a:first-child:before{content:'\F0B1'}.sidebar .sidebar-menu .moon a:first-child:before{content:'\F186'}.sidebar .sidebar-menu .leaf a:first-child:before{content:'\F06C'} \ No newline at end of file diff --git a/dist/demo.css.map b/dist/demo.css.map index d83b839..16e08ef 100644 --- a/dist/demo.css.map +++ b/dist/demo.css.map @@ -1 +1 @@ -{"version":3,"sources":["webpack:///./client/client/demo.scss"],"names":[],"mappings":"AAAA;;GAEG;AAEH;EACC,UAAU;EACV,qCAAqC,EAFhC;;AAKN;EACC,kBAAkB;EAClB,eAAe;EACf,gBAAe,EAHC;;AAMjB;EACC,oBAAoB;EACpB,gBAAgB,EAFF;;AAKF;EACZ,YAAY;EACZ,YAAY;EACZ,eAAe,EAHK","file":"demo.css","sourcesContent":["/**\n * demo style\n */\n\nbody {\n\tmargin: 0;\n\tfont-family: 'Open Sans', sans-serif;\n}\n\n.core_container {\n\tmax-width: 1000px;\n\tmargin: 0 auto;\n\tpadding: 0 20px;\n}\n\n.core_content {\n\tbackground: #F5F5F5;\n\tpadding: 57px 0;\n}\n\n.core_content:after {\n\tclear: both;\n\tcontent: '';\n\tdisplay: block;\n}\n\n\n/** WEBPACK FOOTER **\n ** webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/client/demo.scss\n **/"],"sourceRoot":""} \ No newline at end of file +{"version":3,"sources":["webpack:///./client/components/tabs/client/components/client/components/tabs/style.scss","webpack:///./client/components/tabs/client/components/client/scss/layout.scss","webpack:///./client/components/my-sites-navigation/site-icon/client/components/my-sites-navigation/client/components/my-sites-navigation/site-icon/style.scss","webpack:///./client/components/my-sites-navigation/site-icon/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/all-sites-icon/client/components/my-sites-navigation/client/components/my-sites-navigation/all-sites-icon/style.scss","webpack:///./client/components/my-sites-navigation/all-sites-icon/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/site/client/components/my-sites-navigation/site/style.scss","webpack:///./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/components/my-sites-navigation/site/style.scss","webpack:///./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","webpack:///./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/site-selector/client/components/my-sites-navigation/client/components/my-sites-navigation/site-selector/style.scss","webpack:///./client/components/my-sites-navigation/site-selector/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/current-site/style.scss","webpack:///./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/components/my-sites-navigation/current-site/style.scss","webpack:///./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","webpack:///./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/navigation/style.scss","webpack:///./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/components/my-sites-navigation/navigation/style.scss","webpack:///./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","webpack:///./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/scss/calypso-colors.scss","webpack:///./client/components/my-sites-navigation/client/components/client/components/my-sites-navigation/style.scss","webpack:///./client/components/col/client/components/client/components/col/style.scss","webpack:///./client/components/modal/client/components/client/components/modal/style.scss","webpack:///./client/components/modal/client/components/client/scss/layout.scss","webpack:///./client/components/gridicon/client/components/client/components/gridicon/style.scss","webpack:///./client/components/screen-reader-text/client/components/client/components/screen-reader-text/style.scss","webpack:///./client/components/password-box/client/components/client/components/password-box/style.scss","webpack:///./client/components/password-box/client/components/client/scss/calypso-colors.scss","webpack:///./client/components/card/client/components/client/components/card/style.scss","webpack:///./client/components/card/client/components/client/scss/rem.scss","webpack:///./client/components/card/client/components/client/scss/calypso-colors.scss","webpack:///./client/components/card/client/components/client/scss/layout.scss","webpack:///./client/components/card/client/components/client/scss/typography.scss","webpack:///./client/components/hover-icon/client/components/client/components/hover-icon/style.scss","webpack:///./client/components/hover-icon/client/components/client/scss/typography.scss","webpack:///./client/components/wizard/client/components/client/scss/animation.scss","webpack:///./client/components/button/client/components/client/components/button/style.scss","webpack:///./client/components/button/client/components/client/scss/calypso-colors.scss","webpack:///./client/components/button/client/components/client/scss/color-functions.scss","webpack:///./client/components/form-input-validation/client/components/form-input-validation/style.scss","webpack:///./client/components/form-input-validation/client/components/client/components/form-input-validation/style.scss","webpack:///./client/components/form-input-validation/client/components/client/scss/calypso-colors.scss","webpack:///./client/components/form-input-validation/client/components/client/scss/layout.scss","webpack:///./client/components/form/client/components/client/components/form/style.scss","webpack:///./client/components/form/client/components/client/scss/layout.scss","webpack:///./client/components/slider/client/components/client/components/slider/style.scss","webpack:///./client/components/styleguide/client/components/client/components/styleguide/style.scss","webpack:///./client/client/demo.scss","webpack:///./client/client/scss/_reset.scss"],"names":[],"mappings":"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","file":"demo.css","sourcesContent":["@import '../../scss/layout';\n\n.dops-tabs-vertical {\n\t@include clear-fix;\n\t& > ul {\n\t\t@include clear-fix;\n\t\twidth: 30%;\n\t\tfloat: left;\n\n\t\t& > li {\n\t\t\tlist-style: none;\n\t\t\tmargin: 0;\n\n\t\t\t& > button {\n\t\t\t\tdisplay: block;\n\t\t\t\tborder-left: 2px solid transparent;\n\t\t\t\tcolor: #999;\n\t\t\t\tmargin: 0 10px 10px 0;\n\t\t\t\tpadding: 4px 6px;\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\n\t\t\t&.active button, button:hover, button:focus {\n\t\t\t\tcolor: black;\n\t\t\t\tbackground-color: #f9f9f9;\n\t\t\t}\n\n\t\t\tbutton:focus {\n\t\t\t\tbox-shadow: 0 0 4px rgba( black, 0.15 );\n\t\t\t}\n\n\t\t\t&.active button {\n\t\t\t\tborder-color: black;\n\t\t\t}\n\t\t}\n\t}\n\n\t& > div {\n\t\tfloat: right;\n\t\twidth: 70%;\n\t}\n}\n\n.dops-tabs-horizontal {\n\t@include clear-fix;\n\t& > ul {\n\t\t@include clear-fix;\n\t\tborder-bottom: 1px solid #eee;\n\t\tmargin-left: 0px;\n\t\tmargin-top: 0px;\n\t\tclear: both;\n\n\t\t& > li {\n\t\t\tlist-style: none;\n\t\t\tdisplay: inline-block;\n\n\t\t\t& > button {\n\t\t\t\tcolor: #aaa;\n\t\t\t\tdisplay: block;\n\t\t\t\tfont-size: 14px;\n\t\t\t\tmargin: 0 0px;\n\t\t\t\tpadding: 15px 20px;\n\t\t\t\ttext-align: center;\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\n\t\t\t&.active button, button:hover, button:focus {\n\t\t\t\tcolor: black;\n\t\t\t}\n\n\t\t\tbutton:focus {\n\t\t\t\tbox-shadow: 0 0 4px rgba( black, 0.15 );\n\t\t\t}\n\n\t\t\t&.active {\n\t\t\t\tborder-bottom: 2px solid black;\n\t\t\t}\n\t\t}\n\n\t\t@include breakpoint( \"<480px\" ) {\n\t\t\ttext-align: center;\n\t\t}\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/tabs/client/components/client/components/tabs/style.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/tabs/client/components/client/scss/layout.scss","/**\n * @component SiteIcon\n */\n@import \"../../../scss/calypso-colors\";\n\n.site-icon {\n\tposition: relative;\n\tbackground: lighten( $gray, 20% );\n\tborder: 1px solid white;\n\toverflow: hidden;\n\talign-self: center;\n\tmargin: 0;\n\n\t// Globe icon for sites without an icon\n\t&.is-blank {\n\t\t.noticon {\n\t\t\tcolor: $white;\n\t\t\ttext-align: center;\n\t\t\tz-index: 0;\n\t\t}\n\t}\n}\n\n.site-icon__img {\n\tbackground: $white;\n\tposition: relative;\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site-icon/client/components/my-sites-navigation/client/components/my-sites-navigation/site-icon/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site-icon/client/components/my-sites-navigation/client/scss/calypso-colors.scss","/**\n * Icon composite for All My Sites\n */\n@import \"../../../scss/calypso-colors\";\n\n.all-sites-icon {\n\tmargin-right: 12px;\n\tposition: relative;\n\t\tleft: 0;\n\t\ttop: 0;\n\theight: 32px;\n\twidth: 32px;\n\n\t.site-icon.is-blank::before {\n\t\tdisplay: none;\n\t}\n\n\t&.is-shape-3::before,\n\t&.is-shape-2::before,\n\t&.is-shape-2::after,\n\t&.is-shape-1::before,\n\t&.is-shape-1::after {\n\t\tbackground: $gray-dark;\n\t\tcontent: '';\n\t\tdisplay: block;\n\t\theight: 9px;\n\t\twidth: 9px;\n\t\tposition: absolute;\n\t\t\tleft: 17px;\n\t\t\ttop: 17px;\n\t}\n\n\t&.is-shape-2::after,\n\t&.is-shape-1::after {\n\t\tposition: absolute;\n\t\t\tleft: 6px;\n\t\t\ttop: 6px;\n\t}\n}\n\n.all-sites-icon .site-icon {\n\talign-self: auto;\n\tbackground: $gray;\n\tborder: none;\n\tmargin-right: 0;\n\theight: 15px;\n\twidth: 15px;\n\tposition: absolute;\n}\n\n// Shape with one icon\n.all-sites-icon.is-shape-1 {\n\t.site-icon {\n\t\toverflow: visible;\n\n\t\t&::after {\n\t\t\tbackground: $gray;\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tposition: absolute;\n\t\t\t\tleft: -17px;\n\t\t\t\ttop: 17px;\n\t\t\theight: 15px;\n\t\t\twidth: 15px;\n\t\t}\n\t}\n}\n\n// Shape with two icons\n.all-sites-icon.is-shape-1 .site-icon,\n.all-sites-icon.is-shape-2 .site-icon {\n\tleft: auto;\n\tright: 0;\n\ttop: 0;\n\n\t& + .site-icon {\n\t\tleft: 0;\n\t\tright: auto;\n\t\tbottom: 0;\n\t\ttop: auto;\n\t}\n}\n\n// Shape with three or more icons\n.all-sites-icon.is-shape-3 .site-icon {\n\t// Top left\n\tleft: 0;\n\tright: auto;\n\ttop: 0;\n\n\t& + .site-icon {\n\t\t// Bottom left\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tright: auto;\n\t\ttop: auto;\n\t}\n\n\t& + .site-icon + .site-icon {\n\t\t// Top right\n\t\tbottom: auto;\n\t\tleft: auto;\n\t\tright: 0;\n\t\ttop: 0;\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/all-sites-icon/client/components/my-sites-navigation/client/components/my-sites-navigation/all-sites-icon/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/all-sites-icon/client/components/my-sites-navigation/client/scss/calypso-colors.scss","@charset \"UTF-8\";\n/**\n * Site\n */\n@keyframes appear {\n 0% {\n opacity: 0; }\n 100% {\n opacity: 1; } }\n\n.site {\n box-sizing: border-box;\n display: flex;\n flex: 1 0 auto;\n justify-content: space-between;\n padding: 0;\n position: relative; }\n .site.is-private .site__title::before {\n font-size: 16px;\n content: \"\";\n vertical-align: top;\n text-align: center;\n display: inline-block;\n font-family: \"Noticons\";\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n line-height: 1;\n text-decoration: inherit;\n text-transform: none;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n speak: none;\n color: #87a6bc;\n margin: 0 3px 2px 0;\n vertical-align: bottom; }\n .site.is-redirect .site__title::before {\n font-size: 16px;\n content: \"\";\n vertical-align: top;\n text-align: center;\n display: inline-block;\n font-family: \"Noticons\";\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n line-height: 1;\n text-decoration: inherit;\n text-transform: none;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n speak: none;\n color: #87a6bc;\n margin: 0 3px 2px 0;\n vertical-align: bottom; }\n\n.site__content {\n border-radius: 2px;\n display: flex;\n justify-content: space-between;\n overflow: hidden;\n padding: 16px;\n position: relative;\n width: 100%; }\n\n.site .site-icon {\n position: relative;\n background: #c8d7e1;\n border: 1px solid white;\n height: 30px;\n width: 30px;\n overflow: hidden;\n align-self: center;\n margin-right: 12px; }\n\n.site__info {\n width: 0;\n flex: 1 0 auto; }\n\n.site__title {\n color: #2e4453;\n display: block;\n font-weight: 400;\n line-height: 1.4; }\n\n.site__domain {\n color: #87a6bc;\n display: block;\n max-width: 95%;\n font-size: 0.8em;\n font-style: italic;\n line-height: 1.4;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis; }\n\n.site__title,\n.site__domain {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap; }\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site/client/components/my-sites-navigation/site/style.scss","/**\n * Site\n */\n@import \"../../../scss/calypso-colors\";\n@import \"../../../scss/calypso-mixins\";\n\n.site {\n\tbox-sizing: border-box;\n\tdisplay: flex;\n\tflex: 1 0 auto;\n\tjustify-content: space-between;\n\tpadding: 0;\n\tposition: relative;\n\n\t// Show lock icon on private sites\n\t&.is-private {\n\t\t.site__title::before {\n\t\t\t@include noticon( '\\f470', 16px );\n\t\t\tcolor: $gray;\n\t\t\tmargin: 0 3px 2px 0;\n\t\t\tvertical-align: bottom;\n\t\t}\n\t}\n\n\t&.is-redirect {\n\t\t.site__title::before {\n\t\t\t@include noticon( '\\f458', 16px );\n\t\t\tcolor: $gray;\n\t\t\tmargin: 0 3px 2px 0;\n\t\t\tvertical-align: bottom;\n\t\t}\n\t}\n}\n\n// Wraps the anchor element\n.site__content {\n\tborder-radius: 2px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\toverflow: hidden;\n\tpadding: 16px;\n\tposition: relative;\n\twidth: 100%;\n}\n\n// Adjusts the SiteIcon component for use\n// within a Site item\n.site .site-icon {\n\tposition: relative;\n\tbackground: lighten( $gray, 20% );\n\tborder: 1px solid white;\n\theight: 30px;\n\twidth: 30px;\n\toverflow: hidden;\n\talign-self: center;\n\tmargin-right: 12px;\n}\n\n// The group of site title and domain\n.site__info {\n\twidth: 0; // Firefox needs explicit width (even 0)\n\tflex: 1 0 auto;\n}\n\n.site__title {\n\tcolor: $gray-dark;\n\tdisplay: block;\n\tfont-weight: 400;\n\tline-height: 1.4;\n}\n\n.site__domain {\n\tcolor: $gray;\n\tdisplay: block;\n\tmax-width: 95%;\n\tfont: {\n\t\tsize: 0.8em;\n\t\tstyle: italic;\n\t}\n\tline-height: 1.4;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n}\n\n.site__title,\n.site__domain {\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/components/my-sites-navigation/site/style.scss","$full-width:\t960px;\n$one-col:\t\t660px;\n$mobile:\t\t480px;\n\n$sidebar-width:\t269px;\n\n@mixin responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (max-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (max-width: $one-col) { @content; }\n\t}\n\t@else if $width == mobile {\n\t\t@media only screen and (max-width: $mobile) { @content; }\n\t}\n}\n\n@mixin mobile-first-responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (min-width: $one-col) { @content; }\n\t}\n\t@else if $width == full-width-really {\n\t\t@media only screen and (min-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (min-width: $mobile) { @content; }\n\t}\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n@mixin calc($property, $expression) {\n\t#{$property}: -moz-calc(#{$expression});\n\t#{$property}: -o-calc(#{$expression});\n\t#{$property}: -webkit-calc(#{$expression});\n\t#{$property}: calc(#{$expression});\n}\n\n@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n@mixin border-box {\n\t-moz-box-sizing: border-box;\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n}\n\n// Turn a list into a dropdown menu\n@mixin dropdown-menu {\n\tdisplay: none;\n\tbackground: $white;\n\tfloat: none;\n\tline-height: 46px;\n\tmin-width: 220px;\n\toverflow: visible;\n\tpadding: 0;\n\tposition: absolute;\n\twidth: auto;\n\tz-index: 1;\n\tbox-sizing: border-box;\n\tbox-shadow: 0 0 2px rgba(0,0,0,0.15), 0 3px 8px rgba(0,0,0,0.1);\n\n\t&:after {\n\t\tborder: 6px solid transparent;\n\t\tborder-bottom-color: $white;\n\t\tcontent: ' ';\n\t\theight: 0;\n\t\tposition: absolute;\n\t\t\ttop: -12px;\n\t\t\tleft: 73px;\n\t\twidth: 0;\n\t}\n\n\tli {\n\t\tdisplay: block;\n\t\tfloat: none;\n\n\t\ta,\n\t\ta.selected {\n\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\tcolor: $blue-wordpress;\n\t\t\tdisplay: block;\n\t\t\tfloat: none;\n\t\t\theight: auto;\n\t\t\tmargin: 0;\n\t\t\tpadding: 0 14px;\n\t\t\ttext-align: left;\n\n\t\t\t&:hover {\n\t\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\t\tbackground: none; // Remove inherited background color\n\t\t\t\tcolor: $link-highlight;\n\t\t\t\tbox-shadow: none; // Remove inherited box shadow\n\t\t\t}\n\t\t}\n\n\t\ta.selected {\n\t\t\tcolor: $gray-dark;\n\t\t}\n\n\t\t&:last-child a {\n\t\t\tborder-bottom: none; // Last child in the dropdown doesn't need a bottom border\n\t\t}\n\t}\n}\n\n// Can't use the @extend in a media query, use this instead\n@mixin clear-text {\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\n// courtesy: http://codeboxers.com/sass-mixin-for-transitions/\n@mixin transition($transition-property, $transition-time, $method) {\n\t-webkit-transition: $transition-property $transition-time $method;\n\t-moz-transition: $transition-property $transition-time $method;\n\t-ms-transition: $transition-property $transition-time $method;\n\t-o-transition: $transition-property $transition-time $method;\n\ttransition: $transition-property $transition-time $method;\n}\n\n@mixin box-shadow($shadows...) {\n\t-webkit-box-shadow: $shadows;\n\t-moz-box-shadow: $shadows;\n\t-ms-box-shadow: $shadows;\n\t-o-box-shadow: $shadows;\n\tbox-shadow: $shadows;\n}\n\n@mixin site-icon($size, $icon-size) {\n\tposition: relative;\n\tdisplay: inline-block;\n\twidth: $size;\n\theight: $size;\n\toverflow: hidden;\n\tbackground: lighten( $gray, 20% );\n\n\t&::before {\n\t\tcontent: '\\f475';\n\t\tdisplay: inline-block;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont: normal $icon-size/1 'Noticons';\n\t\tcolor: $white;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\theight: $size;\n\t\twidth: $size;\n\t\tline-height: $size;\n\t\ttext-align: center;\n\t\tz-index: 0;\n\t}\n\n\timg {\n\t\tbackground: $white;\n\t\tposition: relative;\n\t}\n}\n\n@mixin debug(){\n\tbox-shadow: 0px 0px 10px $alert-red inset;\n}\n\n@mixin stats-fade-text($toColor) {\n\tbackground-image: linear-gradient(to right, $transparent 0%, $toColor 90%);\n\tposition: absolute;\n\tz-index: 1;\n\tleft: -48px;\n\ttop: 0;\n\tbottom: 0;\n\tcontent: \"\";\n\tdisplay: block;\n\twidth: 48px;\n}\n\n@mixin hide-content-accessibly {\n\tclip: rect( 1px, 1px, 1px, 1px );\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twidth: 1px;\n}\n\n// Creates a fading overlay to signify that the content is longer\n// than the space allows.\n@mixin long-content-fade( $direction: right, $size: 20%, $color: #fff, $edge: 0px, $z-index: false) {\n\tcontent: '';\n\tdisplay: block;\n\tposition: absolute;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-khtml-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\n\t@if $z-index {\n\t\tz-index: $z-index;\n\t}\n\n\t@if $direction == 'bottom' {\n\t\tbackground: linear-gradient( to top, rgba( $color, 0 ), $color 90% );\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\ttop: $edge;\n\t\tbottom: calc(100% - $size);\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'top' {\n\t\tbackground: linear-gradient( to bottom, rgba( $color, 0 ), $color 90% );\n\t\ttop: calc(100% - $size);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\tbottom: $edge;\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'left'{\n\t\tbackground: linear-gradient( to left, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tleft: $edge;\n\t\tbottom: $edge;\n\t\tright: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n\n\t@if $direction == 'right' {\n\t\tbackground: linear-gradient( to right, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tbottom: $edge;\n\t\tright: $edge;\n\t\tleft: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n}\n\n@mixin placeholder( $lighten-percentage: 30% ) {\n\tanimation: loading-fade 1.6s ease-in-out infinite;\n\tbackground-color: lighten( $gray, $lighten-percentage );\n\tcolor: transparent;\n\n\t&:after {\n\t\tcontent: '\\00a0';\n\t}\n}\n\n// Simple animation to make elements appear\n@keyframes appear {\n\t0% {\n\t\topacity: 0;\n\t}\n\t100% {\n\t\topacity: 1;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site/client/components/my-sites-navigation/client/scss/calypso-colors.scss","/**\n * Site Selector\n * @component `selector`\n */\n@import \"../../../scss/calypso-colors\";\n\n.site-selector {\n\tfont-size: 13px;\n\tposition: relative;\n\tz-index: 20;\n\tuser-select: none;\n\tmargin-top: 0;\n\tpadding: 0;\n\twidth: 100%;\n\tbox-sizing: border-box;\n\n\t&.is-large .search {\n\t\tdisplay: block;\n\t}\n}\n\n// Styles for Site elements within the Selector\n.site-selector .site,\n.site-selector .all-sites {\n\n\t.site-icon__img {\n\t\t// Renders a grayscale-filtered image at retina size\n\t\t-webkit-transform: translateZ( 0 );\n\t}\n\n\t// Sites that are not selected display a dimmer icon\n\t&:not( .is-selected ) {\n\t\t.site-icon__img {\n\t\t\tfilter: url(\"data:image/svg+xml;utf8,#grayscale\"); /* Firefox 10+, Firefox on Android */\n\t\t\tfilter: grayscale( 100% );\n\t\t\topacity: 0.7;\n\t\t}\n\t}\n\n\t// Highlight selected site\n\t&.is-selected {\n\t\tbackground: $white;\n\t}\n\n\t// Hover effects\n\t.notouch & {\n\t\t&:hover {\n\t\t\tbackground: $white;\n\t\t\tcursor: pointer;\n\n\t\t\t.site__title,\n\t\t\t.site__domain {\n\t\t\t\tcolor: $blue-medium;\n\t\t\t}\n\n\t\t\t.site-icon__img {\n\t\t\t\tfilter: none;\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t}\n\t}\n}\n\n// @todo rewrite this\n.site-selector .search {\n\tborder: none;\n\tdisplay: none;\n\tclear: both;\n\theight: auto;\n\tposition: relative;\n\t\t// Prevent media queries on generic .search to affect the positioning\n\t\ttop: 0;\n\twidth: auto;\n\n\t.noticon-search {\n\t\tbackground-color: transparent;\n\t\tborder-left: none;\n\t\tcolor: $gray;\n\t\tpadding: 0;\n\t\twidth: auto;\n\t\tposition: absolute;\n\t\t\tleft: 12px;\n\t\t\ttop: 8px;\n\n\t\t&::before {\n\t\t\tfont-size: 16px;\n\t\t}\n\t}\n\n\tinput {\n\t\tbackground-color: $gray-light;\n\t\tborder: 1px solid lighten( $gray, 20% );\n\t\tborder-radius: 40px;\n\t\tdisplay: block;\n\t\tfont-size: 12px;\n\t\theight: auto;\n\t\tline-height: 1.5;\n\t\tmargin: 10px 4px 15px 0;\n\t\topacity: 1;\n\t\tpadding: 6px 10px 6px 33px;\n\t\tposition: static;\n\t\twidth: 99.5%;\n\t\t-webkit-appearance: none;\n\n\t\t&:focus {\n\t\t\toutline: none;\n\t\t\tborder: 1px solid lighten( $gray, 20% );\n\t\t}\n\n\t\t&::-webkit-input-placeholder {\n\t\t\tcolor: $gray;\n\t\t}\n\n\t\t&::-moz-placeholder {\n\t\t\tcolor: $gray;\n\t\t}\n\n\t\t&::-webkit-search-cancel-button {\n\t\t\t-webkit-appearance: searchfield-cancel-button;\n\t\t}\n\t}\n\n\t&.open {\n\t\twidth: 100%;\n\n\t\t.noticon-close-alt {\n\t\t\tcolor: $gray;\n\t\t\tdisplay: none;\n\t\t\tmargin: 0;\n\t\t\topacity: 1;\n\t\t\tpadding: 6px 20px;\n\n\t\t\t&:before {\n\t\t\t\tfont-size: 12px;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.site-selector__no-results {\n\tcolor: $gray;\n\tfont-style: italic;\n\tpadding: 10px 20px;\n}\n\n.site-selector__add-new-wordpress {\n\tborder-top: 1px solid lighten( $gray, 20% );\n\tclear: both;\n\tcolor: darken( $gray, 20% );\n\tdisplay: block;\n\tfont-size: 10px;\n\tfont-weight: 400;\n\tpadding: 15px 0;\n\ttext-transform: uppercase;\n\n\t.noticon {\n\t\tcolor: inherit;\n\t\tfont-size: 12px;\n\t\tmargin-left: 15px;\n\t\tmargin-right: 5px;\n\t\tposition: static;\n\t}\n\n\t&:hover {\n\t\tcolor: $blue-medium;\n\t}\n}\n\n// Containers in the list of sites are larger\n.site-selector .site-action {\n\tpadding-top: 15px;\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site-selector/client/components/my-sites-navigation/client/components/my-sites-navigation/site-selector/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/site-selector/client/components/my-sites-navigation/client/scss/calypso-colors.scss","@charset \"UTF-8\";\n/**\n * The currently selected site block\n * at the top of the sidebar in My Sites\n */\n@keyframes appear {\n 0% {\n opacity: 0; }\n 100% {\n opacity: 1; } }\n\n.current-site {\n margin: 0 0 20px;\n padding: 0; }\n .current-site.is-loading .site-icon {\n animation: pulse-light 0.8s ease-in-out infinite; }\n .current-site.is-loading .site__title {\n color: #4f748e;\n line-height: 35px; }\n .current-site.is-loading .current-site__switch-sites {\n cursor: default; }\n .current-site.is-loading .current-site__switch-sites::before {\n visibility: hidden; }\n\n.current-site .site {\n box-shadow: 0 1px 0 rgba(46, 68, 83, 0.05); }\n\n.current-site__switch-sites,\n.current-site__add-new-wordpress {\n background-color: #f3f6f8;\n color: #4f748e;\n cursor: pointer;\n font-size: 10px;\n display: block;\n line-height: 1.8;\n margin-top: 1px;\n padding: 8px 0 8px 18px;\n text-transform: uppercase; }\n .current-site__switch-sites::before,\n .current-site__add-new-wordpress::before {\n font-size: 18px;\n content: \"\";\n vertical-align: top;\n text-align: center;\n display: inline-block;\n font-family: \"Noticons\";\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n line-height: 1;\n text-decoration: inherit;\n text-transform: none;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n speak: none;\n margin-right: 4px; }\n .current-site__switch-sites:hover,\n .current-site__add-new-wordpress:hover {\n background-color: #2e4453;\n color: white; }\n\n.current-site__add-new-wordpress::before {\n content: '\\f510';\n font-size: 13px;\n margin-right: 4px;\n margin-top: 1px; }\n\n.rtl .current-site__switch-sites:before {\n content: '\\f429'; }\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/current-site/style.scss","/**\n * The currently selected site block\n * at the top of the sidebar in My Sites\n */\n@import \"../../../scss/calypso-colors\";\n@import \"../../../scss/calypso-mixins\";\n\n.current-site {\n\tmargin: 0 0 20px;\n\tpadding: 0;\n\n\t&.is-loading {\n\t\t.site-icon {\n\t\t\tanimation: pulse-light 0.8s ease-in-out infinite;\n\t\t}\n\n\t\t.site__title {\n\t\t\tcolor: darken( $gray, 20% );\n\t\t\tline-height: 35px;\n\t\t}\n\n\t\t.current-site__switch-sites {\n\t\t\tcursor: default;\n\n\t\t\t&::before {\n\t\t\t\tvisibility: hidden;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.current-site .site {\n\tbox-shadow: 0 1px 0 rgba( $gray-dark, 0.05 );\n}\n\n.current-site__switch-sites,\n.current-site__add-new-wordpress {\n\tbackground-color: $gray-light;\n\tcolor: darken( $gray, 20% );\n\tcursor: pointer;\n\tfont-size: 10px;\n\tdisplay: block;\n\tline-height: 1.8;\n\tmargin-top: 1px;\n\tpadding: 8px 0 8px 18px;\n\ttext-transform: uppercase;\n\n\t&::before {\n\t\t@include noticon( '\\f430', 18px );\n\t\tmargin-right: 4px;\n\t}\n\n\t&:hover {\n\t\tbackground-color: $gray-dark;\n\t\tcolor: $white;\n\t}\n}\n\n.current-site__add-new-wordpress::before {\n\tcontent: '\\f510';\n\tfont-size: 13px;\n\tmargin-right: 4px;\n\tmargin-top: 1px;\n}\n\n.rtl .current-site__switch-sites {\n\t&:before {\n\t\tcontent: '\\f429';\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/components/my-sites-navigation/current-site/style.scss","$full-width:\t960px;\n$one-col:\t\t660px;\n$mobile:\t\t480px;\n\n$sidebar-width:\t269px;\n\n@mixin responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (max-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (max-width: $one-col) { @content; }\n\t}\n\t@else if $width == mobile {\n\t\t@media only screen and (max-width: $mobile) { @content; }\n\t}\n}\n\n@mixin mobile-first-responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (min-width: $one-col) { @content; }\n\t}\n\t@else if $width == full-width-really {\n\t\t@media only screen and (min-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (min-width: $mobile) { @content; }\n\t}\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n@mixin calc($property, $expression) {\n\t#{$property}: -moz-calc(#{$expression});\n\t#{$property}: -o-calc(#{$expression});\n\t#{$property}: -webkit-calc(#{$expression});\n\t#{$property}: calc(#{$expression});\n}\n\n@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n@mixin border-box {\n\t-moz-box-sizing: border-box;\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n}\n\n// Turn a list into a dropdown menu\n@mixin dropdown-menu {\n\tdisplay: none;\n\tbackground: $white;\n\tfloat: none;\n\tline-height: 46px;\n\tmin-width: 220px;\n\toverflow: visible;\n\tpadding: 0;\n\tposition: absolute;\n\twidth: auto;\n\tz-index: 1;\n\tbox-sizing: border-box;\n\tbox-shadow: 0 0 2px rgba(0,0,0,0.15), 0 3px 8px rgba(0,0,0,0.1);\n\n\t&:after {\n\t\tborder: 6px solid transparent;\n\t\tborder-bottom-color: $white;\n\t\tcontent: ' ';\n\t\theight: 0;\n\t\tposition: absolute;\n\t\t\ttop: -12px;\n\t\t\tleft: 73px;\n\t\twidth: 0;\n\t}\n\n\tli {\n\t\tdisplay: block;\n\t\tfloat: none;\n\n\t\ta,\n\t\ta.selected {\n\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\tcolor: $blue-wordpress;\n\t\t\tdisplay: block;\n\t\t\tfloat: none;\n\t\t\theight: auto;\n\t\t\tmargin: 0;\n\t\t\tpadding: 0 14px;\n\t\t\ttext-align: left;\n\n\t\t\t&:hover {\n\t\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\t\tbackground: none; // Remove inherited background color\n\t\t\t\tcolor: $link-highlight;\n\t\t\t\tbox-shadow: none; // Remove inherited box shadow\n\t\t\t}\n\t\t}\n\n\t\ta.selected {\n\t\t\tcolor: $gray-dark;\n\t\t}\n\n\t\t&:last-child a {\n\t\t\tborder-bottom: none; // Last child in the dropdown doesn't need a bottom border\n\t\t}\n\t}\n}\n\n// Can't use the @extend in a media query, use this instead\n@mixin clear-text {\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\n// courtesy: http://codeboxers.com/sass-mixin-for-transitions/\n@mixin transition($transition-property, $transition-time, $method) {\n\t-webkit-transition: $transition-property $transition-time $method;\n\t-moz-transition: $transition-property $transition-time $method;\n\t-ms-transition: $transition-property $transition-time $method;\n\t-o-transition: $transition-property $transition-time $method;\n\ttransition: $transition-property $transition-time $method;\n}\n\n@mixin box-shadow($shadows...) {\n\t-webkit-box-shadow: $shadows;\n\t-moz-box-shadow: $shadows;\n\t-ms-box-shadow: $shadows;\n\t-o-box-shadow: $shadows;\n\tbox-shadow: $shadows;\n}\n\n@mixin site-icon($size, $icon-size) {\n\tposition: relative;\n\tdisplay: inline-block;\n\twidth: $size;\n\theight: $size;\n\toverflow: hidden;\n\tbackground: lighten( $gray, 20% );\n\n\t&::before {\n\t\tcontent: '\\f475';\n\t\tdisplay: inline-block;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont: normal $icon-size/1 'Noticons';\n\t\tcolor: $white;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\theight: $size;\n\t\twidth: $size;\n\t\tline-height: $size;\n\t\ttext-align: center;\n\t\tz-index: 0;\n\t}\n\n\timg {\n\t\tbackground: $white;\n\t\tposition: relative;\n\t}\n}\n\n@mixin debug(){\n\tbox-shadow: 0px 0px 10px $alert-red inset;\n}\n\n@mixin stats-fade-text($toColor) {\n\tbackground-image: linear-gradient(to right, $transparent 0%, $toColor 90%);\n\tposition: absolute;\n\tz-index: 1;\n\tleft: -48px;\n\ttop: 0;\n\tbottom: 0;\n\tcontent: \"\";\n\tdisplay: block;\n\twidth: 48px;\n}\n\n@mixin hide-content-accessibly {\n\tclip: rect( 1px, 1px, 1px, 1px );\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twidth: 1px;\n}\n\n// Creates a fading overlay to signify that the content is longer\n// than the space allows.\n@mixin long-content-fade( $direction: right, $size: 20%, $color: #fff, $edge: 0px, $z-index: false) {\n\tcontent: '';\n\tdisplay: block;\n\tposition: absolute;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-khtml-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\n\t@if $z-index {\n\t\tz-index: $z-index;\n\t}\n\n\t@if $direction == 'bottom' {\n\t\tbackground: linear-gradient( to top, rgba( $color, 0 ), $color 90% );\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\ttop: $edge;\n\t\tbottom: calc(100% - $size);\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'top' {\n\t\tbackground: linear-gradient( to bottom, rgba( $color, 0 ), $color 90% );\n\t\ttop: calc(100% - $size);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\tbottom: $edge;\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'left'{\n\t\tbackground: linear-gradient( to left, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tleft: $edge;\n\t\tbottom: $edge;\n\t\tright: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n\n\t@if $direction == 'right' {\n\t\tbackground: linear-gradient( to right, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tbottom: $edge;\n\t\tright: $edge;\n\t\tleft: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n}\n\n@mixin placeholder( $lighten-percentage: 30% ) {\n\tanimation: loading-fade 1.6s ease-in-out infinite;\n\tbackground-color: lighten( $gray, $lighten-percentage );\n\tcolor: transparent;\n\n\t&:after {\n\t\tcontent: '\\00a0';\n\t}\n}\n\n// Simple animation to make elements appear\n@keyframes appear {\n\t0% {\n\t\topacity: 0;\n\t}\n\t100% {\n\t\topacity: 1;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/current-site/client/components/my-sites-navigation/client/scss/calypso-colors.scss","@charset \"UTF-8\";\n/**\n * The main navigation Sidebar\n */\n@keyframes appear {\n 0% {\n opacity: 0; }\n 100% {\n opacity: 1; } }\n\n.sidebar {\n font-size: 13px;\n position: relative;\n margin: 0;\n z-index: 10;\n list-style-type: none; }\n .sidebar .noticon-external {\n color: #87a6bc;\n font-size: 16px;\n align-self: flex-end; }\n\n.sidebar .sidebar-menu {\n clear: both;\n margin: 0 0 16px;\n overflow: hidden;\n padding: 0; }\n @media only screen and (max-width: 660px) {\n .sidebar .sidebar-menu {\n margin-top: 0; } }\n .sidebar .sidebar-menu:first-child {\n margin-top: 0; }\n\n.sidebar .sidebar-menu ul {\n list-style: none;\n margin: 0; }\n\n.sidebar .sidebar-menu li {\n position: relative;\n display: flex;\n align-items: center; }\n\n/**\n * Sidebar links\n */\n.sidebar .sidebar-menu a {\n border-radius: 2px;\n color: #2e4453;\n border: none;\n display: block;\n padding: 12px 16px;\n text-decoration: none;\n display: flex;\n justify-content: space-between;\n box-sizing: border-box; }\n .sidebar .sidebar-menu a:focus {\n outline: none; }\n .sidebar .sidebar-menu a:first-child {\n flex: 1 0 auto;\n width: 0; }\n .sidebar .sidebar-menu a:first-child::before {\n font-size: 16px;\n content: \"\";\n vertical-align: top;\n text-align: center;\n display: inline-block;\n font-family: \"Noticons\";\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n line-height: 1;\n text-decoration: inherit;\n text-transform: none;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n speak: none;\n min-width: 18px;\n color: #87a6bc;\n margin-right: 14px; }\n .sidebar .sidebar-menu a .menu-link-text {\n display: block;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex: 1 0 auto;\n width: 0;\n line-height: 16px; }\n .sidebar .sidebar-menu a.add-new {\n background-color: #f3f6f8;\n border-radius: 2px;\n color: #87a6bc;\n font-size: 10px;\n padding: 4px 10px;\n margin-right: 10px;\n align-self: center; }\n .sidebar .sidebar-menu a.add-new::before {\n display: none; }\n\n.sidebar .sidebar-menu .selected {\n background-color: #00aadc; }\n .sidebar .sidebar-menu .selected a {\n color: white; }\n .sidebar .sidebar-menu .selected a:first-child:before {\n color: white; }\n .sidebar .sidebar-menu .selected a.add-new {\n background: white;\n color: #00aadc; }\n\n/*rtl:ignore*/\n.rtl .sidebar > .sidebar-menu .action.new:before {\n margin: 10px -58% 0 0; }\n\n.sidebar-heading {\n color: #87a6bc;\n font-size: 11px;\n display: inline-block;\n margin-bottom: 8px;\n padding: 0 8px 0 0;\n position: relative;\n text-transform: uppercase;\n vertical-align: top; }\n .sidebar-heading:after {\n border-top: 1px solid #c8d7e1;\n content: '';\n display: block;\n position: absolute;\n left: 100%;\n top: 8px;\n width: 240px;\n width: 100vw; }\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/navigation/style.scss","/**\n * The main navigation Sidebar\n */\n\n@import \"../../../scss/calypso-colors\";\n@import \"../../../scss/calypso-mixins\";\n\n.sidebar {\n\tfont-size: 13px;\n\tposition: relative;\n\tmargin: 0;\n\tz-index: 10;\n\tlist-style-type: none;\n\n\t.noticon-external {\n\t\tcolor: $gray;\n\t\tfont-size: 16px;\n\t\talign-self: flex-end;\n\t}\n}\n\n.sidebar .sidebar-menu {\n\tclear: both;\n\tmargin: 0 0 16px;\n\toverflow: hidden;\n\tpadding: 0;\n\n\t@include responsive( one-col ) {\n\t\tmargin-top: 0;\t// Collapse margins between sections for mobile\n\t}\n\n\t// Remove the inherited top margin on the first grouping in the sidebar, so it aligns with the filter bar\n\t&:first-child {\n\t\tmargin-top: 0;\n\t}\n}\n\n// Sidebar lists\n.sidebar .sidebar-menu ul {\n\tlist-style: none;\n\tmargin: 0;\n}\n\n.sidebar .sidebar-menu li {\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: center;\n}\n\n/**\n * Sidebar links\n */\n.sidebar .sidebar-menu a {\n\tborder-radius: 2px;\n\tcolor: $gray-dark;\n\tborder: none;\n\tdisplay: block;\n\tpadding: 12px 16px;\n\ttext-decoration: none;\n\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tbox-sizing: border-box;\n\n\t&:focus {\n\t\toutline: none;\n\t}\n\n\t&:first-child {\n\t\tflex: 1 0 auto;\n\t\twidth: 0; // Firefox needs explicit width (even 0)\n\t\t&::before {\n\t\t\t@include noticon( '\\f475', 16px );\n\t\t\tmin-width: 18px;\n\t\t\tcolor: $gray;\n\t\t\tmargin-right: 14px;\n\t\t}\n\t}\n\n\t.menu-link-text {\n\t\tdisplay: block;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t\tflex: 1 0 auto;\n\t\twidth: 0; // Firefox needs explicit width (even 0)\n\t\tline-height: 16px;\n\t}\n\n\t&.add-new {\n\t\tbackground-color: $gray-light;\n\t\tborder-radius: 2px;\n\t\tcolor: $gray;\n\t\tfont-size: 10px;\n\t\tpadding: 4px 10px;\n\t\tmargin-right: 10px;\n\t\talign-self: center;\n\n\t\t&::before {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n\n// Currently selected sidebar item\n.sidebar .sidebar-menu .selected {\n\tbackground-color: $blue-medium;\n\n\ta {\n\t\tcolor: $white;\n\t\t&:first-child {\n\t\t\t&:before {\n\t\t\t\tcolor: $white;\n\t\t\t}\n\t\t}\n\t\t&.add-new {\n\t\t\tbackground: $white;\n\t\t\tcolor: $blue-medium;\n\t\t}\n\t}\n}\n\n// note: for some reason the noflip content was moved around when nested\n// inside the .sidebar stuff above\n/*rtl:ignore*/\n.rtl .sidebar > .sidebar-menu .action.new:before {\n\tmargin: 10px -58% 0 0;\n}\n\n.sidebar-heading {\n\tcolor: $gray;\n\tfont-size: 11px;\n\tdisplay: inline-block;\n\tmargin-bottom: 8px;\n\tpadding: 0 8px 0 0;\n\tposition: relative;\n\ttext-transform: uppercase;\n\tvertical-align: top;\n\n\t&:after {\n\t\tborder-top: 1px solid lighten( $gray, 20% );\n\t\tcontent: '';\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\t\tleft: 100%;\n\t\t\ttop: 8px;\n\t\twidth: 240px;\n\t\twidth: 100vw;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/components/my-sites-navigation/navigation/style.scss","$full-width:\t960px;\n$one-col:\t\t660px;\n$mobile:\t\t480px;\n\n$sidebar-width:\t269px;\n\n@mixin responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (max-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (max-width: $one-col) { @content; }\n\t}\n\t@else if $width == mobile {\n\t\t@media only screen and (max-width: $mobile) { @content; }\n\t}\n}\n\n@mixin mobile-first-responsive($width) {\n\t@if $width == full-width {\n\t\t@media only screen and (min-width: $one-col) { @content; }\n\t}\n\t@else if $width == full-width-really {\n\t\t@media only screen and (min-width: $full-width) { @content; }\n\t}\n\t@else if $width == one-col {\n\t\t@media only screen and (min-width: $mobile) { @content; }\n\t}\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n@mixin calc($property, $expression) {\n\t#{$property}: -moz-calc(#{$expression});\n\t#{$property}: -o-calc(#{$expression});\n\t#{$property}: -webkit-calc(#{$expression});\n\t#{$property}: calc(#{$expression});\n}\n\n@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n@mixin border-box {\n\t-moz-box-sizing: border-box;\n\t-webkit-box-sizing: border-box;\n\tbox-sizing: border-box;\n}\n\n// Turn a list into a dropdown menu\n@mixin dropdown-menu {\n\tdisplay: none;\n\tbackground: $white;\n\tfloat: none;\n\tline-height: 46px;\n\tmin-width: 220px;\n\toverflow: visible;\n\tpadding: 0;\n\tposition: absolute;\n\twidth: auto;\n\tz-index: 1;\n\tbox-sizing: border-box;\n\tbox-shadow: 0 0 2px rgba(0,0,0,0.15), 0 3px 8px rgba(0,0,0,0.1);\n\n\t&:after {\n\t\tborder: 6px solid transparent;\n\t\tborder-bottom-color: $white;\n\t\tcontent: ' ';\n\t\theight: 0;\n\t\tposition: absolute;\n\t\t\ttop: -12px;\n\t\t\tleft: 73px;\n\t\twidth: 0;\n\t}\n\n\tli {\n\t\tdisplay: block;\n\t\tfloat: none;\n\n\t\ta,\n\t\ta.selected {\n\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\tcolor: $blue-wordpress;\n\t\t\tdisplay: block;\n\t\t\tfloat: none;\n\t\t\theight: auto;\n\t\t\tmargin: 0;\n\t\t\tpadding: 0 14px;\n\t\t\ttext-align: left;\n\n\t\t\t&:hover {\n\t\t\t\tborder-bottom: 1px solid rgba(0,0,0,0.1);\n\t\t\t\tbackground: none; // Remove inherited background color\n\t\t\t\tcolor: $link-highlight;\n\t\t\t\tbox-shadow: none; // Remove inherited box shadow\n\t\t\t}\n\t\t}\n\n\t\ta.selected {\n\t\t\tcolor: $gray-dark;\n\t\t}\n\n\t\t&:last-child a {\n\t\t\tborder-bottom: none; // Last child in the dropdown doesn't need a bottom border\n\t\t}\n\t}\n}\n\n// Can't use the @extend in a media query, use this instead\n@mixin clear-text {\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\n// courtesy: http://codeboxers.com/sass-mixin-for-transitions/\n@mixin transition($transition-property, $transition-time, $method) {\n\t-webkit-transition: $transition-property $transition-time $method;\n\t-moz-transition: $transition-property $transition-time $method;\n\t-ms-transition: $transition-property $transition-time $method;\n\t-o-transition: $transition-property $transition-time $method;\n\ttransition: $transition-property $transition-time $method;\n}\n\n@mixin box-shadow($shadows...) {\n\t-webkit-box-shadow: $shadows;\n\t-moz-box-shadow: $shadows;\n\t-ms-box-shadow: $shadows;\n\t-o-box-shadow: $shadows;\n\tbox-shadow: $shadows;\n}\n\n@mixin site-icon($size, $icon-size) {\n\tposition: relative;\n\tdisplay: inline-block;\n\twidth: $size;\n\theight: $size;\n\toverflow: hidden;\n\tbackground: lighten( $gray, 20% );\n\n\t&::before {\n\t\tcontent: '\\f475';\n\t\tdisplay: inline-block;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont: normal $icon-size/1 'Noticons';\n\t\tcolor: $white;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\theight: $size;\n\t\twidth: $size;\n\t\tline-height: $size;\n\t\ttext-align: center;\n\t\tz-index: 0;\n\t}\n\n\timg {\n\t\tbackground: $white;\n\t\tposition: relative;\n\t}\n}\n\n@mixin debug(){\n\tbox-shadow: 0px 0px 10px $alert-red inset;\n}\n\n@mixin stats-fade-text($toColor) {\n\tbackground-image: linear-gradient(to right, $transparent 0%, $toColor 90%);\n\tposition: absolute;\n\tz-index: 1;\n\tleft: -48px;\n\ttop: 0;\n\tbottom: 0;\n\tcontent: \"\";\n\tdisplay: block;\n\twidth: 48px;\n}\n\n@mixin hide-content-accessibly {\n\tclip: rect( 1px, 1px, 1px, 1px );\n\theight: 1px;\n\toverflow: hidden;\n\tposition: absolute;\n\twidth: 1px;\n}\n\n// Creates a fading overlay to signify that the content is longer\n// than the space allows.\n@mixin long-content-fade( $direction: right, $size: 20%, $color: #fff, $edge: 0px, $z-index: false) {\n\tcontent: '';\n\tdisplay: block;\n\tposition: absolute;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-khtml-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\n\t@if $z-index {\n\t\tz-index: $z-index;\n\t}\n\n\t@if $direction == 'bottom' {\n\t\tbackground: linear-gradient( to top, rgba( $color, 0 ), $color 90% );\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\ttop: $edge;\n\t\tbottom: calc(100% - $size);\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'top' {\n\t\tbackground: linear-gradient( to bottom, rgba( $color, 0 ), $color 90% );\n\t\ttop: calc(100% - $size);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\tbottom: $edge;\n\t\twidth: auto;\n\t}\n\n\t@if $direction == 'left'{\n\t\tbackground: linear-gradient( to left, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tleft: $edge;\n\t\tbottom: $edge;\n\t\tright: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n\n\t@if $direction == 'right' {\n\t\tbackground: linear-gradient( to right, rgba( $color, 0 ), $color 90% );\n\t\ttop: $edge;\n\t\tbottom: $edge;\n\t\tright: $edge;\n\t\tleft: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n}\n\n@mixin placeholder( $lighten-percentage: 30% ) {\n\tanimation: loading-fade 1.6s ease-in-out infinite;\n\tbackground-color: lighten( $gray, $lighten-percentage );\n\tcolor: transparent;\n\n\t&:after {\n\t\tcontent: '\\00a0';\n\t}\n}\n\n// Simple animation to make elements appear\n@keyframes appear {\n\t0% {\n\t\topacity: 0;\n\t}\n\t100% {\n\t\topacity: 1;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/scss/calypso-mixins.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/navigation/client/components/my-sites-navigation/client/scss/calypso-colors.scss","/**\n * Navigation animation\n * @component `MySitesNavigation`\n */\n\n.sites-navigation {\n\tposition: relative;\n\n\t.sites-list,\n\t.navigation-sidebar {\n\t\ttransition: all 0.15s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.2s linear;\n\t\topacity: 1;\n\t\tposition: absolute;\n\t\ttop: 1px;\n\t\tleft: 1px;\n\t\tright: 1px;\n\t\tbottom: 0;\n\t}\n\n\t.sites-list,\n\t&.focus-sites .navigation-sidebar {\n\t\ttransform: translate3d(-100%, 0, 0);\n\t\topacity: 0;\n\t}\n\n\t.navigation-sidebar,\n\t&.focus-sites .sites-list {\n\t\ttransform: translate3d(0, 0, 0);\n\t\topacity: 1;\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/my-sites-navigation/client/components/client/components/my-sites-navigation/style.scss","@mixin col {\n\twidth: 50%;\n\t@media all and (max-width: 590px) {\n\t\twidth: 100%;\n\t\tfloat: none;\n\t}\n}\n\n.dops-col-right { \n\t@include col;\n\tfloat: right;\n}\n\n.dops-col-left {\n\t@include col;\n\tfloat: left;\n\tpadding-right: 10px;\n\t@media all and (max-width: 590px) {\n\t\tpadding-right: 0;\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/col/client/components/client/components/col/style.scss","@import '../../scss/layout';\n@import '../../scss/calypso-colors';\n\n/* This hack is used to prevent the body from scrolling when the modal is showing */\nbody.dops-modal-showing {\n\toverflow: hidden;\n position: fixed;\n}\n\n.dops-modal-wrapper {\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\tbottom: 0;\n\tleft: 0;\n\tz-index: 1050;\n\tdisplay: block;\n\toverflow-x: hidden;\n\toverflow-y: auto;\n\ttext-align: center;\n\t-webkit-overflow-scrolling: touch;\n\toutline: 0;\n\ttransition: opacity .15s linear;\n\tbackground-color: rgba(0, 0, 0, 0.5);\n\tcursor: pointer;\n\n\t&:before {\n\t\tcontent: '';\n\t\tdisplay: inline-block;\n\t\theight: 100%;\n\t\tvertical-align: middle;\n\t}\n\n\t.dops-modal {\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t\tmargin: 0 0;\n\t\twidth: 100%;\n\t\tmax-width: 550px;\n\t\tvertical-align: middle;\n\t\ttext-align: left;\n\t\tbackground-color: #fff;\n\t\ttransition: all 0.5s;\n\t\tz-index: 100;\n\t\tclear: both;\n\t\tcursor: default;\n\n\t\t@include breakpoint( \">480px\" ) {\n\t\t\tmargin: 0 auto;\n\t\t\theight: auto;\n\t\t\tborder-radius: 5px;\n\t\t\tbox-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);\n\t\t}\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/modal/client/components/client/components/modal/style.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/modal/client/components/client/scss/layout.scss",".gridicon {\n\tfill: currentColor;\n\n\t&.needs-offset g {\n\t\ttransform: translate( 1px, 1px );\t/* translates to .5px because it's in a child element */\n\t}\n\n\t&.needs-offset-x g {\n\t\ttransform: translate( 1px, 0 );\t\t/* only nudges horizontally */\n\t}\n\n\t&.needs-offset-y g {\n\t\ttransform: translate( 0, 1px );\t\t/* only nudges vertically */\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/gridicon/client/components/client/components/gridicon/style.scss","\n:local .screen-reader-text {\n\tclip: rect(1px, 1px, 1px, 1px);\n\tposition: absolute !important;\n\theight: 1px;\n\twidth: 1px;\n\toverflow: hidden;\n\n\t&:focus {\n\t\tbackground-color: white;\n\t\tborder-radius: 3px;\n\t\tbox-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);\n\t\tclip: auto !important;\n\t\tcolor: #666;\n\t\tdisplay: block;\n\t\tfont-size: 0.875em;\n\t\tfont-weight: bold;\n\t\theight: auto;\n\t\tleft: 5px;\n\t\tline-height: normal;\n\t\tpadding: 15px 23px 14px;\n\t\ttext-decoration: none;\n\t\ttop: 5px;\n\t\twidth: auto;\n\t\tz-index: 100000; /* Above WP toolbar. */\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/screen-reader-text/client/components/client/components/screen-reader-text/style.scss","@import \"../../scss/calypso-colors\";\n@import '../../scss/akismet-colors';\n\n.dops-password-box {\n\tposition: relative;\n\n\t.dops-text-input {\n\t\tmargin: 0;\n\t\tpadding: 7px 14px;\n\t\twidth: 100%;\n\t\tcolor: $gray-dark;\n\t\tfont-size: 16px;\n\t\tline-height: 1.5;\n\t\tborder: 1px solid lighten( $gray, 20% );\n\t\tbackground-color: $white;\n\t\ttransition: all .15s ease-in-out;\n\t\tbox-sizing: border-box;\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\tpadding-right: 32px;\n\n\t\t&::placeholder {\n\t\t\tcolor: $gray;\n\t\t}\n\n\t\t&:hover {\n\t\t\tborder-color: lighten( $gray, 10% );\n\t\t}\n\n\t\t&:focus {\n\t\t\tborder-color: $blue-wordpress;\n\t\t\toutline: none;\n\t\t\tbox-shadow: 0 0 0 2px $blue-light;\n\n\t\t\t&::-ms-clear {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\n\t\t&:disabled {\n\t\t\tbackground: $gray-light;\n\t\t\tborder-color: lighten( $gray, 30% );\n\t\t\tcolor: lighten( $gray, 10% );\n\n\t\t\t&:hover {\n\t\t\t\tcursor: default;\n\t\t\t}\n\n\t\t\t&::placeholder {\n\t\t\t\tcolor: lighten( $gray, 10% );\n\t\t\t}\n\t\t}\n\t}\n\n\t&.dops-password-box--hidden .dops-text-input {\n\t\tcolor: darken( $gray, 5% );\n\t}\n\n\t.dops-password-box__toggle-visibility {\n\t\tdisplay: block;\n\t\tcursor: pointer;\n\t\tposition: absolute;\n\t\tright: 8px #{\"/*rtl:ignore*/\"};\n\t\ttop: 8px;\n\t\tuser-select: none;\n\n\t\t.gridicon {\n\t\t\tfill: darken( $gray, 10% );\n\n\t\t\t&:hover {\n\t\t\t\tfill: darken( $gray, 10% );\n\t\t\t}\n\t\t}\n\n\t\t&:focus .gridicon {\n\t\t\toutline: 1px dotted darken( $gray, 10% );\n\t\t}\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/password-box/client/components/client/components/password-box/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/password-box/client/components/client/scss/calypso-colors.scss","@import '../../scss/layout';\n@import '../../scss/typography';\n@import '../../scss/calypso-colors';\n@import '../../scss/rem';\n\n$title: #f9f9f9;\n$meta: #AAAAAA;\n$border: #DDDDDD;\n$section-border: #DDDDDD;\n\n/* Card */\n\n.dops-card {\n\tposition: relative;\n\tmargin: 0 auto rem( 10px ) auto;\n\tpadding: rem( 16px );\n\tbox-sizing: border-box;\n\tbackground: $white;\n\tbox-shadow: 0 0 0 1px transparentize( lighten( $gray, 20% ), .5 ),\n\t\t0 1px 2px lighten( $gray, 30% );\n\n\t@include clear-fix;\n\n\t@include breakpoint( \">480px\" ) {\n\t\tmargin-bottom: rem( 16px );\n\t\tpadding: rem( 24px );\n\t}\n\n\t// Compact Card\n\t&.is-compact {\n\t\tmargin-bottom: 1px;\n\n\t\t@include breakpoint( \">480px\" ) {\n\t\t\tmargin-bottom: 1px;\n\t\t\tpadding: rem( 16px ) rem( 24px );\n\t\t}\n\t}\n}\n\n// TODO: remove this from Card\n.dops-card-title {\n\tbackground-color: $title;\n\tcolor: black;\n\tfont-family: $sans;\n\tfont-size: 12px;\n\tfont-weight: normal;\n\ttext-transform: uppercase;\n\tborder-bottom: 1px solid $border;\n\tpadding: 10px 16px;\n\tmargin: 0;\n\n\t@include breakpoint( \">480px\" ) {\n\t\tpadding: 16px 24px;\n\t}\n\n\t.dops-card-meta {\n\t\tcolor: $meta;\n\t\tfloat: right;\n\t}\n}\n\n// Section\n.dops-card-section {\n\t@include clear-fix;\n\tfont-size: 14px;\n\n\tpadding: 16px;\n\n\t@include breakpoint( \">480px\" ) {\n\t\tpadding: 24px;\n\t}\n\n\tborder-bottom: 1px solid $section-border;\n\t&:last-child {\n\t\tborder-bottom: none;\n\t}\n\n\t.dops-card-section-label {\n\t\tcolor: black;\n\t\tfont-size: 12px;\n\t\tfont-weight: normal;\n\t\ttext-transform: uppercase;\n\t}\n\n\t.dops-card-section-orient-vertical {\n\t\t.dops-card-section-label {\n\t\t\tmargin-bottom: 10px;\n\t\t}\n\t}\n\n\t.dops-card-section-orient-horizontal {\n\t\t.dops-card-section-label {\n\t\t\tfloat: left;\n\t\t\twidth: 30%;\n\t\t\t@media all and ( max-width: 590px ) {\n\t\t\t\tmargin-bottom: 10px;\n\t\t\t\tfloat: none;\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t}\n\n\t\t.dops-card-section-content {\n\t\t\tfloat: right;\n\t\t\twidth: 70%;\n\t\t\t@media all and ( max-width: 590px ) {\n\t\t\t\tfloat: none;\n\t\t\t\twidth: 100%;\n\t\t\t}\n\t\t}\n\t}\n}\n\n\n// Footer\n.dops-card-footer {\n\tbackground: #f9f9f9;\n\tpadding: 15px 20px;\n}\n\n\n// Icon\n.dops-card-icon {\n\tfloat: right;\n\ttext-transform: capitalize;\n\n\t.genericon {\n\t\tborder-radius: 50%;\n\t\twidth: 16px;\n\t\theight: 16px;\n\t\tmargin-right: 10px;\n\t\tcolor: #fff;\n\t\tbackground: #81bf16;\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/card/client/components/client/components/card/style.scss","\n// ======================================================================\n// Rem function\n//\n// Convert px to rem in a readable fashion.\n//\n// Example: font-size: rem( 21px );\n// ======================================================================\n\n$root-font-size: 16px;\n\n@function rem( $pixels, $context: $root-font-size ) {\n\t@return $pixels / $context * 1rem;\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/card/client/components/client/scss/rem.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/card/client/components/client/scss/calypso-colors.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/card/client/components/client/scss/layout.scss","// ==========================================================================\n// TYPOGRAPHY\n// ==========================================================================\n\n$root-font-size: 16; // In pixels\n\n$normal: 400; // Change these values when using custom fonts\n$bold: 700; // For example, bold could change to 400;\n\n// Typefaces\n$monospace: Monaco, Consolas, 'courier new', \"Andale Mono\", monospace;\n$serif: Georgia, \"Times New Roman\", Times, serif;\n$sans: Helvetica, Arial, sans-serif;\n$open-sans: 'Open Sans', $sans; // 300 400 400i 600 700 700i 800\n$merriweather: 'Merriweather', $serif; // 900 700\n$calluna: \"calluna-1\",\"calluna-2\", Georgia, \"Times New Roman\", Times, serif;\n$helvetica: \"Helvetica Neue\", $sans;\n$helvetica-ultralight: HelveticaNeue-UltraLight, 'Helvetica Neue UltraLight', 'Helvetica Neue', $sans;\n$helvetica-light: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', $sans;\n$arial: Arial, Helvetica, Sans-serif;\n$gill-sans: \"Gill Sans\", \"Gill Sans MT\", \"Trebuchet MS\", $sans;\n\n// Icons\n$genericons: 'Genericons', Arial, sans-serif;\n$dashicons: 'Dashicons', Arial, sans-serif;\n$noticons: 'Noticons', Arial, sans-serif;\n$automatticons: 'automatticons', Arial, sans-serif;\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/card/client/components/client/scss/typography.scss","@import '../../scss/typography';\n\n.genericon {\n\t\n\t.dops-hovericon {\n\t\tdisplay: none;\n\t\tfont-size: 12px;\n\t\tfont-family: $sans;\n\t\tpadding: 5px 5px 8px;\n\t\tposition: absolute;\n\t\tleft: 0px;\n\t\ttop: 100%;\n\t\tz-index: 999;\n\n\t\t&.dops-hovericon-light {\n\t\t\tborder-radius: 3px;\n\t\t\tbox-shadow: 5px 5px 5px rgba(0,0,0,0.3);\n\t\t\tborder: 1px solid #bbb;\n\t\t\tbackground-color: #fff;\n\t\t\tcolor: #000;\n\t\t}\n\n\t\t&.dops-hovericon-dark {\n\t\t\tborder-radius: 3px;\n\t\t\tbackground: rgba( 0, 0, 0, 0.9 );\n\t\t\tcolor: #fff;\n\t\t}\n\t}\n\n\t&:hover {\n\t\t.dops-hovericon {\n\t\t\tdisplay: block;\n\t\t}\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/hover-icon/client/components/client/components/hover-icon/style.scss","// ==========================================================================\n// TYPOGRAPHY\n// ==========================================================================\n\n$root-font-size: 16; // In pixels\n\n$normal: 400; // Change these values when using custom fonts\n$bold: 700; // For example, bold could change to 400;\n\n// Typefaces\n$monospace: Monaco, Consolas, 'courier new', \"Andale Mono\", monospace;\n$serif: Georgia, \"Times New Roman\", Times, serif;\n$sans: Helvetica, Arial, sans-serif;\n$open-sans: 'Open Sans', $sans; // 300 400 400i 600 700 700i 800\n$merriweather: 'Merriweather', $serif; // 900 700\n$calluna: \"calluna-1\",\"calluna-2\", Georgia, \"Times New Roman\", Times, serif;\n$helvetica: \"Helvetica Neue\", $sans;\n$helvetica-ultralight: HelveticaNeue-UltraLight, 'Helvetica Neue UltraLight', 'Helvetica Neue', $sans;\n$helvetica-light: HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', $sans;\n$arial: Arial, Helvetica, Sans-serif;\n$gill-sans: \"Gill Sans\", \"Gill Sans MT\", \"Trebuchet MS\", $sans;\n\n// Icons\n$genericons: 'Genericons', Arial, sans-serif;\n$dashicons: 'Dashicons', Arial, sans-serif;\n$noticons: 'Noticons', Arial, sans-serif;\n$automatticons: 'automatticons', Arial, sans-serif;\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/hover-icon/client/components/client/scss/typography.scss",".slideDown-enter {\n\toverflow-y: hidden;\n\tmax-height: 0px;\n\ttransition: all .5s ease-out;\n}\n\n.slideDown-enter-active {\n\toverflow-y: hidden;\n\tmax-height: 400px;\n}\n\n.slideDown-leave {\n\toverflow-y: hidden;\n\tmax-height: 400px;\n\ttransition: all .5s ease-out;\t\n}\n\n.slideDown-leave-active {\n\toverflow-y: hidden;\n\tmax-height: 0px;\n}\n\n/**\n * Slide across right-to-left\n */\n\n.slideRTL-enter {\n\ttransform: translateX(100%);\n\ttransition: all .2s linear;\n}\n\n.slideRTL-enter-active {\n\ttransform: translateX(0%);\n}\n\n.slideRTL-leave {\n\tposition: absolute;\n\topacity: 1;\n\ttransition: all .2s linear;\n}\n\n.slideRTL-leave-active {\n\topacity: 0;\n}\n\n/**\n * Slide across left-to-right\n */\n\n.slideLTR-enter {\n\ttransform: translateX(-100%);\n\ttransition: all .2s linear;\n}\n\n.slideLTR-enter-active {\n\ttransform: translateX(0%);\n}\n\n.slideLTR-leave {\n\tposition: absolute;\n\topacity: 1;\n\ttransition: all .2s linear;\n}\n\n.slideLTR-leave-active {\n\topacity: 0;\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/wizard/client/components/client/scss/animation.scss","@import \"../../scss/calypso-colors\";\n@import \"../../scss/color-functions\";\n\n// ==========================================================================\n// Buttons\n// ==========================================================================\n\n.dops-button {\n\tbackground: $white;\n\tborder-color: lighten( $gray, 20% );\n\tborder-style: solid;\n\tborder-width: 1px 1px 2px;\n\tcolor: $gray-dark;\n\tcursor: pointer;\n\tdisplay: inline-block;\n\tmargin: 0;\n\toutline: 0;\n\toverflow: hidden;\n\tfont-size: 14px;\n\tfont-weight: 500;\n\ttext-overflow: ellipsis;\n\ttext-decoration: none;\n\tvertical-align: top;\n\tbox-sizing: border-box;\n\tfont-size: 14px;\n\tline-height: 21px;\n\tborder-radius: 4px;\n\tpadding: 7px 14px 9px;\n\t-webkit-appearance: none;\n\tappearance: none;\n\n\t&:hover {\n\t\tborder-color: lighten( $gray, 10% );\n\t\tcolor: $gray-dark;\n\t}\n\t&:active {\n\t\tborder-width: 2px 1px 1px;\n\t}\n\t&:visited {\n\t\tcolor: $gray-dark;\n\t}\n\t&[disabled],\n\t&:disabled {\n\t\tcolor: lighten( $gray, 30% );\n\t\tbackground: $white;\n\t\tborder-color: lighten( $gray, 30% );\n\t\tcursor: default;\n\n\t\t&:active {\n\t\t\tborder-width: 1px 1px 2px;\n\t\t}\n\t}\n\t&:focus {\n\t\toutline: 0;\n\t\tborder-color: $blue-medium;\n\t\tbox-shadow: 0 0 0 2px $blue-light;\n\t}\n\t&.is-compact {\n\t\tpadding: 7px;\n\t\tcolor: darken( $gray, 10% );\n\t\tfont-size: 11px;\n\t\tline-height: 1;\n\t\ttext-transform: uppercase;\n\n\t\t&:disabled {\n\t\t\tcolor: lighten( $gray, 30% );\n\t\t}\n\t\t.gridicon {\n\t\t\ttop: 4px;\n\t\t\tmargin-top: -8px;\n\t\t}\n\t\t// Make the left margin of the small plus icon visually less huge\n\t\t.gridicons-plus-small {\n\t\t\tmargin-left: -4px;\n\t\t}\n\t\t// Reset the left margin if the button contains only the plus icon\n\t\t.gridicons-plus-small:last-of-type {\n\t\t\tmargin-left: 0;\n\t\t}\n\t\t// Make plus icon nudged closer to adjacent icons for add-people and add-plugin type buttons\n\t\t.gridicons-plus-small + .gridicon {\n\t\t\tmargin-left: -4px;\n\t\t}\n\t}\n\t&.hidden {\n\t\tdisplay: none;\n\t}\n\t.gridicon {\n\t\tposition: relative;\n\t\t\ttop: 4px;\n\t\tmargin-top: -2px;\n\t\twidth: 18px;\n\t\theight: 18px;\n\t}\n}\n\n// Primary buttons\n.dops-button.is-primary {\n\tbackground: $blue-medium;\n\tborder-color: $blue-wordpress;\n\tcolor: $white;\n\n\t&:hover,\n\t&:focus {\n\t\tborder-color: $blue-dark;\n\t\tcolor: $white;\n\t}\n\t&[disabled],\n\t&:disabled {\n\t\tbackground: tint( $blue-light, 50% );\n\t\tborder-color: tint( $blue-wordpress, 55% );\n\t\tcolor: $white;\n\t}\n\t&.is-compact {\n\t\tcolor: $white;\n\t}\n}\n\n// Scary buttons\n.dops-button.is-scary {\n\tcolor: $alert-red;\n\n\t&:hover,\n\t&:focus {\n\t\tborder-color: $alert-red;\n\t}\n\t&:focus {\n\t\tbox-shadow: 0 0 0 2px lighten( $alert-red, 20% );\n\t}\n\t&[disabled],\n\t&:disabled {\n\t\tcolor: lighten( $alert-red, 30% );\n\t\tborder-color: lighten( $gray, 30% );\n\t}\n}\n\n.dops-button.is-primary.is-scary {\n\tbackground: $alert-red;\n\tborder-color: darken( $alert-red, 20% );\n\tcolor: $white;\n\n\t&:hover,\n\t&:focus {\n\t\tborder-color: darken( $alert-red, 40% );\n\t}\n\t&[disabled],\n\t&:disabled {\n\t\tbackground: lighten( $alert-red, 20% );\n\t\tborder-color: tint( $alert-red, 30% );\n\t}\n}\n\n.dops-button.is-borderless {\n\tborder: none;\n\tcolor: darken( $gray, 10% );\n\tpadding-left: 0;\n\tpadding-right: 0;\n\n\t&:hover {\n\t\tcolor: $gray-dark;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: none;\n\t}\n\n\t.gridicon {\n\t\twidth: 24px;\n\t\theight: 24px;\n\t\ttop: 6px;\n\t}\n\n\t&[disabled],\n\t&:disabled {\n\t\tcolor: lighten( $gray, 30% );\n\t\tbackground: $white;\n\t\tcursor: default;\n\n\t\t&:active {\n\t\t\tborder-width: 0;\n\t\t}\n\t}\n\t&.is-scary {\n\t\tcolor: $alert-red;\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\tcolor: darken( $alert-red, 20% );\n\t\t}\n\n\t\t&[disabled] {\n\t\t\tcolor: lighten( $alert-red, 30% );\n\t\t}\n\t}\n\n\t&.is-compact {\n\t\tbackground: transparent;\n\t\tborder-radius: 0;\n\t\t.gridicon {\n\t\t\twidth: 18px;\n\t\t\theight: 18px;\n\t\t\ttop: 5px;\n\t\t}\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/button/client/components/client/components/button/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/button/client/components/client/scss/calypso-colors.scss","// Add percentage of white to a color\n// Copyright © 2011–2015 thoughtbot. See CREDITS.md#L3\n@function tint($color, $percent){\n @return mix(white, $color, $percent);\n}\n\n// Add percentage of black to a color\n// Copyright © 2011–2015 thoughtbot. See CREDITS.md#L3\n@function shade($color, $percent){\n @return mix(black, $color, $percent);\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/button/client/components/client/scss/color-functions.scss","@charset \"UTF-8\";\n.form-input-validation {\n color: #4ab866;\n position: relative;\n padding: 6px 24px 11px 28px;\n border-radius: 1px;\n box-sizing: border-box;\n font-size: 14px;\n animation: appear .3s ease-in-out; }\n .form-input-validation:before {\n font-size: 16px;\n content: \"\";\n vertical-align: top;\n text-align: center;\n display: inline-block;\n font-family: \"Noticons\";\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n line-height: 1;\n text-decoration: inherit;\n text-transform: none;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n speak: none;\n position: absolute;\n left: 0;\n font-size: 24px;\n line-height: 1; }\n .form-input-validation.is-error {\n color: #d94f4f; }\n .form-input-validation.is-error:before {\n content: \"\\f424\"; }\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form-input-validation/client/components/form-input-validation/style.scss","@import '../../scss/calypso-colors';\n@import '../../scss/layout';\n\n.form-input-validation {\n\tcolor: $alert-green;\n\tposition: relative;\n\tpadding: 6px 24px 11px 28px;\n\tborder-radius: 1px;\n\tbox-sizing: border-box;\n\tfont-size: 14px;\n\tanimation: appear .3s ease-in-out;\n\n\t&:before {\n\t\t@include noticon( '\\f418', 16px );\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tfont-size: 24px;\n\t\tline-height: 1;\n\t}\n\n\t&.is-error {\n\t\tcolor: $alert-red;\n\n\t\t&:before {\n\t\t\tcontent: \"\\f424\"\n\t\t}\n\t}\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form-input-validation/client/components/client/components/form-input-validation/style.scss","// Blues\n$blue-wordpress: #0087be;\n$blue-light: #78dcfa;\n$blue-medium: #00aadc;\n$blue-dark: #005082;\n\n// Grays\n$gray: #87a6bc;\n\n// $gray color functions:\n//\n// lighten( $gray, 10% )\n// lighten( $gray, 20% )\n// lighten( $gray, 30% )\n// darken( $gray, 10% )\n// darken( $gray, 20% )\n// darken( $gray, 30% )\n//\n// See wordpress.com/design-handbook/colors/ for more info.\n\n$gray-light: lighten( $gray, 33% ); //#f3f6f8\n$gray-dark: darken( $gray, 38% ); //#2e4453\n\n// Oranges\n$orange-jazzy: #f0821e;\n$orange-fire: #d54e21;\n\n// Alerts\n$alert-yellow: #f0b849;\n$alert-red: #d94f4f;\n$alert-green: #4ab866;\n\n// Link hovers\n$link-highlight: tint($blue-medium, 20%);\n\n// Essentials\n$white: rgba(255,255,255,1);\n$transparent: rgba(255,255,255,0);\n\n$border-ultra-light-gray: #e8f0f5;\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form-input-validation/client/components/client/scss/calypso-colors.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form-input-validation/client/components/client/scss/layout.scss","@import '../../scss/typography';\n@import '../../scss/layout';\n\n@mixin form-wrapper {\n\tmax-width: 100%;\n}\n\n@mixin form-error {\n\tborder: 1px solid #dd3d36;\n}\n\n// hacks to extend calypso form SCSS\ninput[type=checkbox] + span,\ninput[type=radio] + span {\n\tline-height: 2;\n}\n\n.dops-form-section-title {\n\tfont-weight: bold;\n\tcolor: #333;\n\tborder-bottom: 1px solid #DDD;\n\tpadding-bottom: 3px;\n\tmargin-bottom: 5px;\n\tmargin-top: 15px;\n}\n\n.dops-field-description {\n\tfont-size: 0.8em;\n\tfont-style: italic;\n\n\tlabel + & {\n\t\tmargin-top: -5px;\n\t}\n}\n\n.dops-form-section-body {\n\t@include clear-fix;\n}\n\n.dops-form-checkbox {\n\t@include form-wrapper;\n\n\tinput[type=checkbox] {\n\t\tmargin-right: 10px;\n\t}\n}\n\n.dops-form-text {\n\t@include form-wrapper;\n\n\tinput {\n\t\twidth: 100%;\n\t\tbox-shadow: none;\n\t\tbackground: #fff;\n\t\tborder: 1px solid #d5d5d5;\n\t\tpadding: 8px 10px;\n\t}\n}\n\n.dops-form-select {\n\t@include form-wrapper;\n\n\t&.dops-form-inline {\n\t\tdisplay: inline;\n\n\t\tselect {\n\t\t\twidth: auto;\n\t\t\tmargin-right: 10px;\n\t\t}\n\t}\n\n\tselect {\n\t\t// padding: 3px 5px;\n\t\t// width: 100%;\n\t\t// height: 35px;\n\t\t// min-width: 0;\n\t\t// // border: 1px solid #d5d5d5;\n\t\t// // border-radius: 3px;\n\t\t// background-color: #fff;\n\t\t// font-size: 12px;\n\t}\n}\n\n.dops-form-error {\n\tinput {\n\t\t@include form-error;\n\t}\n\n\tselect {\n\t\t@include form-error;\n\t}\n}\n\n.dops-form-errormessage {\n\tborder: 1px solid #dd3d36;\n\tcolor: #a00;\n\tdisplay: block;\n\tmargin: 5px 0 0 0;\n\tpadding: 5px;\n}\n\n.dops-form-label {\n\t@include form-wrapper;\n\tmargin-bottom: 5px;\n\tposition: relative;\n\n\tlabel {\n\t\tdisplay: block;\n\t\tmargin-top: 10px;\n\t\tfloat: none;\n\t\tmargin-bottom: 10px;\n\t\twidth: auto;\n\n\t\t&.floating {\n\t\t\tcolor: #999;\n\t\t\tdisplay: inline-block;\n\t\t\tz-index: 2;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\tfont-weight: normal;\n\t\t\theight: 32px;\n\t\t\tpadding: 10px 12px;\n\t\t\tmargin: 0;\n\t\t}\n\t\t\n\t\t&.floating--floated {\n\t\t\tcolor: #333;\n\t\t\tz-index: 0;\n\t\t\tfont-weight: bold;\n\t\t\tleft: auto;\n\t\t\theight: auto;\n\t\t\tpadding: 0 5px;\n\t\t\tbottom: auto;\n\t\t\tfont-size: 11px;\n\t\t\topacity: 0;\n\t\t\ttransition: top 250ms, opacity 250ms;\n\t\t}\n\n\t\t&.floating--floated-active {\n\t\t\ttop: -16px;\n\t\t\topacity: 1;\n\t\t}\n\t}\n}\n\n.dops-form-row {\n\t@include clear-fix;\n}\n\n.dops-form-actionbar {\n\tbackground: #f9f9f9;\n\tcolor: #aaa;\n\tpadding: 15px 20px 15px 20px;\n}\n\n// floating label support\n.dops-floating-label-input {\n position: relative;\n margin-top: 18px;\n}\n\n.dops-floating-label-input__input {\n position: relative;\n z-index: 1;\n}\n\n\n\n\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form/client/components/client/components/form/style.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n@mixin noticon($char, $size: null) {\n\t// This isn't very clean, but... we'll see ;)\n\t@if $size != 0 {\n\t\tfont-size: $size;\n\t}\n\tcontent: $char;\n\n\t// Copied verbatim\n\tvertical-align: top;\n\ttext-align: center;\n\tdisplay: inline-block;\n\tfont-family: \"Noticons\";\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\tline-height: 1;\n\ttext-decoration: inherit;\n\ttext-transform: none;\n\t-moz-osx-font-smoothing: grayscale;\n\t-webkit-font-smoothing: antialiased;\n\tspeak: none;\n}\n\n// ==========================================================================\n// Breakpoint Mixin\n// See https://wpcalypso.wordpress.com/devdocs/docs/coding-guidelines/css.md#media-queries\n// ==========================================================================\n\n$breakpoints: 480px, 660px, 960px, 1040px; // Think very carefully before adding a new breakpoint\n\n@mixin breakpoint( $size ){\n\t@if type-of($size) == string {\n\t $approved-value: 0;\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$and-larger: \">\" + $breakpoint;\n\t\t\t$and-smaller: \"<\" + $breakpoint;\n\n\t\t\t@if $size == $and-smaller {\n\t\t\t\t$approved-value: 1;\n\t\t\t\t@media ( max-width: $breakpoint ) {\n\t\t\t\t\t@content;\n\t\t\t\t}\n\t\t\t}\n\t\t\t@else {\n\t\t\t\t@if $size == $and-larger {\n\t\t\t\t\t$approved-value: 2;\n\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) {\n\t\t\t\t\t\t@content;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t@else {\n\t\t\t\t\t@each $breakpoint-end in $breakpoints {\n\t\t\t\t\t\t$range: $breakpoint + \"-\" + $breakpoint-end;\n\t\t\t\t\t\t@if $size == $range {\n\t\t\t\t\t\t\t$approved-value: 3;\n\t\t\t\t\t\t\t@media ( min-width: $breakpoint + 1 ) and ( max-width: $breakpoint-end ) {\n\t\t\t\t\t\t\t\t@content;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t@if $approved-value == 0 {\n\t\t\t$sizes: \"\";\n\t\t\t@each $breakpoint in $breakpoints {\n\t\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t\t}\n\t\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t\t@warn \"ERROR in breakpoint( #{ $size } ): You can only use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t\t}\n\t}\n\t@else {\n\t\t$sizes: \"\";\n\t\t@each $breakpoint in $breakpoints {\n\t\t\t$sizes: $sizes + \" \" + $breakpoint;\n\t\t}\n\t\t// TODO - change this to use @error, when it is supported by node-sass\n\t\t@warn \"ERROR in breakpoint( #{ $size } ): Please wrap the breakpoint $size in parenthesis. You can use these sizes[ #{$sizes} ] using the following syntax [ <#{ nth( $breakpoints, 1 ) } >#{ nth( $breakpoints, 1 ) } #{ nth( $breakpoints, 1 ) }-#{ nth( $breakpoints, 2 ) } ]\";\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/form/client/components/client/scss/layout.scss",".dops-slider {\n\tposition: relative;\n\n\t.handle {\n\t\tcursor: pointer;\n\n\t\t&.active {\n\t\t\tbackground-color: grey;\n\t\t}\n\t}\n\n\t.bar {\n\t\t// border: 1px solid #a6c9e2;\n\t\tborder-radius: 5px;\n\t\ttop: 10px;\n\t\theight: 10px;\t\n\t}\n\n\t.bar-0 {\n\t\tbackground-color: #4ab866;\n\t}\n\n\n\t.bar-1 {\n\t\tbackground-color: #dddddd;\n\t}\n\n}\n\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/slider/client/components/client/components/slider/style.scss","@mixin clear-fix {\n\t&:after {\n\t\tcontent: \".\";\n\t\tdisplay: block;\n\t\theight: 0;\n\t\tclear: both;\n\t\tvisibility: hidden;\n\t}\n}\n\n.styleguide {\n\tpadding: 20px;\n\tbackground-color: #FFF;\n\n\t.clear {\n\t\t@include clear-fix;\n\t}\n\n\t.styleguide-section {\n\t\t@include clear-fix;\n\t\t& > h2 {\n\t\t\tfont-size: 14px;\n\t\t\tmargin: 20px 0;\n\t\t\tpadding-bottom: 10px;\n\t\t\tborder-bottom: 1px solid #CCC;\n\t\t}\n\t\t.styleguide-subsection {\n\t\t\t& > h3 {\n\t\t\t\tfont-size: 12px;\n\t\t\t}\n\t\t\tfloat: left; \n\t\t\tclear: left;\n\t\t\twidth: 200px;\n\t\t\tpadding-right: 20px;\n\t\t\tmargin-bottom: 20px;\n\t\t\tfont-size: 10px;\n\t\t}\n\t\t.styleguide-section-demo {\n\t\t\tfloat: right;\n\t\t\tpadding: 20px;\n\t\t\tborder: 1px solid #CCC;\n\t\t\twidth: calc(100% - 200px);\n\t\t}\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/components/styleguide/client/components/client/components/styleguide/style.scss","/**\n * demo style\n */\n@import 'scss/reset';\n\nbody {\n\tmargin: 0;\n\tfont-family: 'Open Sans', sans-serif;\n}\n\n.core-container {\n\tmax-width: 1000px;\n\tmargin: 0 auto;\n\tpadding: 0 20px;\n}\n\n.core-content {\n\tbackground: #F5F5F5;\n\tpadding: 57px 0;\n\n\t&:after {\n\t\tclear: both;\n\t\tcontent: '';\n\t\tdisplay: block;\n\t}\n\n\t.primary {\n\t\tclear: none;\n\t\tfloat: right;\n\t\tmargin: 0 0 0 -300px;\n\t\twidth: 100%;\n\t}\n\n\t.demo-container {\n\t\toverflow: hidden;\n\t\tmargin: 0 0 0 300px;\n\t\tfont-size: 14px;\n\t}\n\n\t.secondary {\n\t\tclear: none;\n\t\tfloat: left;\n\t\toverflow: hidden;\n\t\twidth: 260px;\n\t}\n}\n\n.sites-navigation {\n\ta, a:hover, a:active, a:focus {\n\t\ttext-decoration: none;\n\t}\n}\n\n/**\n * Sets the icons for all the possible menu items\n */\n.sidebar .sidebar-menu {\n\ta:first-child:before {\n\t\tfont: normal normal normal 14px/1 FontAwesome !important;\n\t}\n\n\t/**\n\t * Subscriptions\n\t */\n\t.briefcase a:first-child:before {\n\t\tcontent: '\\f0b1';\n\t}\n\t.moon a:first-child:before {\n\t\tcontent: '\\f186';\n\t}\n\t.leaf a:first-child:before {\n\t\tcontent: '\\f06c';\n\t}\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/client/demo.scss","/* http://meyerweb.com/eric/tools/css/reset/ */\n/* v1.0 | 20080212 */\n\nhtml, body, div, span, applet, object, iframe,\nh1, h2, h3, h4, h5, h6, p, blockquote, pre,\na, abbr, acronym, address, cite, code,\ndel, dfn, em, font, img, ins, kbd, q, s, samp,\nstrike, strong, sub, sup, tt, var,\nb, u, i, center,\ndl, dt, dd, ol, ul, li,\nfieldset, form, label, legend,\ntable, caption, tbody, tfoot, thead, tr, th, td {\n margin: 0;\n padding: 0;\n border: 0;\n outline: 0;\n font-size: 100%;\n vertical-align: baseline;\n background: transparent;\n}\nheader, footer, section, aside, nav, article { display: block; }\nol, ul {\n list-style: none;\n}\nblockquote, q {\n quotes: none;\n}\nblockquote:before, blockquote:after,\nq:before, q:after {\n content: '';\n content: none;\n}\n\n/* remember to define focus styles! */\n:focus {\n outline: 0;\n}\n\n/* remember to highlight inserts somehow! */\nins {\n text-decoration: none;\n}\ndel {\n text-decoration: line-through;\n}\n\n/* tables still need 'cellspacing=\"0\"' in the markup */\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///autoprefixer-loader!./~/sass-loader?sourceMap!./client/client/scss/_reset.scss"],"sourceRoot":""} \ No newline at end of file diff --git a/dist/demo.js b/dist/demo.js index 70853ea..114be43 100644 --- a/dist/demo.js +++ b/dist/demo.js @@ -1,20 +1,21 @@ -!function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="/assets/",t(0)}(function(e){for(var t in e)if(Object.prototype.hasOwnProperty.call(e,t))switch(typeof e[t]){case"function":break;case"object":e[t]=function(t){var n=t.slice(1),r=e[t[0]];return function(e,t,i){r.apply(this,[e,t,i].concat(n))}}(e[t]);break;default:e[t]=e[e[t]]}return e}([function(e,t,n){"use strict";n(1);var r,i=n(95),o=n(99),s=n(245),a=n(336),l=n(96);n(338),r=l.createClass({displayName:"Demo",render:function(){return l.createElement(i,null,l.createElement(i.Panel,{title:"sidebar"},l.createElement(o,null)),l.createElement(i.Panel,{title:"styleguide"},l.createElement(a,null)),l.createElement(i.Panel,{title:"legacy"},l.createElement(s,null)))}}),jQuery(document).ready(function(){l.render(l.createElement(r,{}),document.getElementById("demo"))})},function(e,t,n){e.exports=n(2)},function(e,t,n){e.exports=n(3)},function(e,t,n){(function(e){"use strict";if(n(4),n(93),e._babelPolyfill)throw new Error("only one instance of babel/polyfill is allowed");e._babelPolyfill=!0}).call(t,function(){return this}())},function(e,t,n){n(5),n(22),n(26),n(28),n(30),n(32),n(33),n(34),n(35),n(36),n(37),n(38),n(39),n(40),n(41),n(45),n(46),n(47),n(48),n(50),n(51),n(54),n(55),n(57),n(59),n(60),n(61),n(62),n(63),n(64),n(68),n(71),n(72),n(74),n(75),n(77),n(78),n(79),n(81),n(82),n(83),n(84),n(85),n(87),n(88),n(89),n(91),n(92),e.exports=n(6).core},function(e,t,n){function r(e,t){return function(n){var r,i=T(n),o=0,s=[];for(r in i)r!=d&&E(i,r)&&s.push(r);for(;t>o;)E(i,r=e[o++])&&(~F(s,r)||s.push(r));return s}}function i(){}function o(e){return function(t,n){f.fn(t);var r=T(this),i=N(r.length),o=e?i-1:0,s=e?-1:1;if(arguments.length<2)for(;;){if(o in r){n=r[o],o+=s;break}o+=s,f(e?o>=0:i>o,"Reduce of empty array with no initial value")}for(;e?o>=0:i>o;o+=s)o in r&&(n=t(n,r[o],o,this));return n}}function s(e){return e>9?e:"0"+e}var a=n(6),l=n(8),c=n(9),u=n(13),h=n(15),p=n(16),d=n(12).safe("__proto__"),f=n(18),v=f.obj,m=Object.prototype,g=a.html,y=[],w=y.slice,b=y.join,x=c.classof,E=a.has,C=a.setDesc,k=a.getDesc,S=a.setDescs,z=a.isFunction,M=a.isObject,T=a.toObject,N=a.toLength,L=a.toIndex,P=!1,F=n(19)(!1),O=p(0),A=p(1),D=p(2),V=p(3),I=p(4);if(!a.DESC){try{P=8==C(l("div"),"x",{get:function(){return 8}}).x}catch(_){}a.setDesc=function(e,t,n){if(P)try{return C(e,t,n)}catch(r){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(v(e)[t]=n.value),e},a.getDesc=function(e,t){if(P)try{return k(e,t)}catch(n){}return E(e,t)?a.desc(!m.propertyIsEnumerable.call(e,t),e[t]):void 0},a.setDescs=S=function(e,t){v(e);for(var n,r=a.getKeys(t),i=r.length,o=0;i>o;)a.setDesc(e,n=r[o++],t[n]);return e}}u(u.S+u.F*!a.DESC,"Object",{getOwnPropertyDescriptor:a.getDesc,defineProperty:a.setDesc,defineProperties:S});var H="constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(","),B=H.concat("length","prototype"),j=H.length,R=function(){var e,t=l("iframe"),n=j,r=">";for(t.style.display="none",g.appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write("