mirror of
https://github.com/ForkAwesome/Fork-Awesome
synced 2024-05-17 22:06:36 +02:00
adding fonticons header
This commit is contained in:
Dave Gandy
parent
0810752c86
commit
a40ae6bea9
Binary file not shown.
|
|
@ -1,3 +1,17 @@
|
|||
<div class="fonticons">
|
||||
<div class="container">
|
||||
<div class="message-container">
|
||||
<div class="tagline">
|
||||
<span id="rotating-message">Take your icon game to the next level.</span>
|
||||
Check out <strong>Fonticons</strong>, from the maker of Font Awesome.
|
||||
</div>
|
||||
<div class="action">
|
||||
<a id="rotating-url" class="btn btn-primary btn-block" href="https://fonticons.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=ad_1_next_level&utm_campaign=promo_4.3_update">Gimme Some!</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navbar navbar-inverse navbar-static-top hidden-print">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -1,4 +1,24 @@
|
|||
$(function() {
|
||||
var quotes = new Array(
|
||||
"Take your icon game to the next level.",
|
||||
"Subset your icons, add your own, and serve up from a CDN.",
|
||||
"Make your icons load 10x faster!",
|
||||
"Looking for other great icon sets?",
|
||||
"Need a custom icon in Font Awesome?"
|
||||
);
|
||||
var url_strings = new Array(
|
||||
"ad_1_next_level",
|
||||
"ad_2_all_value_add",
|
||||
"ad_3_faster_loading",
|
||||
"ad_4_more_icons",
|
||||
"ad_5_custom_icons"
|
||||
);
|
||||
random_number = Math.floor( Math.random() * quotes.length );
|
||||
random_quote = quotes[random_number];
|
||||
random_url_string = url_strings[random_number];
|
||||
$('#rotating-message').html(random_quote);
|
||||
$('#rotating-url').attr("href", "https://fonticons.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=" + random_url_string + "&utm_campaign=promo_4.3_update");
|
||||
|
||||
// start the icon carousel
|
||||
$('#icon-carousel').carousel({
|
||||
interval: 5000
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
@import "site/footer";
|
||||
@import "site/lazy";
|
||||
@import "site/textured-bg";
|
||||
@import "site/black-tie";
|
||||
@import "site/fonticons";
|
||||
@import "site/fusion-ad";
|
||||
@import "site/bsap-ad";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
.black-tie {
|
||||
background-color: @gray-darker;
|
||||
color: #fff;
|
||||
padding: 30px 0;
|
||||
.tagline {
|
||||
font-weight: 200;
|
||||
font-size: 21px;
|
||||
line-height: 45px;
|
||||
}
|
||||
}
|
||||
62
src/assets/less/site/fonticons.less
Normal file
62
src/assets/less/site/fonticons.less
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
.fonticons {
|
||||
@fonticons-bg: #1c1e29;
|
||||
@fonticons-orange: desaturate(#ff7f3f, 5%);
|
||||
background-color: @fonticons-orange;
|
||||
color: #fff;
|
||||
padding: 10px 0;
|
||||
border-bottom: solid 1px mix(@fonticons-bg, @fonticons-orange, 15%);
|
||||
.message-container {
|
||||
display: table;
|
||||
width: auto;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.tagline, .action {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.tagline {
|
||||
font-weight: 200;
|
||||
font-size: 16px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.btn-primary {
|
||||
@color: #fff;
|
||||
@background: mix(#fff,@fonticons-bg,10%);
|
||||
@border: @fonticons-bg;
|
||||
font-weight: bold;
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
border-bottom-width: 2px;
|
||||
text-shadow: none;
|
||||
border-radius: 4px;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open > &.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: darken(@border, 3%);
|
||||
border-color: darken(@border, 12%);
|
||||
border-bottom-color: darken(@border, 18%);
|
||||
}
|
||||
&:active,
|
||||
&.active,
|
||||
.open > &.dropdown-toggle {
|
||||
background-image: none;
|
||||
}
|
||||
&.disabled,
|
||||
&[disabled],
|
||||
fieldset[disabled] & {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -49,9 +49,9 @@
|
|||
line-height: 36px;
|
||||
}
|
||||
|
||||
.black-tie .tagline {
|
||||
font-size: @font-size-h3;
|
||||
line-height: 45px;
|
||||
.fonticons {
|
||||
.tagline { }
|
||||
.action { width: 18%; }
|
||||
}
|
||||
|
||||
.hide-lg { display: none; }
|
||||
|
|
|
|||
|
|
@ -39,9 +39,8 @@
|
|||
font-size: 19px;
|
||||
}
|
||||
|
||||
.black-tie .tagline {
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
.fonticons {
|
||||
.action { width: 33%; }
|
||||
}
|
||||
|
||||
.sticky-footer(271px, 60px);
|
||||
|
|
|
|||
|
|
@ -65,11 +65,10 @@
|
|||
}
|
||||
|
||||
|
||||
|
||||
.black-tie .tagline {
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
margin-bottom: 15px;
|
||||
.fonticons {
|
||||
padding: 15px 0;
|
||||
.tagline, .action { display: block; }
|
||||
.tagline { margin-bottom: 10px; }
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue