diff options
Diffstat (limited to 'plugins/jetpack/scss/templates/_main.scss')
| -rw-r--r-- | plugins/jetpack/scss/templates/_main.scss | 634 |
1 files changed, 0 insertions, 634 deletions
diff --git a/plugins/jetpack/scss/templates/_main.scss b/plugins/jetpack/scss/templates/_main.scss deleted file mode 100644 index 6aa2b7c2..00000000 --- a/plugins/jetpack/scss/templates/_main.scss +++ /dev/null @@ -1,634 +0,0 @@ -// ========================================================================== -// Main Layout -// ========================================================================== - -.configure .frame.top.fixed { - @include breakpoint(tablet){ - padding-left: 0; - }; -} - -// ========================================================================== -// Main author styles -// ========================================================================== - -.wrap.inner, -.page-content { - max-width: 950px; - margin: 0 auto; - - li { - line-height: 23px; - } -} - -.page-content { - @include breakpoint(large-phone){ - margin-top: 0; - }; -} - -.wrap.inner { - @include breakpoint(large-desktop) { - background: $clouds; - padding: 15px; - }; - @include breakpoint(large-phone) { - margin-top: em(24px); - }; -} - -.page-content.about { - position: relative; - z-index: 10; - - @include breakpoint(large-desktop){ - background: $clouds; - padding: 15px; - }; -} - -.page-content.configure { - @include breakpoint(large-desktop){ - background: $clouds; - }; -} - -.footer nav { - max-width: 550px; - margin: 0 auto; -} - - -// ========================================================================== -// Main navigation -// ========================================================================== - -.header { - left: 0; - right: 0; - background: $green; -} -.header-nav { - li { - line-height: 60px; - - } - a { - padding: 0 em(10px); - line-height: 24px; - } - .jetpack-logo { - a { - display: inline-block; - position: relative; - width: 214px; - margin-right: 6px; - background: url(../images/jetpack-logo.png) center center no-repeat; - background: url(../images/jetpack-logo.svg) center center no-repeat, none; - background-size: 183px auto; - color: #fff; - line-height: 60px; - font-weight: normal; - - span { - text-indent: -9999px; - visibility: hidden; - } - - // needs to be cleaned up and removed - jeffgolenski - &:before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - - background-size: 183px 32px; - } - } - } - .jetpack-modules + .jetpack-modules { - margin-left: 15px; - } -} - -.main-nav { - float: left; - - li { - margin: 0; - } - @include breakpoint(desktop){ - font-size: 13px; - }; -} - -// Help tab -.jetpack-pagestyles { - #screen-meta { - margin: 0; - } - #screen-meta-links .screen-meta-toggle { - z-index: 2; - } - #screen-options-link-wrap, #contextual-help-link-wrap { - border: none; - } - .update-nag { - display: none; - } -} - -// ========================================================================== -// Modal -// ========================================================================== - -.loading { - bottom: 50%; - position: absolute; - top: 50%; - width: 100%; - - span { - color: #999; - } -} -.modal { - background: #fff; - position: fixed; - top: 52px; - bottom: 20px; - right: 20px; - left: 20px; - margin-left: 160px; - display: none; - box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1); - z-index: 500; - - .close { - position: absolute; - top: 0; - right: 0; - font: 300 em(24px) 'genericons' !important; - color: #777; - content: '\f405'; - display: inline-block; - padding: em(4px) em(10px) em(6px); - z-index: 5; - - &:hover { - background: #eee; - opacity: 0.8; - } - &:active { - background: #eee; - opacity: 0.4; - } - } - .content-container { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - overflow: auto; - padding: em(30px, 14px); - } - .content { - margin: 0 auto; - max-width: 900px; - text-align: left; - } - h2 { - text-align: left; - margin-top: 0; - color: #5d6d74; - font-weight: 300; - line-height: 32px; - text-shadow: 0 1px 1px #fff; - - @include breakpoint(large-phone){ - font-size: 26px; - }; - } - h5 { - clear: left; - } - p { - font-size: em(16px, 13px); - } - footer { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - padding: 12px 20px; - border-top: 1px solid #ddd; - background: #fff; - text-align: right; - - ul { - margin: 0; - } - li { - display: inline-block; - margin: 0; - } - } - .button-secondary, - .button-primary:active { - // fixing weird core bug thingy - vertical-align: baseline; - } - @include breakpoint(desktop){ - bottom: 5%; - margin-left: 36px; - font-size: 80%; - - .content { - top: 38px; - } - }; - @include breakpoint(tablet){ - top: 66px; - margin-left: 0; - }; - @include breakpoint(phablet){ - top: 10px; - right: 10px; - bottom: 10px; - left: 10px; - } -} -.jp-info-img { - float: right; - margin: 0 0 8px 30px; - - img { - border: 1px solid #ddd; - max-width: 100%; - height: auto; - - &:first-child { - margin-top: 0; - } - } - @include breakpoint(tablet){ - float: none; - margin: 0 0 15px; - }; -} -.content-container.modal-footer { - bottom: 53px; -} -.shade { - background: #000; - bottom: 0; - cursor: pointer; - display: none; - left: 0; - opacity: 0.2; - position: fixed; - right: 0; - top: 0; - z-index: 11; -} - -// ========================================================================== -// Footer Navigation -// ========================================================================== - -// NOTE: .download-jetpack is in _buttons.scss -.footer { - margin-top: em(20px); - position: relative; - padding: em(140px) 0 em(60px); - text-align: center; - - &:before, - &:after { - content: ''; - position: absolute; - left: 0; - pointer-events: none; - } - &:before { - top: 0; - margin-top: -1px; // Removes subpixel gap on retina landscape - width: 100%; - height: 195px; - } - &:after { - display: none; - } - .download-jetpack { - margin-bottom: 33px; - } - @include minbreakpoint(large-desktop){ - padding-bottom: 35px; - }; - @include breakpoint(large-desktop) { - padding-top: 165px; - padding-bottom: 0; - - &:before { - background-size: 160% auto; - } - ul { - float: none; - overflow: hidden; // Clears the float - } - }; - @include breakpoint(desktop){ - padding-top: 146px; - }; - @include breakpoint(tablet){ - margin-top: 0; - }; - @include breakpoint(large-phone){ - margin-top: 0; - padding-top: 135px; - }; - @include breakpoint(phone){ - padding-top: 76px; - }; -} -.footer nav { - max-width: 100%; - - a, - a:visited { - padding: 4px 6px; - color: #999; - - &:hover, - &:focus { - color: #81A844; - } - } - @include breakpoint(large-desktop){ - a, - a:visited { - &:hover, - &:focus { - color: $green; - } - } - }; - @include breakpoint(large-phone){ - li { - display: block; - float: none; - margin: 0; - text-align: left; - } - a { - display: block; - padding: 0 16px; - line-height: 44px; - } - }; -} -.primary { - padding: 25px 15px 10px 15px; - border-bottom: 1px solid #eee; -} -.secondary-footer { - margin: 0 auto; - - li { - margin-right: 5px; - } - @include minbreakpoint(tablet){ - padding: 8px 15px 10px; - margin-bottom: 30px; - border-bottom: 1px solid #eee; - }; - @include minbreakpoint(large-desktop){ - margin-bottom: 0; - }; - @include breakpoint(tablet){ - padding: 8px 15px 8px; - border-bottom: none; - }; - @include breakpoint(large-phone){ - margin: 0; - padding: 0; - border: none; - font-weight: 400; - - a { - border-top: 1px solid #eee; - } - }; -} -.footer .a8c-attribution { - margin: 0; - padding: 0 6px; - color: #bbb; - font-size: em(11px); - font-family: $gill; - text-transform: uppercase; - - a { - // This may look janky, but if you highlight from - // "AN" to "TEAM," copy and paste, you'll get the whole - // "An AUTOMATTIC TEAM" phrase. - display: inline-block; - position: relative; - padding: 4px 16px; - right: 9999px; - outline: 0; - - &:after { - content: 'A'; - position: absolute; - top: 2px; - right: -9999px; - height: 100%; - color: #999; - font-size: em(17px, 11px); - font-family: $automatticons; - text-align: center; - } - &:hover { - &:after { - animation: candy .4s ease-in-out; - } - } - } -} -.secondary { - @include minbreakpoint(tablet){ - padding: 0 15px 10px 15px; - border-bottom: 1px solid #eee; - } - @include minbreakpoint(large-desktop){ - padding: 0 15px 10px 15px; - border-bottom: none; - } -} - - -// ========================================================================== -// Messages & Errors -// ========================================================================== - -.jetpack-message { - background: lighten($green, 5%); - border: 1px solid darken($green, 5%); - margin: 33px auto 0; - max-width: 90%; - position: relative; - z-index: 2; - - &.is-opt-in { - margin: 50px 0 0; - max-width: 100%; - padding: 10px 15px; - background: #fff; - border: 0; - box-shadow: 0 1px 1px 0 rgba(0,0,0,.1); - font-size: 13px; - text-align: center; - - // page=jetpack specific styling - .subhead & { - margin: 0; - padding-bottom: 0; - background: transparent; - box-shadow: none; - - .jp-button { - display: inline-block; - } - } - p { - color: #3c4549; - } - .jp-button { - margin-top: 15px; - display: none; - } - } - .squeezer { - h2 { - font-size: 1em; - } - } - h2 { - color: #fff; - margin: 0; - } - p { - color: #fff; - margin: 0; - opacity: 0.7; - } - .squeezer { - padding: 23px 23px 23px 80px; - position: relative; - text-align: left; - - &:before { - color: #fff; - content: '\f418'; - font-family: 'Genericons'; - font-size: 33px; - height: 33px; - left: 25px; - opacity: 0.6; - position: absolute; - top: 23px; - top: calc( 50% - 22px ); - } - @include breakpoint(large-phone){ - padding: 23px; - - &:before { - display: none; - } - } - a { - color:#FFF; - border-bottom:1px solid #D5E4BD; - } a:hover{ - border-bottom:1px solid #F1F6E9; - } - } - &.error .squeezer:before, - &.jetpack-err .squeezer:before { - content: '\f414'; - } -} - -.configure-module .jetpack-message { - max-width:100%; -} - -// ========================================================================== -// Uncategorized -// ========================================================================== - -@include breakpoint(large-phone){ - .wrap.inner.jp-support { // Used anywhere? - .jp-support-column-left { - width: 100%; - - .widget-text { - margin-right: 0; - width: 100%; - } - } - .jp-support-column-right { - width: 100%; - } - } -}; - -// ========================================================================== -// Custom Breakpoints -// ========================================================================== - -@media screen and (max-width: 515px) { - .jp-frame { - .header-nav { - padding-bottom: 10px; - - li { - line-height: 30px; - } - .jetpack-logo { - width: 100%; - text-align: center; - } - .jetpack-modules { - margin: 0; - width: 50%; - text-align: right; - padding: 0 5px; - } - .jetpack-modules + .jetpack-modules { - text-align: left; - } - .jetpack-modules:nth-child(4) { - text-align: center; - margin: 0 auto; - width: 100%; - a { - padding: 0 10px; - } - } - } - } -} // max 515px - -// ========================================================================== -// Fix notice in IE -// ========================================================================== -#ie-legacy-notice .dops-notice__content { - display: inline-block; - margin-left: 10px; -} |