mirror of
https://github.com/ForkAwesome/Fork-Awesome
synced 2024-06-18 13:35:16 +02:00
Merge pull request #10424 from FortAwesome/kickstarter-preorders
FA5 Pre-order links
This commit is contained in:
Dave Gandy
GitHub
commit
4722e3ea4c
4
css/font-awesome.css
vendored
4
css/font-awesome.css
vendored
|
|
@ -61,7 +61,7 @@
|
|||
}
|
||||
.fa-border {
|
||||
padding: .2em .25em .15em;
|
||||
border: solid 0.08em #eee;
|
||||
border: solid 0.08em #eeeeee;
|
||||
border-radius: .1em;
|
||||
}
|
||||
.fa-pull-left {
|
||||
|
|
@ -176,7 +176,7 @@
|
|||
font-size: 2em;
|
||||
}
|
||||
.fa-inverse {
|
||||
color: #fff;
|
||||
color: #ffffff;
|
||||
}
|
||||
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
|
||||
readers do not read off random characters that represent icons */
|
||||
|
|
|
|||
2
css/font-awesome.min.css
vendored
2
css/font-awesome.min.css
vendored
File diff suppressed because one or more lines are too long
|
|
@ -3,7 +3,7 @@
|
|||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
|
||||
<h2 class="modal-title" id="modal-fa5-label">Font Awesome 5 is funded and coming!</h2>
|
||||
<h2 class="modal-title" id="modal-fa5-label">Font Awesome 5 Pre-Orders Now Available!</h2>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
|
||||
|
|
@ -13,11 +13,11 @@
|
|||
</div>
|
||||
|
||||
<p class="lead text-center margin-top-lg margin-bottom-lg">
|
||||
Thanks to all of our Kickstarter backers who helped make the project successful. More information and updates are to come.
|
||||
Pre-order and get Font Awesome 5 Pro and <strong>ALL</strong> stretch goals for just $40!
|
||||
</p>
|
||||
<a class="btn btn-fa5 btn-lg btn-block" href="https://www.kickstarter.com/projects/232193852/font-awesome-5?ref=1oakzw"
|
||||
onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Check out the Kickstarter']);">
|
||||
<h3 class="margin text-sans-serif strong">Check out the details on <br class="hide-sm hide-md hide-lg">Kickstarter <i class="fa fa-external-link-square" aria-hidden="true"></i></h3>
|
||||
<a class="btn btn-fa5 btn-lg btn-block" href="http://five.fontawesome.com" target="_blank"
|
||||
onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
|
||||
<h3 class="margin text-sans-serif strong">Pre-Order! <i class="fa fa-external-link-square" aria-hidden="true"></i></h3>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,37 +5,12 @@
|
|||
<span id="rotating-message"></span>
|
||||
</div>
|
||||
<div class="action">
|
||||
<a id="rotating-url" class="btn btn-primary btn-lg btn-block" href=""></a>
|
||||
<a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navbar navbar-org navbar-static-top">
|
||||
<div class="container">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li>
|
||||
<a href="http://fortawesome.com/start?utm_source=font_awesome_navbar&utm_medium=display&utm_content=font_awesome_navbar&utm_campaign=promo_{{ site.fontawesome.minor_version }}_update" data-toggle="tooltip" data-container="body" data-placement="bottom" data-html="true" title="Take your front end game<br>to the next level!">
|
||||
<i class="fa fa-fort-awesome fa-lg valign-baseline"></i>
|
||||
Fort Awesome
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://symbolset.com/?utm_source=font_awesome_navbar&utm_medium=display&utm_content=font_awesome_navbar&utm_campaign=promo_{{ site.fontawesome.minor_version }}_update" data-toggle="tooltip" data-container="body" data-placement="bottom" data-html="true" title="Get the perfect icon set!">
|
||||
<i class="fas fas-heart-ss"></i>
|
||||
Symbolset
|
||||
</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="http://fontawesome.io/?utm_source=font_awesome_navbar&utm_medium=display&utm_content=font_awesome_navbar&utm_campaign=promo_{{ site.fontawesome.minor_version }}_update" data-toggle="tooltip" data-container="body" data-placement="bottom" data-html="true" title="The iconic font<br>& CSS toolkit">
|
||||
<i class="fa fa-font-awesome"></i>
|
||||
Font Awesome</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navbar navbar-inverse navbar-static-top hidden-print">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
|
|
|
|||
|
|
@ -3,35 +3,11 @@ $(function () {
|
|||
|
||||
var ads = [
|
||||
{
|
||||
quote: "<i class='fas fas-perfect fas-2x valign-middle margin-right'></i>Looking for the best icon sets? Check out <strong>Symbolset</strong>, <a href='https://articles.fortawesome.com/fort-awesome-acquires-symbolset-72229dab2c13'>now</a> from the maker of Font Awesome.",
|
||||
class: "symbolset",
|
||||
url: "https://symbolset.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_1_best_icons&utm_campaign=promo_4.7_update",
|
||||
btn_text: "Gimme Some!"
|
||||
quote: "Pre-order and get Font Awesome 5 Pro and <strong>ALL</strong> stretch goals for just $40!",
|
||||
class: "fa5",
|
||||
url: "http://five.fontawesome.com",
|
||||
btn_text: "Pre-order FA Pro! <i class='fa fa-external-link'></i>",
|
||||
},
|
||||
{
|
||||
quote: "<i class='fas fas-curate fas-2x valign-middle margin-right'></i>Need a different look for your icons? Check out <strong>Symbolset</strong>, <a href='https://articles.fortawesome.com/fort-awesome-acquires-symbolset-72229dab2c13'>now</a> from the maker of Font Awesome.",
|
||||
class: "symbolset",
|
||||
url: "https://symbolset.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_2_different_look&utm_campaign=promo_4.7_update",
|
||||
btn_text: "Gimme Some!"
|
||||
},
|
||||
{
|
||||
quote: "Take your icon game to the next level. Check out <strong>Fort Awesome</strong>, from the maker of Font Awesome.",
|
||||
class: "fort-awesome",
|
||||
url: "https://fortawesome.com/start?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_1_next_level&utm_campaign=promo_4.7_update",
|
||||
btn_text: "Gimme Some!"
|
||||
},
|
||||
{
|
||||
quote: "Make your icons load 10x faster! Check out <strong>Fort Awesome</strong>, from the maker of Font Awesome.",
|
||||
class: "fort-awesome",
|
||||
url: "https://fortawesome.com/start?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_3_faster_loading&utm_campaign=promo_4.7_update",
|
||||
btn_text: "Gimme Some!"
|
||||
},
|
||||
{
|
||||
quote: "Want to add your own icon? Check out <strong>Fort Awesome</strong>, from the maker of Font Awesome.",
|
||||
class: "fort-awesome",
|
||||
url: "https://fortawesome.com/start?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_6_your_own_icon&utm_campaign=promo_4.7_update",
|
||||
btn_text: "Gimme Some!"
|
||||
}
|
||||
];
|
||||
|
||||
selectAd();
|
||||
|
|
@ -44,7 +20,7 @@ $(function () {
|
|||
$('[data-toggle="tooltip"]').tooltip();
|
||||
$('[data-toggle="popover"]').popover();
|
||||
|
||||
if (storageAvailable('localStorage') && !localStorage.seenFA5Modal) {
|
||||
if (storageAvailable('localStorage') && !localStorage.seenFA5Modal2) {
|
||||
$('#modal-fa5')
|
||||
.modal('toggle')
|
||||
.on('hidden.bs.modal', function (e) {
|
||||
|
|
@ -54,7 +30,7 @@ $(function () {
|
|||
}
|
||||
|
||||
if (storageAvailable('localStorage')) {
|
||||
localStorage.seenFA5Modal = true;
|
||||
localStorage.seenFA5Modal2 = true;
|
||||
// Yippee! We can use localStorage awesomeness
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -210,4 +210,79 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.fa5 {
|
||||
@fa5-bg: #489fdf;
|
||||
background-color: @fa5-bg;
|
||||
border-bottom: rgba(0,0,0,0.2);
|
||||
.message-container { padding: 40px 0; }
|
||||
.tagline { font-size: 24px; }
|
||||
.fa-external-link { vertical-align: -10%; }
|
||||
.time-left {
|
||||
font-size: 18px;
|
||||
color: mix(@fa5-bg, #fff, 20%);
|
||||
}
|
||||
@keyframes flash-duration {
|
||||
from {
|
||||
color: #fff;
|
||||
}
|
||||
to {
|
||||
color: mix(@fa5-bg, #fff, 20%);
|
||||
}
|
||||
}
|
||||
.duration {
|
||||
font-weight: 600;
|
||||
animation-name: flash-duration;
|
||||
animation-duration: 1.0s;
|
||||
}
|
||||
a:not(.btn) {
|
||||
text-decoration: underline;
|
||||
color: #fff;
|
||||
&:hover { color: rgba(255,255,255,.8); }
|
||||
}
|
||||
.btn-primary {
|
||||
@color: @fa5-bg;
|
||||
@background: #fff;
|
||||
@border: mix(#000,@fa5-bg,10%);
|
||||
font-weight: 600;
|
||||
font-size: 22px;
|
||||
padding: 14px 28px;
|
||||
border-radius: 30px;
|
||||
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
border-bottom-width: 2px;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open > &.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
border-color: rgba(0,0,0,0.2);
|
||||
border-bottom-color: rgba(0,0,0,0.2);
|
||||
}
|
||||
&:active,
|
||||
&.active,
|
||||
.open > &.dropdown-toggle {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue