Permalink
Browse files

Move mozilla-share-cta LESS/CSS into separate file

Bug 1121114
  • Loading branch information...
sgarrity committed Jan 13, 2015
1 parent ad4c7a5 commit fdeed7419fe37a0500de85ff8ffcccdb704f2e1b
Showing with 129 additions and 124 deletions.
  1. +3 −0 bedrock/settings/base.py
  2. +126 −0 media/css/base/mozilla-share-cta.less
  3. +0 −124 media/css/firefox/independent-splash.less
@@ -363,6 +363,7 @@ def JINJA_CONFIG():
'firefox_privacy_tour': (
'css/sandstone/sandstone.less',
'css/base/mozilla-modal.less',
'css/base/mozilla-share-cta.less',
'css/firefox/independent-splash.less',
'css/firefox/australis/australis-ui-tour.less',
'css/firefox/privacy_tour/common.less',
@@ -371,6 +372,7 @@ def JINJA_CONFIG():
'firefox_privacy_no_tour': (
'css/sandstone/sandstone.less',
'css/base/mozilla-modal.less',
'css/base/mozilla-share-cta.less',
'css/firefox/independent-splash.less',
'css/firefox/privacy_tour/common.less',
'css/firefox/privacy_tour/no-tour.less',
@@ -430,6 +432,7 @@ def JINJA_CONFIG():
),
'firefox_independent': (
'css/sandstone/sandstone-resp.less',
'css/base/mozilla-share-cta.less',
'css/firefox/independent-splash.less',
'css/firefox/independent.less',
),
@@ -0,0 +1,126 @@
// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
@import "../sandstone/lib.less";
// Share button
.mozilla-share-cta {
position: relative;
width: 296px;
background: #0c99d5;
color: #fff;
border: 2px solid #9ed6ee;
border-radius: 8px;
overflow: hidden;
.transition(background .2s ease-in-out);
&:hover,
&:focus {
background: lighten(#0c99d5, 2%);
}
h3 {
display: block;
width: 256px;
padding: 1em 20px;
margin: 0;
color: #fff;
.font-size(18px);
text-transform: uppercase;
border: none;
background: none;
text-align: center;
visibility: visible;
text-shadow: none;
font-family: 'Open Sans', sans-serif;
opacity: 1;
.transition(opacity .2s ease-in-out);
&:before {
font-family: 'Font Awesome';
content: '\f1e0\00A0\00A0';
text-shadow: none;
}
}
ul {
display: table;
position: relative;
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
visibility: hidden;
li {
display: table-cell;
width: 33.3%;
margin: 0;
padding: 0;
text-align: center;
vertical-align: middle;
opacity: 0;
.transition(opacity .2s ease-in-out);
a {
color: #fff;
display: block;
margin: 0 10px;
.font-size(0);
&:before {
font-family: 'Font Awesome';
.font-size(28px);
line-height: 56px;
opacity: 0.8;
padding-top: 1px;
text-shadow: none;
-webkit-font-smoothing: antialiased;
.transition(opacity .2s ease-in-out);
}
&.twitter:before {
content: '\f099\00A0';
}
&.facebook:before {
content: '\f09a\00A0';
}
&.g-plus:before {
content: '\f0d5\00A0';
}
&:hover,
&:focus {
text-decoration: none;
color: #fff;
&:before {
text-shadow: none;
opacity: 1;
}
}
}
}
}
}
.js .mozilla-share-cta {
h3 {
position: absolute;
top: 0;
left: 0;
&.out {
opacity: 0;
.transition(opacity .2s ease-in-out);
}
}
ul.in li {
opacity: 1;
}
}
@@ -381,130 +381,6 @@
}
// Share button
.mozilla-share-cta {
position: relative;
width: 296px;
background: #0c99d5;
color: #fff;
border: 2px solid #9ed6ee;
border-radius: 8px;
overflow: hidden;
.transition(background .2s ease-in-out);
&:hover,
&:focus {
background: lighten(#0c99d5, 2%);
}
h3 {
display: block;
width: 256px;
padding: 1em 20px;
margin: 0;
color: #fff;
.font-size(18px);
text-transform: uppercase;
border: none;
background: none;
text-align: center;
visibility: visible;
text-shadow: none;
font-family: 'Open Sans', sans-serif;
opacity: 1;
.transition(opacity .2s ease-in-out);
&:before {
font-family: 'Font Awesome';
content: '\f1e0\00A0\00A0';
text-shadow: none;
}
}
ul {
display: table;
position: relative;
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
visibility: hidden;
li {
display: table-cell;
width: 33.3%;
margin: 0;
padding: 0;
text-align: center;
vertical-align: middle;
opacity: 0;
.transition(opacity .2s ease-in-out);
a {
color: #fff;
display: block;
margin: 0 10px;
.font-size(0);
&:before {
font-family: 'Font Awesome';
.font-size(28px);
line-height: 56px;
opacity: 0.8;
padding-top: 1px;
text-shadow: none;
-webkit-font-smoothing: antialiased;
.transition(opacity .2s ease-in-out);
}
&.twitter:before {
content: '\f099\00A0';
}
&.facebook:before {
content: '\f09a\00A0';
}
&.g-plus:before {
content: '\f0d5\00A0';
}
&:hover,
&:focus {
text-decoration: none;
color: #fff;
&:before {
text-shadow: none;
opacity: 1;
}
}
}
}
}
}
.js .mozilla-share-cta {
h3 {
position: absolute;
top: 0;
left: 0;
&.out {
opacity: 0;
.transition(opacity .2s ease-in-out);
}
}
ul.in li {
opacity: 1;
}
}
/*-------------------------------------------------------------------------*/
// @Tablet Layout: 760px
@media only screen and (min-width: @breakTablet) and (max-width: @breakDesktop) {

0 comments on commit fdeed74

Please sign in to comment.