diff options
| author | Dave Gandy <dave@davegandy.com> | 2017-12-07 20:09:30 +0300 |
|---|---|---|
| committer | Dave Gandy <dave@davegandy.com> | 2017-12-07 20:09:30 +0300 |
| commit | 3d62265980038b81cd98531cd6ffb0d245348e28 (patch) | |
| tree | 8c5d8b3c258a07e960604a2290678dedcebe283d /icon | |
| parent | b114d3e9213bf59f8fc5f8ebb23bb88d46f1d58a (diff) | |
Updating nav and modals for FA5 launch
Diffstat (limited to 'icon')
675 files changed, 30377 insertions, 12150 deletions
diff --git a/icon/500px/index.html b/icon/500px/index.html index 7266fde35..4ee8d1d36 100644 --- a/icon/500px/index.html +++ b/icon/500px/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/address-book-o/index.html b/icon/address-book-o/index.html index d9441d31a..d444dd6e4 100644 --- a/icon/address-book-o/index.html +++ b/icon/address-book-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/address-book/index.html b/icon/address-book/index.html index 0dfc725fc..3ba38f010 100644 --- a/icon/address-book/index.html +++ b/icon/address-book/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/address-card-o/index.html b/icon/address-card-o/index.html index b171911d7..2b21e89f7 100644 --- a/icon/address-card-o/index.html +++ b/icon/address-card-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/address-card/index.html b/icon/address-card/index.html index cd606af7c..047786a3c 100644 --- a/icon/address-card/index.html +++ b/icon/address-card/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/adjust/index.html b/icon/adjust/index.html index cfb5dbb11..a90683135 100644 --- a/icon/adjust/index.html +++ b/icon/adjust/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/adn/index.html b/icon/adn/index.html index 59dc7f602..8ebedcc45 100644 --- a/icon/adn/index.html +++ b/icon/adn/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/align-center/index.html b/icon/align-center/index.html index 47e022dbd..7dd97488f 100644 --- a/icon/align-center/index.html +++ b/icon/align-center/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/align-justify/index.html b/icon/align-justify/index.html index ff322b09d..ca7c28e91 100644 --- a/icon/align-justify/index.html +++ b/icon/align-justify/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/align-left/index.html b/icon/align-left/index.html index 3e9377317..f4ad73b81 100644 --- a/icon/align-left/index.html +++ b/icon/align-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/align-right/index.html b/icon/align-right/index.html index 424a74c02..0d7cfcad5 100644 --- a/icon/align-right/index.html +++ b/icon/align-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/amazon/index.html b/icon/amazon/index.html index 4de04e15b..c1e15eae3 100644 --- a/icon/amazon/index.html +++ b/icon/amazon/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ambulance/index.html b/icon/ambulance/index.html index 8a125308a..ce8c3b484 100644 --- a/icon/ambulance/index.html +++ b/icon/ambulance/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/american-sign-language-interpreting/index.html b/icon/american-sign-language-interpreting/index.html index 6c389c171..4d7fd3ab5 100644 --- a/icon/american-sign-language-interpreting/index.html +++ b/icon/american-sign-language-interpreting/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/anchor/index.html b/icon/anchor/index.html index b28f85e48..7c50a0d31 100644 --- a/icon/anchor/index.html +++ b/icon/anchor/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/android/index.html b/icon/android/index.html index 06de9050e..669a8a206 100644 --- a/icon/android/index.html +++ b/icon/android/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angellist/index.html b/icon/angellist/index.html index 0aa23f872..1400aea31 100644 --- a/icon/angellist/index.html +++ b/icon/angellist/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-double-down/index.html b/icon/angle-double-down/index.html index a3d1f9e88..9e723a82b 100644 --- a/icon/angle-double-down/index.html +++ b/icon/angle-double-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-double-left/index.html b/icon/angle-double-left/index.html index 43645bf21..a57be3da4 100644 --- a/icon/angle-double-left/index.html +++ b/icon/angle-double-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-double-right/index.html b/icon/angle-double-right/index.html index dcf624e88..28ba0c1c5 100644 --- a/icon/angle-double-right/index.html +++ b/icon/angle-double-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-double-up/index.html b/icon/angle-double-up/index.html index 4687d67a3..ca356c65b 100644 --- a/icon/angle-double-up/index.html +++ b/icon/angle-double-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-down/index.html b/icon/angle-down/index.html index 3b6431779..bceb9bf5c 100644 --- a/icon/angle-down/index.html +++ b/icon/angle-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-left/index.html b/icon/angle-left/index.html index 1226ebf1c..f2c95bc2a 100644 --- a/icon/angle-left/index.html +++ b/icon/angle-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-right/index.html b/icon/angle-right/index.html index 0dd6bca17..8cf49f13c 100644 --- a/icon/angle-right/index.html +++ b/icon/angle-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/angle-up/index.html b/icon/angle-up/index.html index 6687c2f91..ed8dcc314 100644 --- a/icon/angle-up/index.html +++ b/icon/angle-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/apple/index.html b/icon/apple/index.html index b0657d94b..73f2833db 100644 --- a/icon/apple/index.html +++ b/icon/apple/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/archive/index.html b/icon/archive/index.html index 9b4ca47db..f9a5e4efd 100644 --- a/icon/archive/index.html +++ b/icon/archive/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/area-chart/index.html b/icon/area-chart/index.html index 4d28f2586..49ae2d9ac 100644 --- a/icon/area-chart/index.html +++ b/icon/area-chart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-down/index.html b/icon/arrow-circle-down/index.html index d2685511a..959f3ead1 100644 --- a/icon/arrow-circle-down/index.html +++ b/icon/arrow-circle-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-left/index.html b/icon/arrow-circle-left/index.html index 2690387f6..1d414df64 100644 --- a/icon/arrow-circle-left/index.html +++ b/icon/arrow-circle-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-o-down/index.html b/icon/arrow-circle-o-down/index.html index 6db180e56..a26ed049d 100644 --- a/icon/arrow-circle-o-down/index.html +++ b/icon/arrow-circle-o-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-o-left/index.html b/icon/arrow-circle-o-left/index.html index 7e2e93c4a..3429f0734 100644 --- a/icon/arrow-circle-o-left/index.html +++ b/icon/arrow-circle-o-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-o-right/index.html b/icon/arrow-circle-o-right/index.html index 0662f6de4..e76cbdf5e 100644 --- a/icon/arrow-circle-o-right/index.html +++ b/icon/arrow-circle-o-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-o-up/index.html b/icon/arrow-circle-o-up/index.html index 4cb8072aa..f8c9455b0 100644 --- a/icon/arrow-circle-o-up/index.html +++ b/icon/arrow-circle-o-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-right/index.html b/icon/arrow-circle-right/index.html index 8e0ede177..56e8ebe87 100644 --- a/icon/arrow-circle-right/index.html +++ b/icon/arrow-circle-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-circle-up/index.html b/icon/arrow-circle-up/index.html index 7b4a8aa0b..4bf91898e 100644 --- a/icon/arrow-circle-up/index.html +++ b/icon/arrow-circle-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-down/index.html b/icon/arrow-down/index.html index 1282635b3..55cde199c 100644 --- a/icon/arrow-down/index.html +++ b/icon/arrow-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-left/index.html b/icon/arrow-left/index.html index e2d195e0d..b1f8841db 100644 --- a/icon/arrow-left/index.html +++ b/icon/arrow-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-right/index.html b/icon/arrow-right/index.html index a7ff90b8f..f683ccac2 100644 --- a/icon/arrow-right/index.html +++ b/icon/arrow-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrow-up/index.html b/icon/arrow-up/index.html index 096838e8a..3c638e4dc 100644 --- a/icon/arrow-up/index.html +++ b/icon/arrow-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrows-alt/index.html b/icon/arrows-alt/index.html index 73b2f8356..e962315ad 100644 --- a/icon/arrows-alt/index.html +++ b/icon/arrows-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrows-h/index.html b/icon/arrows-h/index.html index 60366c1ff..a463842d7 100644 --- a/icon/arrows-h/index.html +++ b/icon/arrows-h/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrows-v/index.html b/icon/arrows-v/index.html index 3a59aa07c..3b507358a 100644 --- a/icon/arrows-v/index.html +++ b/icon/arrows-v/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/arrows/index.html b/icon/arrows/index.html index 6de06af84..25f7f2975 100644 --- a/icon/arrows/index.html +++ b/icon/arrows/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/assistive-listening-systems/index.html b/icon/assistive-listening-systems/index.html index af25dbefe..717dfc190 100644 --- a/icon/assistive-listening-systems/index.html +++ b/icon/assistive-listening-systems/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/asterisk/index.html b/icon/asterisk/index.html index ca32a0cdf..6003d191d 100644 --- a/icon/asterisk/index.html +++ b/icon/asterisk/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/at/index.html b/icon/at/index.html index dfd01fa8e..d782e841e 100644 --- a/icon/at/index.html +++ b/icon/at/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/audio-description/index.html b/icon/audio-description/index.html index 8a5785165..01bc5652e 100644 --- a/icon/audio-description/index.html +++ b/icon/audio-description/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/backward/index.html b/icon/backward/index.html index edcc44cb0..f0011c7bf 100644 --- a/icon/backward/index.html +++ b/icon/backward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/balance-scale/index.html b/icon/balance-scale/index.html index c8649ee16..8e7203267 100644 --- a/icon/balance-scale/index.html +++ b/icon/balance-scale/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ban/index.html b/icon/ban/index.html index 3b7586dd6..8ca496ad2 100644 --- a/icon/ban/index.html +++ b/icon/ban/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bandcamp/index.html b/icon/bandcamp/index.html index c5cc728b1..74df742d9 100644 --- a/icon/bandcamp/index.html +++ b/icon/bandcamp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bar-chart/index.html b/icon/bar-chart/index.html index 0e2c2cd22..c0ede5a6b 100644 --- a/icon/bar-chart/index.html +++ b/icon/bar-chart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/barcode/index.html b/icon/barcode/index.html index e2b156d31..821d02e54 100644 --- a/icon/barcode/index.html +++ b/icon/barcode/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bars/index.html b/icon/bars/index.html index 1a038a626..5cbb1e210 100644 --- a/icon/bars/index.html +++ b/icon/bars/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bath/index.html b/icon/bath/index.html index 11a70331f..32322c00a 100644 --- a/icon/bath/index.html +++ b/icon/bath/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/battery-empty/index.html b/icon/battery-empty/index.html index 94780d56b..ee1783467 100644 --- a/icon/battery-empty/index.html +++ b/icon/battery-empty/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/battery-full/index.html b/icon/battery-full/index.html index 4fd0eb09f..5367122b8 100644 --- a/icon/battery-full/index.html +++ b/icon/battery-full/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/battery-half/index.html b/icon/battery-half/index.html index d9576b02d..de0e437be 100644 --- a/icon/battery-half/index.html +++ b/icon/battery-half/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/battery-quarter/index.html b/icon/battery-quarter/index.html index 68d5b1164..5046f550a 100644 --- a/icon/battery-quarter/index.html +++ b/icon/battery-quarter/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/battery-three-quarters/index.html b/icon/battery-three-quarters/index.html index dd8b2ca7f..8941977d3 100644 --- a/icon/battery-three-quarters/index.html +++ b/icon/battery-three-quarters/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bed/index.html b/icon/bed/index.html index b4b621b5d..dc3daee90 100644 --- a/icon/bed/index.html +++ b/icon/bed/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/beer/index.html b/icon/beer/index.html index be9b5e725..430b46fae 100644 --- a/icon/beer/index.html +++ b/icon/beer/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/behance-square/index.html b/icon/behance-square/index.html index aec98aca9..bb6d8be1e 100644 --- a/icon/behance-square/index.html +++ b/icon/behance-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/behance/index.html b/icon/behance/index.html index 7524268b8..e79ed9989 100644 --- a/icon/behance/index.html +++ b/icon/behance/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bell-o/index.html b/icon/bell-o/index.html index 157d0b713..e06f8193c 100644 --- a/icon/bell-o/index.html +++ b/icon/bell-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bell-slash-o/index.html b/icon/bell-slash-o/index.html index f62fa7d52..2e86965e6 100644 --- a/icon/bell-slash-o/index.html +++ b/icon/bell-slash-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bell-slash/index.html b/icon/bell-slash/index.html index 32e777f45..817b756c3 100644 --- a/icon/bell-slash/index.html +++ b/icon/bell-slash/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bell/index.html b/icon/bell/index.html index 7200e3d22..1e8d86a3c 100644 --- a/icon/bell/index.html +++ b/icon/bell/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bicycle/index.html b/icon/bicycle/index.html index 0eb14930f..eb14ffcb4 100644 --- a/icon/bicycle/index.html +++ b/icon/bicycle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/binoculars/index.html b/icon/binoculars/index.html index 916b0e795..39fa2c34f 100644 --- a/icon/binoculars/index.html +++ b/icon/binoculars/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/birthday-cake/index.html b/icon/birthday-cake/index.html index 91d54ed5e..76f0f608d 100644 --- a/icon/birthday-cake/index.html +++ b/icon/birthday-cake/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bitbucket-square/index.html b/icon/bitbucket-square/index.html index 01801498a..c7a7ce6f4 100644 --- a/icon/bitbucket-square/index.html +++ b/icon/bitbucket-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bitbucket/index.html b/icon/bitbucket/index.html index 72870b645..1d2f16e11 100644 --- a/icon/bitbucket/index.html +++ b/icon/bitbucket/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/black-tie/index.html b/icon/black-tie/index.html index 884d977fb..0b1d5ed8c 100644 --- a/icon/black-tie/index.html +++ b/icon/black-tie/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/blind/index.html b/icon/blind/index.html index 880d265a0..4b1e63cde 100644 --- a/icon/blind/index.html +++ b/icon/blind/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bluetooth-b/index.html b/icon/bluetooth-b/index.html index 54b075d24..66879b918 100644 --- a/icon/bluetooth-b/index.html +++ b/icon/bluetooth-b/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bluetooth/index.html b/icon/bluetooth/index.html index fd0167e7d..9c6c08d58 100644 --- a/icon/bluetooth/index.html +++ b/icon/bluetooth/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bold/index.html b/icon/bold/index.html index 24ba4a5d3..4364c1baa 100644 --- a/icon/bold/index.html +++ b/icon/bold/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bolt/index.html b/icon/bolt/index.html index 227b4db6e..20530d004 100644 --- a/icon/bolt/index.html +++ b/icon/bolt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bomb/index.html b/icon/bomb/index.html index 8f53db2c6..6250f050c 100644 --- a/icon/bomb/index.html +++ b/icon/bomb/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/book/index.html b/icon/book/index.html index a3a807227..eefcae8c3 100644 --- a/icon/book/index.html +++ b/icon/book/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bookmark-o/index.html b/icon/bookmark-o/index.html index 2240d54a9..94dce4cd0 100644 --- a/icon/bookmark-o/index.html +++ b/icon/bookmark-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bookmark/index.html b/icon/bookmark/index.html index 62481fef0..5eea539f6 100644 --- a/icon/bookmark/index.html +++ b/icon/bookmark/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/braille/index.html b/icon/braille/index.html index 8c09a7a5b..9f7d01736 100644 --- a/icon/braille/index.html +++ b/icon/braille/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/briefcase/index.html b/icon/briefcase/index.html index 1cbf805c5..9a4edc8b9 100644 --- a/icon/briefcase/index.html +++ b/icon/briefcase/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/btc/index.html b/icon/btc/index.html index 718939a66..efe940f5c 100644 --- a/icon/btc/index.html +++ b/icon/btc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bug/index.html b/icon/bug/index.html index 819acc98d..b0bc0ff60 100644 --- a/icon/bug/index.html +++ b/icon/bug/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/building-o/index.html b/icon/building-o/index.html index 76a2d8f09..85aa2225b 100644 --- a/icon/building-o/index.html +++ b/icon/building-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/building/index.html b/icon/building/index.html index 81900ba51..48675c434 100644 --- a/icon/building/index.html +++ b/icon/building/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bullhorn/index.html b/icon/bullhorn/index.html index bf413cc1e..9df3ff822 100644 --- a/icon/bullhorn/index.html +++ b/icon/bullhorn/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bullseye/index.html b/icon/bullseye/index.html index 36bfb1146..86c409c5f 100644 --- a/icon/bullseye/index.html +++ b/icon/bullseye/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/bus/index.html b/icon/bus/index.html index ed54e9620..61f4b46ac 100644 --- a/icon/bus/index.html +++ b/icon/bus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/buysellads/index.html b/icon/buysellads/index.html index 38f8aa09b..49a2ad976 100644 --- a/icon/buysellads/index.html +++ b/icon/buysellads/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calculator/index.html b/icon/calculator/index.html index 7cb159994..aa8f2f0fb 100644 --- a/icon/calculator/index.html +++ b/icon/calculator/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar-check-o/index.html b/icon/calendar-check-o/index.html index b6c0763a4..3ead92b01 100644 --- a/icon/calendar-check-o/index.html +++ b/icon/calendar-check-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar-minus-o/index.html b/icon/calendar-minus-o/index.html index 8a0136e70..c72695b7b 100644 --- a/icon/calendar-minus-o/index.html +++ b/icon/calendar-minus-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar-o/index.html b/icon/calendar-o/index.html index a2e641897..40975909f 100644 --- a/icon/calendar-o/index.html +++ b/icon/calendar-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar-plus-o/index.html b/icon/calendar-plus-o/index.html index 6a4eece44..840fa9e90 100644 --- a/icon/calendar-plus-o/index.html +++ b/icon/calendar-plus-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar-times-o/index.html b/icon/calendar-times-o/index.html index 93edccc4a..ab6ef8980 100644 --- a/icon/calendar-times-o/index.html +++ b/icon/calendar-times-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/calendar/index.html b/icon/calendar/index.html index f56113d03..9f9fe43e0 100644 --- a/icon/calendar/index.html +++ b/icon/calendar/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/camera-retro/index.html b/icon/camera-retro/index.html index c070061e0..5d642d1cf 100644 --- a/icon/camera-retro/index.html +++ b/icon/camera-retro/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/camera/index.html b/icon/camera/index.html index d6f1b4ad8..d62a289de 100644 --- a/icon/camera/index.html +++ b/icon/camera/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/car/index.html b/icon/car/index.html index 73248e12b..6f7d69225 100644 --- a/icon/car/index.html +++ b/icon/car/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-down/index.html b/icon/caret-down/index.html index 0472f89f1..7fa4865b5 100644 --- a/icon/caret-down/index.html +++ b/icon/caret-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-left/index.html b/icon/caret-left/index.html index 2bc72fe27..7f166fe28 100644 --- a/icon/caret-left/index.html +++ b/icon/caret-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-right/index.html b/icon/caret-right/index.html index f432d2baf..1cc803125 100644 --- a/icon/caret-right/index.html +++ b/icon/caret-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-square-o-down/index.html b/icon/caret-square-o-down/index.html index e911f61ba..1f342e2f1 100644 --- a/icon/caret-square-o-down/index.html +++ b/icon/caret-square-o-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-square-o-left/index.html b/icon/caret-square-o-left/index.html index 5a3251423..9ffbfbff9 100644 --- a/icon/caret-square-o-left/index.html +++ b/icon/caret-square-o-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-square-o-right/index.html b/icon/caret-square-o-right/index.html index 501e3bab4..b480a61ff 100644 --- a/icon/caret-square-o-right/index.html +++ b/icon/caret-square-o-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-square-o-up/index.html b/icon/caret-square-o-up/index.html index 81bb6b28f..4eddcb19e 100644 --- a/icon/caret-square-o-up/index.html +++ b/icon/caret-square-o-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/caret-up/index.html b/icon/caret-up/index.html index 32bbf49b0..8cc9fca0f 100644 --- a/icon/caret-up/index.html +++ b/icon/caret-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cart-arrow-down/index.html b/icon/cart-arrow-down/index.html index e55b91ab8..ec0c32074 100644 --- a/icon/cart-arrow-down/index.html +++ b/icon/cart-arrow-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cart-plus/index.html b/icon/cart-plus/index.html index 9b3fbb3dc..2ccab50fc 100644 --- a/icon/cart-plus/index.html +++ b/icon/cart-plus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-amex/index.html b/icon/cc-amex/index.html index d52938ce2..10a502594 100644 --- a/icon/cc-amex/index.html +++ b/icon/cc-amex/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-diners-club/index.html b/icon/cc-diners-club/index.html index 2f145b1f4..7330aa16f 100644 --- a/icon/cc-diners-club/index.html +++ b/icon/cc-diners-club/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-discover/index.html b/icon/cc-discover/index.html index b6c680c3d..42e74ee31 100644 --- a/icon/cc-discover/index.html +++ b/icon/cc-discover/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-jcb/index.html b/icon/cc-jcb/index.html index 87d98345a..a7e3cf081 100644 --- a/icon/cc-jcb/index.html +++ b/icon/cc-jcb/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-mastercard/index.html b/icon/cc-mastercard/index.html index ee13db6fa..874d53a82 100644 --- a/icon/cc-mastercard/index.html +++ b/icon/cc-mastercard/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-paypal/index.html b/icon/cc-paypal/index.html index 4e3f9d4be..5cf2cdb8e 100644 --- a/icon/cc-paypal/index.html +++ b/icon/cc-paypal/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-stripe/index.html b/icon/cc-stripe/index.html index dda7aa7d9..f6f5f33f0 100644 --- a/icon/cc-stripe/index.html +++ b/icon/cc-stripe/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc-visa/index.html b/icon/cc-visa/index.html index 00912a12a..2d5068bd2 100644 --- a/icon/cc-visa/index.html +++ b/icon/cc-visa/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cc/index.html b/icon/cc/index.html index 67f74f154..588ed8fa1 100644 --- a/icon/cc/index.html +++ b/icon/cc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/certificate/index.html b/icon/certificate/index.html index 0bd83d6b3..f200dc6e1 100644 --- a/icon/certificate/index.html +++ b/icon/certificate/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chain-broken/index.html b/icon/chain-broken/index.html index 147ece706..f53ef61a9 100644 --- a/icon/chain-broken/index.html +++ b/icon/chain-broken/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/check-circle-o/index.html b/icon/check-circle-o/index.html index 15c39b0e2..32c53b6a1 100644 --- a/icon/check-circle-o/index.html +++ b/icon/check-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/check-circle/index.html b/icon/check-circle/index.html index 3a5722915..9aa5d4136 100644 --- a/icon/check-circle/index.html +++ b/icon/check-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/check-square-o/index.html b/icon/check-square-o/index.html index c63dac3fb..f919818f5 100644 --- a/icon/check-square-o/index.html +++ b/icon/check-square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/check-square/index.html b/icon/check-square/index.html index a2a1cfc25..0e9a997f1 100644 --- a/icon/check-square/index.html +++ b/icon/check-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/check/index.html b/icon/check/index.html index 1dec2a9c7..0b989bf58 100644 --- a/icon/check/index.html +++ b/icon/check/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-circle-down/index.html b/icon/chevron-circle-down/index.html index e03468654..4435dffe5 100644 --- a/icon/chevron-circle-down/index.html +++ b/icon/chevron-circle-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-circle-left/index.html b/icon/chevron-circle-left/index.html index 5352450c4..da59285da 100644 --- a/icon/chevron-circle-left/index.html +++ b/icon/chevron-circle-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-circle-right/index.html b/icon/chevron-circle-right/index.html index d58750caf..70f088d6f 100644 --- a/icon/chevron-circle-right/index.html +++ b/icon/chevron-circle-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-circle-up/index.html b/icon/chevron-circle-up/index.html index 4b805db49..c5fec0a21 100644 --- a/icon/chevron-circle-up/index.html +++ b/icon/chevron-circle-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-down/index.html b/icon/chevron-down/index.html index f5669e8fc..0e38f7607 100644 --- a/icon/chevron-down/index.html +++ b/icon/chevron-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-left/index.html b/icon/chevron-left/index.html index b0547526f..1d0203fb9 100644 --- a/icon/chevron-left/index.html +++ b/icon/chevron-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-right/index.html b/icon/chevron-right/index.html index 925af5e61..b06b29409 100644 --- a/icon/chevron-right/index.html +++ b/icon/chevron-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chevron-up/index.html b/icon/chevron-up/index.html index 4a6ed2dbb..ec69836a3 100644 --- a/icon/chevron-up/index.html +++ b/icon/chevron-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/child/index.html b/icon/child/index.html index 716685728..17532efd8 100644 --- a/icon/child/index.html +++ b/icon/child/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/chrome/index.html b/icon/chrome/index.html index 92239d5d1..2de7023d9 100644 --- a/icon/chrome/index.html +++ b/icon/chrome/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/circle-o-notch/index.html b/icon/circle-o-notch/index.html index 137665a21..c7eda47ef 100644 --- a/icon/circle-o-notch/index.html +++ b/icon/circle-o-notch/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/circle-o/index.html b/icon/circle-o/index.html index 43f19542c..ce69be479 100644 --- a/icon/circle-o/index.html +++ b/icon/circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/circle-thin/index.html b/icon/circle-thin/index.html index 6fd644302..f79bf56dd 100644 --- a/icon/circle-thin/index.html +++ b/icon/circle-thin/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/circle/index.html b/icon/circle/index.html index 34c7774cb..82bf2f968 100644 --- a/icon/circle/index.html +++ b/icon/circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/clipboard/index.html b/icon/clipboard/index.html index e8d1e196c..548d3f7e7 100644 --- a/icon/clipboard/index.html +++ b/icon/clipboard/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/clock-o/index.html b/icon/clock-o/index.html index 5d8dfe1fe..cc0365955 100644 --- a/icon/clock-o/index.html +++ b/icon/clock-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/clone/index.html b/icon/clone/index.html index 82e74f3d9..c296dd724 100644 --- a/icon/clone/index.html +++ b/icon/clone/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cloud-download/index.html b/icon/cloud-download/index.html index 237a711cc..d3c58ef1a 100644 --- a/icon/cloud-download/index.html +++ b/icon/cloud-download/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cloud-upload/index.html b/icon/cloud-upload/index.html index a44c52838..3252bdd40 100644 --- a/icon/cloud-upload/index.html +++ b/icon/cloud-upload/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cloud/index.html b/icon/cloud/index.html index 810236032..7d2af018f 100644 --- a/icon/cloud/index.html +++ b/icon/cloud/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/code-fork/index.html b/icon/code-fork/index.html index 93c4d8f68..ecf0c5257 100644 --- a/icon/code-fork/index.html +++ b/icon/code-fork/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/code/index.html b/icon/code/index.html index 959cff6ea..25855d482 100644 --- a/icon/code/index.html +++ b/icon/code/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/codepen/index.html b/icon/codepen/index.html index 4d7d17bd5..ad6839fed 100644 --- a/icon/codepen/index.html +++ b/icon/codepen/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/codiepie/index.html b/icon/codiepie/index.html index 2f1617204..926402636 100644 --- a/icon/codiepie/index.html +++ b/icon/codiepie/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/coffee/index.html b/icon/coffee/index.html index d816f15ec..d1143ec62 100644 --- a/icon/coffee/index.html +++ b/icon/coffee/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cog/index.html b/icon/cog/index.html index 1de618213..b165ebc37 100644 --- a/icon/cog/index.html +++ b/icon/cog/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cogs/index.html b/icon/cogs/index.html index 68678b7b2..c2a932e95 100644 --- a/icon/cogs/index.html +++ b/icon/cogs/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/columns/index.html b/icon/columns/index.html index f3d607a35..8ae85d44f 100644 --- a/icon/columns/index.html +++ b/icon/columns/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/comment-o/index.html b/icon/comment-o/index.html index c1b6ae158..a60ec25ec 100644 --- a/icon/comment-o/index.html +++ b/icon/comment-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/comment/index.html b/icon/comment/index.html index 19d515b32..47916ae27 100644 --- a/icon/comment/index.html +++ b/icon/comment/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/commenting-o/index.html b/icon/commenting-o/index.html index dcffe453d..ba5e8444d 100644 --- a/icon/commenting-o/index.html +++ b/icon/commenting-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/commenting/index.html b/icon/commenting/index.html index ba3bede19..bfe39f3a9 100644 --- a/icon/commenting/index.html +++ b/icon/commenting/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/comments-o/index.html b/icon/comments-o/index.html index e90b5ac2e..5c4083ab0 100644 --- a/icon/comments-o/index.html +++ b/icon/comments-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/comments/index.html b/icon/comments/index.html index d4e15f017..2ed86cde6 100644 --- a/icon/comments/index.html +++ b/icon/comments/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/compass/index.html b/icon/compass/index.html index 0e7d18703..f43321e9e 100644 --- a/icon/compass/index.html +++ b/icon/compass/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/compress/index.html b/icon/compress/index.html index 76f85ee35..6e2c8c2a0 100644 --- a/icon/compress/index.html +++ b/icon/compress/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/connectdevelop/index.html b/icon/connectdevelop/index.html index 1cb9ce73c..e22a6135c 100644 --- a/icon/connectdevelop/index.html +++ b/icon/connectdevelop/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/contao/index.html b/icon/contao/index.html index 55c93e5a1..cd3ae8950 100644 --- a/icon/contao/index.html +++ b/icon/contao/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/copyright/index.html b/icon/copyright/index.html index aeee42d17..495281cc6 100644 --- a/icon/copyright/index.html +++ b/icon/copyright/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/creative-commons/index.html b/icon/creative-commons/index.html index 92421a8ca..63e58f16b 100644 --- a/icon/creative-commons/index.html +++ b/icon/creative-commons/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/credit-card-alt/index.html b/icon/credit-card-alt/index.html index a50ef6d72..ea347a15e 100644 --- a/icon/credit-card-alt/index.html +++ b/icon/credit-card-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/credit-card/index.html b/icon/credit-card/index.html index de69b805e..7b91a1680 100644 --- a/icon/credit-card/index.html +++ b/icon/credit-card/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/crop/index.html b/icon/crop/index.html index f4eb9a9da..5e02c50f6 100644 --- a/icon/crop/index.html +++ b/icon/crop/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/crosshairs/index.html b/icon/crosshairs/index.html index a94f8e2ca..9c623ed4e 100644 --- a/icon/crosshairs/index.html +++ b/icon/crosshairs/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/css3/index.html b/icon/css3/index.html index 639c29eef..878349b7f 100644 --- a/icon/css3/index.html +++ b/icon/css3/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cube/index.html b/icon/cube/index.html index b5b62ff90..08e6fd9ad 100644 --- a/icon/cube/index.html +++ b/icon/cube/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cubes/index.html b/icon/cubes/index.html index 7680b5080..db97f5542 100644 --- a/icon/cubes/index.html +++ b/icon/cubes/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/cutlery/index.html b/icon/cutlery/index.html index eb94cd843..481ab4341 100644 --- a/icon/cutlery/index.html +++ b/icon/cutlery/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/dashcube/index.html b/icon/dashcube/index.html index 440db6cb7..a25c8f28a 100644 --- a/icon/dashcube/index.html +++ b/icon/dashcube/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/database/index.html b/icon/database/index.html index 36f6b0b06..569f07aff 100644 --- a/icon/database/index.html +++ b/icon/database/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/deaf/index.html b/icon/deaf/index.html index 4e7b2fcc0..42294e99a 100644 --- a/icon/deaf/index.html +++ b/icon/deaf/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -265,25 +264,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/delicious/index.html b/icon/delicious/index.html index 02d4c9584..507927a51 100644 --- a/icon/delicious/index.html +++ b/icon/delicious/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/desktop/index.html b/icon/desktop/index.html index 5267f80e0..86dbc3d8e 100644 --- a/icon/desktop/index.html +++ b/icon/desktop/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/deviantart/index.html b/icon/deviantart/index.html index 732abcf01..dd552ed9f 100644 --- a/icon/deviantart/index.html +++ b/icon/deviantart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/diamond/index.html b/icon/diamond/index.html index e3e1a6066..01ecdcbda 100644 --- a/icon/diamond/index.html +++ b/icon/diamond/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/digg/index.html b/icon/digg/index.html index 88fa78fde..445033277 100644 --- a/icon/digg/index.html +++ b/icon/digg/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/dot-circle-o/index.html b/icon/dot-circle-o/index.html index 81d39e6c5..d4997b5fc 100644 --- a/icon/dot-circle-o/index.html +++ b/icon/dot-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/download/index.html b/icon/download/index.html index 2ede81d68..fc6ba8b86 100644 --- a/icon/download/index.html +++ b/icon/download/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/dribbble/index.html b/icon/dribbble/index.html index cbf18de95..fc6f9694b 100644 --- a/icon/dribbble/index.html +++ b/icon/dribbble/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/dropbox/index.html b/icon/dropbox/index.html index 04ebea8ee..b892c2e4a 100644 --- a/icon/dropbox/index.html +++ b/icon/dropbox/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/drupal/index.html b/icon/drupal/index.html index e3d0b1cf8..727d94b77 100644 --- a/icon/drupal/index.html +++ b/icon/drupal/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/edge/index.html b/icon/edge/index.html index aaf9cff31..5d065912d 100644 --- a/icon/edge/index.html +++ b/icon/edge/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eercast/index.html b/icon/eercast/index.html index d6c7e9af5..a4449a225 100644 --- a/icon/eercast/index.html +++ b/icon/eercast/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eject/index.html b/icon/eject/index.html index ab023298b..a45020add 100644 --- a/icon/eject/index.html +++ b/icon/eject/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ellipsis-h/index.html b/icon/ellipsis-h/index.html index 18922bc53..078e572b5 100644 --- a/icon/ellipsis-h/index.html +++ b/icon/ellipsis-h/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ellipsis-v/index.html b/icon/ellipsis-v/index.html index f895f7908..ca038da53 100644 --- a/icon/ellipsis-v/index.html +++ b/icon/ellipsis-v/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/empire/index.html b/icon/empire/index.html index 01b54318c..c0436f9d0 100644 --- a/icon/empire/index.html +++ b/icon/empire/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envelope-o/index.html b/icon/envelope-o/index.html index ef843cb75..96b979f60 100644 --- a/icon/envelope-o/index.html +++ b/icon/envelope-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envelope-open-o/index.html b/icon/envelope-open-o/index.html index 3835451d2..bbce17218 100644 --- a/icon/envelope-open-o/index.html +++ b/icon/envelope-open-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envelope-open/index.html b/icon/envelope-open/index.html index 2e98c9ba7..4eaa021cd 100644 --- a/icon/envelope-open/index.html +++ b/icon/envelope-open/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envelope-square/index.html b/icon/envelope-square/index.html index b88f1eab7..87166902e 100644 --- a/icon/envelope-square/index.html +++ b/icon/envelope-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envelope/index.html b/icon/envelope/index.html index aaf8e4ed3..6d4126051 100644 --- a/icon/envelope/index.html +++ b/icon/envelope/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/envira/index.html b/icon/envira/index.html index 9da3a0c79..5ae3d6755 100644 --- a/icon/envira/index.html +++ b/icon/envira/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eraser/index.html b/icon/eraser/index.html index e8e1ff126..544194ba0 100644 --- a/icon/eraser/index.html +++ b/icon/eraser/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/etsy/index.html b/icon/etsy/index.html index 357fa3c8d..20c5ed5b0 100644 --- a/icon/etsy/index.html +++ b/icon/etsy/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eur/index.html b/icon/eur/index.html index 9e17326bb..c399a0911 100644 --- a/icon/eur/index.html +++ b/icon/eur/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/exchange/index.html b/icon/exchange/index.html index eabe5602c..b0064b935 100644 --- a/icon/exchange/index.html +++ b/icon/exchange/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/exclamation-circle/index.html b/icon/exclamation-circle/index.html index c3c7e7657..7f83914a2 100644 --- a/icon/exclamation-circle/index.html +++ b/icon/exclamation-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/exclamation-triangle/index.html b/icon/exclamation-triangle/index.html index dc2f6bfe0..6c2a5e138 100644 --- a/icon/exclamation-triangle/index.html +++ b/icon/exclamation-triangle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/exclamation/index.html b/icon/exclamation/index.html index 9b4fe021a..b98ccbc2f 100644 --- a/icon/exclamation/index.html +++ b/icon/exclamation/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/expand/index.html b/icon/expand/index.html index e2fee4fde..016b61302 100644 --- a/icon/expand/index.html +++ b/icon/expand/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/expeditedssl/index.html b/icon/expeditedssl/index.html index b8843b2f7..b4fb80eab 100644 --- a/icon/expeditedssl/index.html +++ b/icon/expeditedssl/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/external-link-square/index.html b/icon/external-link-square/index.html index 464fd1d54..f227884ef 100644 --- a/icon/external-link-square/index.html +++ b/icon/external-link-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/external-link/index.html b/icon/external-link/index.html index d17d06800..a87882fc6 100644 --- a/icon/external-link/index.html +++ b/icon/external-link/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eye-slash/index.html b/icon/eye-slash/index.html index 78cd39844..6b7f53456 100644 --- a/icon/eye-slash/index.html +++ b/icon/eye-slash/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eye/index.html b/icon/eye/index.html index c322397ad..8fe6ce3df 100644 --- a/icon/eye/index.html +++ b/icon/eye/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/eyedropper/index.html b/icon/eyedropper/index.html index b406f22e2..56c14fd2d 100644 --- a/icon/eyedropper/index.html +++ b/icon/eyedropper/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/facebook-official/index.html b/icon/facebook-official/index.html index 5e232cea2..107de3c8e 100644 --- a/icon/facebook-official/index.html +++ b/icon/facebook-official/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/facebook-square/index.html b/icon/facebook-square/index.html index a09520c31..95134975e 100644 --- a/icon/facebook-square/index.html +++ b/icon/facebook-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/facebook/index.html b/icon/facebook/index.html index 034734081..61327d0c2 100644 --- a/icon/facebook/index.html +++ b/icon/facebook/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fast-backward/index.html b/icon/fast-backward/index.html index 5458f4390..a2b0181c7 100644 --- a/icon/fast-backward/index.html +++ b/icon/fast-backward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fast-forward/index.html b/icon/fast-forward/index.html index 51ce77d41..763e17f85 100644 --- a/icon/fast-forward/index.html +++ b/icon/fast-forward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fax/index.html b/icon/fax/index.html index c2c290239..7a1dbb463 100644 --- a/icon/fax/index.html +++ b/icon/fax/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/female/index.html b/icon/female/index.html index 9d019c9e5..650893607 100644 --- a/icon/female/index.html +++ b/icon/female/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fighter-jet/index.html b/icon/fighter-jet/index.html index a5ed4824a..3a3faf755 100644 --- a/icon/fighter-jet/index.html +++ b/icon/fighter-jet/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-archive-o/index.html b/icon/file-archive-o/index.html index 59b48a06f..c2b6f7f9b 100644 --- a/icon/file-archive-o/index.html +++ b/icon/file-archive-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-audio-o/index.html b/icon/file-audio-o/index.html index 9ba3ab7f7..89d8c7fdb 100644 --- a/icon/file-audio-o/index.html +++ b/icon/file-audio-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-code-o/index.html b/icon/file-code-o/index.html index e1eee9a7c..763c598da 100644 --- a/icon/file-code-o/index.html +++ b/icon/file-code-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-excel-o/index.html b/icon/file-excel-o/index.html index 846ccda31..ed0be4263 100644 --- a/icon/file-excel-o/index.html +++ b/icon/file-excel-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-image-o/index.html b/icon/file-image-o/index.html index 3b9dc2aa4..97eff3c8c 100644 --- a/icon/file-image-o/index.html +++ b/icon/file-image-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -265,25 +264,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-o/index.html b/icon/file-o/index.html index ed9303556..163ce743e 100644 --- a/icon/file-o/index.html +++ b/icon/file-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-pdf-o/index.html b/icon/file-pdf-o/index.html index e89cfe5c9..c8059b32b 100644 --- a/icon/file-pdf-o/index.html +++ b/icon/file-pdf-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-powerpoint-o/index.html b/icon/file-powerpoint-o/index.html index 201e1c0d4..466df3863 100644 --- a/icon/file-powerpoint-o/index.html +++ b/icon/file-powerpoint-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-text-o/index.html b/icon/file-text-o/index.html index 71d21da39..4135bea53 100644 --- a/icon/file-text-o/index.html +++ b/icon/file-text-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-text/index.html b/icon/file-text/index.html index d34eeba04..d8ecf748b 100644 --- a/icon/file-text/index.html +++ b/icon/file-text/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-video-o/index.html b/icon/file-video-o/index.html index 7ec9280a1..4a0822ca8 100644 --- a/icon/file-video-o/index.html +++ b/icon/file-video-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file-word-o/index.html b/icon/file-word-o/index.html index 05cef3e03..4ac59b30e 100644 --- a/icon/file-word-o/index.html +++ b/icon/file-word-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/file/index.html b/icon/file/index.html index 50280ce05..1cd9175ce 100644 --- a/icon/file/index.html +++ b/icon/file/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/files-o/index.html b/icon/files-o/index.html index 083def196..ed1d87401 100644 --- a/icon/files-o/index.html +++ b/icon/files-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/film/index.html b/icon/film/index.html index 4a17ba5f4..1e3ed106a 100644 --- a/icon/film/index.html +++ b/icon/film/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/filter/index.html b/icon/filter/index.html index 0e5838fcf..c6b75cccb 100644 --- a/icon/filter/index.html +++ b/icon/filter/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fire-extinguisher/index.html b/icon/fire-extinguisher/index.html index 13ed452da..a7e5039b6 100644 --- a/icon/fire-extinguisher/index.html +++ b/icon/fire-extinguisher/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fire/index.html b/icon/fire/index.html index f99e2a822..76f1d5917 100644 --- a/icon/fire/index.html +++ b/icon/fire/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/firefox/index.html b/icon/firefox/index.html index 840629af0..72b302a6b 100644 --- a/icon/firefox/index.html +++ b/icon/firefox/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/first-order/index.html b/icon/first-order/index.html index 126a2f11e..d725ff43a 100644 --- a/icon/first-order/index.html +++ b/icon/first-order/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/flag-checkered/index.html b/icon/flag-checkered/index.html index a321c9996..db7a3b814 100644 --- a/icon/flag-checkered/index.html +++ b/icon/flag-checkered/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/flag-o/index.html b/icon/flag-o/index.html index 97b11d6d8..84183a819 100644 --- a/icon/flag-o/index.html +++ b/icon/flag-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/flag/index.html b/icon/flag/index.html index 382ea8103..2482ef21d 100644 --- a/icon/flag/index.html +++ b/icon/flag/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/flask/index.html b/icon/flask/index.html index 78d2f2588..bd61a842e 100644 --- a/icon/flask/index.html +++ b/icon/flask/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/flickr/index.html b/icon/flickr/index.html index c9e9f8f3f..53b3b9c9e 100644 --- a/icon/flickr/index.html +++ b/icon/flickr/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/floppy-o/index.html b/icon/floppy-o/index.html index ae1978cc8..47b3694df 100644 --- a/icon/floppy-o/index.html +++ b/icon/floppy-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/folder-o/index.html b/icon/folder-o/index.html index 86097d7f0..128bdd7f8 100644 --- a/icon/folder-o/index.html +++ b/icon/folder-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/folder-open-o/index.html b/icon/folder-open-o/index.html index a368f4ac7..680e648d8 100644 --- a/icon/folder-open-o/index.html +++ b/icon/folder-open-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/folder-open/index.html b/icon/folder-open/index.html index 3d592cdf6..8eafd6954 100644 --- a/icon/folder-open/index.html +++ b/icon/folder-open/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/folder/index.html b/icon/folder/index.html index b1006f3a2..aeb18f668 100644 --- a/icon/folder/index.html +++ b/icon/folder/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/font-awesome/index.html b/icon/font-awesome/index.html index e423e8664..1115de2a3 100644 --- a/icon/font-awesome/index.html +++ b/icon/font-awesome/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/font/index.html b/icon/font/index.html index 0face046b..8a76c051b 100644 --- a/icon/font/index.html +++ b/icon/font/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fonticons/index.html b/icon/fonticons/index.html index ef38fd8dd..d65c988be 100644 --- a/icon/fonticons/index.html +++ b/icon/fonticons/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/fort-awesome/index.html b/icon/fort-awesome/index.html index f8c36f7ed..4f3a6e021 100644 --- a/icon/fort-awesome/index.html +++ b/icon/fort-awesome/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/forumbee/index.html b/icon/forumbee/index.html index 19b4b4f99..abbd9f8b3 100644 --- a/icon/forumbee/index.html +++ b/icon/forumbee/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/forward/index.html b/icon/forward/index.html index 0230b2b40..cf859fef7 100644 --- a/icon/forward/index.html +++ b/icon/forward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/foursquare/index.html b/icon/foursquare/index.html index 3706477f7..275fd09b4 100644 --- a/icon/foursquare/index.html +++ b/icon/foursquare/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/free-code-camp/index.html b/icon/free-code-camp/index.html index 7b458a59a..db86e0382 100644 --- a/icon/free-code-camp/index.html +++ b/icon/free-code-camp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/frown-o/index.html b/icon/frown-o/index.html index 590407212..8221ff281 100644 --- a/icon/frown-o/index.html +++ b/icon/frown-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/futbol-o/index.html b/icon/futbol-o/index.html index f48281235..f5858e425 100644 --- a/icon/futbol-o/index.html +++ b/icon/futbol-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gamepad/index.html b/icon/gamepad/index.html index 936186d74..8511b493d 100644 --- a/icon/gamepad/index.html +++ b/icon/gamepad/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gavel/index.html b/icon/gavel/index.html index f5e3b2353..1a377d7b7 100644 --- a/icon/gavel/index.html +++ b/icon/gavel/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gbp/index.html b/icon/gbp/index.html index 65633927d..7425bd97d 100644 --- a/icon/gbp/index.html +++ b/icon/gbp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/genderless/index.html b/icon/genderless/index.html index c06cdea35..581a40acb 100644 --- a/icon/genderless/index.html +++ b/icon/genderless/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/get-pocket/index.html b/icon/get-pocket/index.html index 8b8119d69..ee2ad8971 100644 --- a/icon/get-pocket/index.html +++ b/icon/get-pocket/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gg-circle/index.html b/icon/gg-circle/index.html index 7dc485cd3..05d76dddd 100644 --- a/icon/gg-circle/index.html +++ b/icon/gg-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gg/index.html b/icon/gg/index.html index 12d8740c0..e2e124de8 100644 --- a/icon/gg/index.html +++ b/icon/gg/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gift/index.html b/icon/gift/index.html index ca9c0d7e0..ea693b915 100644 --- a/icon/gift/index.html +++ b/icon/gift/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/git-square/index.html b/icon/git-square/index.html index 2baf3223c..50b2371d3 100644 --- a/icon/git-square/index.html +++ b/icon/git-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/git/index.html b/icon/git/index.html index c52790f51..56c4d26e0 100644 --- a/icon/git/index.html +++ b/icon/git/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/github-alt/index.html b/icon/github-alt/index.html index e626650ef..c956165df 100644 --- a/icon/github-alt/index.html +++ b/icon/github-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/github-square/index.html b/icon/github-square/index.html index a2f17b7c7..472b44860 100644 --- a/icon/github-square/index.html +++ b/icon/github-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/github/index.html b/icon/github/index.html index 5205b3594..2ad29819d 100644 --- a/icon/github/index.html +++ b/icon/github/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gitlab/index.html b/icon/gitlab/index.html index cad7b1779..6295a5847 100644 --- a/icon/gitlab/index.html +++ b/icon/gitlab/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/glass/index.html b/icon/glass/index.html index a9d9cd7df..513e96ce8 100644 --- a/icon/glass/index.html +++ b/icon/glass/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/glide-g/index.html b/icon/glide-g/index.html index f6ed3e2e7..415af9c19 100644 --- a/icon/glide-g/index.html +++ b/icon/glide-g/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/glide/index.html b/icon/glide/index.html index d08f43a07..935bff6c0 100644 --- a/icon/glide/index.html +++ b/icon/glide/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/globe/index.html b/icon/globe/index.html index 870b2b611..71495ce3f 100644 --- a/icon/globe/index.html +++ b/icon/globe/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/google-plus-official/index.html b/icon/google-plus-official/index.html index 25c4cf86a..be745d45b 100644 --- a/icon/google-plus-official/index.html +++ b/icon/google-plus-official/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/google-plus-square/index.html b/icon/google-plus-square/index.html index e656b73d4..586062b00 100644 --- a/icon/google-plus-square/index.html +++ b/icon/google-plus-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/google-plus/index.html b/icon/google-plus/index.html index 7db1ee898..95877d704 100644 --- a/icon/google-plus/index.html +++ b/icon/google-plus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/google-wallet/index.html b/icon/google-wallet/index.html index 1bef79ef3..4d323bdb7 100644 --- a/icon/google-wallet/index.html +++ b/icon/google-wallet/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/google/index.html b/icon/google/index.html index 2a908ffc7..b61253d38 100644 --- a/icon/google/index.html +++ b/icon/google/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/graduation-cap/index.html b/icon/graduation-cap/index.html index 3accd4b7a..37aae4be8 100644 --- a/icon/graduation-cap/index.html +++ b/icon/graduation-cap/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/gratipay/index.html b/icon/gratipay/index.html index 16b91ba58..962472099 100644 --- a/icon/gratipay/index.html +++ b/icon/gratipay/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/grav/index.html b/icon/grav/index.html index 6586ddc7c..97713551b 100644 --- a/icon/grav/index.html +++ b/icon/grav/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/h-square/index.html b/icon/h-square/index.html index 2940e843a..1766c3d8a 100644 --- a/icon/h-square/index.html +++ b/icon/h-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hacker-news/index.html b/icon/hacker-news/index.html index 5472c0402..bbe7348ec 100644 --- a/icon/hacker-news/index.html +++ b/icon/hacker-news/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-lizard-o/index.html b/icon/hand-lizard-o/index.html index 599a95bcb..240143bf3 100644 --- a/icon/hand-lizard-o/index.html +++ b/icon/hand-lizard-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-o-down/index.html b/icon/hand-o-down/index.html index 4d1af4a6f..fc617cdfd 100644 --- a/icon/hand-o-down/index.html +++ b/icon/hand-o-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-o-left/index.html b/icon/hand-o-left/index.html index 3c5407bdd..a75ff476d 100644 --- a/icon/hand-o-left/index.html +++ b/icon/hand-o-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-o-right/index.html b/icon/hand-o-right/index.html index bfedef4fd..5027cf670 100644 --- a/icon/hand-o-right/index.html +++ b/icon/hand-o-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-o-up/index.html b/icon/hand-o-up/index.html index 6f88dfd02..5ff621fe9 100644 --- a/icon/hand-o-up/index.html +++ b/icon/hand-o-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-paper-o/index.html b/icon/hand-paper-o/index.html index 725c488fb..453e11255 100644 --- a/icon/hand-paper-o/index.html +++ b/icon/hand-paper-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-peace-o/index.html b/icon/hand-peace-o/index.html index 3c1f6e1b1..db2dbda93 100644 --- a/icon/hand-peace-o/index.html +++ b/icon/hand-peace-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-pointer-o/index.html b/icon/hand-pointer-o/index.html index fa670a9e7..e3272a4db 100644 --- a/icon/hand-pointer-o/index.html +++ b/icon/hand-pointer-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-rock-o/index.html b/icon/hand-rock-o/index.html index 0377b2865..e465962a1 100644 --- a/icon/hand-rock-o/index.html +++ b/icon/hand-rock-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-scissors-o/index.html b/icon/hand-scissors-o/index.html index 214fdb728..8e24fad22 100644 --- a/icon/hand-scissors-o/index.html +++ b/icon/hand-scissors-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hand-spock-o/index.html b/icon/hand-spock-o/index.html index 6328969f0..1ad3badba 100644 --- a/icon/hand-spock-o/index.html +++ b/icon/hand-spock-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/handshake-o/index.html b/icon/handshake-o/index.html index 738bc6900..82b5914a9 100644 --- a/icon/handshake-o/index.html +++ b/icon/handshake-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hashtag/index.html b/icon/hashtag/index.html index eab52e710..d59fee5fc 100644 --- a/icon/hashtag/index.html +++ b/icon/hashtag/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hdd-o/index.html b/icon/hdd-o/index.html index 1eadcdabc..85eb349c1 100644 --- a/icon/hdd-o/index.html +++ b/icon/hdd-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/header/index.html b/icon/header/index.html index a2a94bbcf..2e9d7d0e3 100644 --- a/icon/header/index.html +++ b/icon/header/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/headphones/index.html b/icon/headphones/index.html index 5e37b16d7..b2c56eaa1 100644 --- a/icon/headphones/index.html +++ b/icon/headphones/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/heart-o/index.html b/icon/heart-o/index.html index b5727ae82..a708f303a 100644 --- a/icon/heart-o/index.html +++ b/icon/heart-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/heart/index.html b/icon/heart/index.html index 52749b7ab..8de57929d 100644 --- a/icon/heart/index.html +++ b/icon/heart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/heartbeat/index.html b/icon/heartbeat/index.html index 664b2b3fd..200ea0bc8 100644 --- a/icon/heartbeat/index.html +++ b/icon/heartbeat/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/history/index.html b/icon/history/index.html index 76dc4d598..59300a4e5 100644 --- a/icon/history/index.html +++ b/icon/history/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/home/index.html b/icon/home/index.html index b38d42f39..7d9f9d25d 100644 --- a/icon/home/index.html +++ b/icon/home/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hospital-o/index.html b/icon/hospital-o/index.html index 727fb084f..22a0132f7 100644 --- a/icon/hospital-o/index.html +++ b/icon/hospital-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hourglass-end/index.html b/icon/hourglass-end/index.html index 0bcdf1fff..f587120af 100644 --- a/icon/hourglass-end/index.html +++ b/icon/hourglass-end/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hourglass-half/index.html b/icon/hourglass-half/index.html index 324cbf84a..0b5515a40 100644 --- a/icon/hourglass-half/index.html +++ b/icon/hourglass-half/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hourglass-o/index.html b/icon/hourglass-o/index.html index 556db9154..5ef74c160 100644 --- a/icon/hourglass-o/index.html +++ b/icon/hourglass-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hourglass-start/index.html b/icon/hourglass-start/index.html index 2da2c6163..34418d27c 100644 --- a/icon/hourglass-start/index.html +++ b/icon/hourglass-start/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/hourglass/index.html b/icon/hourglass/index.html index b99cd5b57..92887a9b2 100644 --- a/icon/hourglass/index.html +++ b/icon/hourglass/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/houzz/index.html b/icon/houzz/index.html index 2016188be..6d399201c 100644 --- a/icon/houzz/index.html +++ b/icon/houzz/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/html5/index.html b/icon/html5/index.html index c35f2d93d..e41f09041 100644 --- a/icon/html5/index.html +++ b/icon/html5/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/i-cursor/index.html b/icon/i-cursor/index.html index 86c0e7dff..62c661e22 100644 --- a/icon/i-cursor/index.html +++ b/icon/i-cursor/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/id-badge/index.html b/icon/id-badge/index.html index a5b51e875..763bf9ede 100644 --- a/icon/id-badge/index.html +++ b/icon/id-badge/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/id-card-o/index.html b/icon/id-card-o/index.html index 6521c28ba..5137d6657 100644 --- a/icon/id-card-o/index.html +++ b/icon/id-card-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/id-card/index.html b/icon/id-card/index.html index bbea9594a..8b75e19f1 100644 --- a/icon/id-card/index.html +++ b/icon/id-card/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ils/index.html b/icon/ils/index.html index e2fc0a08d..45cb56d7e 100644 --- a/icon/ils/index.html +++ b/icon/ils/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/imdb/index.html b/icon/imdb/index.html index 511d5b729..7a814aa90 100644 --- a/icon/imdb/index.html +++ b/icon/imdb/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/inbox/index.html b/icon/inbox/index.html index cbbe702a5..15c275f6d 100644 --- a/icon/inbox/index.html +++ b/icon/inbox/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/indent/index.html b/icon/indent/index.html index 7d5a04260..d91c25b5e 100644 --- a/icon/indent/index.html +++ b/icon/indent/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/industry/index.html b/icon/industry/index.html index 1e246aaf2..c6987d124 100644 --- a/icon/industry/index.html +++ b/icon/industry/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/info-circle/index.html b/icon/info-circle/index.html index 80b8c7f93..8713e27ec 100644 --- a/icon/info-circle/index.html +++ b/icon/info-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/info/index.html b/icon/info/index.html index 212a33f5b..3076274f8 100644 --- a/icon/info/index.html +++ b/icon/info/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/inr/index.html b/icon/inr/index.html index f7e6597b9..052d655c6 100644 --- a/icon/inr/index.html +++ b/icon/inr/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/instagram/index.html b/icon/instagram/index.html index 224ac5d8c..f9df7182d 100644 --- a/icon/instagram/index.html +++ b/icon/instagram/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/internet-explorer/index.html b/icon/internet-explorer/index.html index 6b7b4708a..37ac7a2e4 100644 --- a/icon/internet-explorer/index.html +++ b/icon/internet-explorer/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ioxhost/index.html b/icon/ioxhost/index.html index dd3cb9d90..4e33211de 100644 --- a/icon/ioxhost/index.html +++ b/icon/ioxhost/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/italic/index.html b/icon/italic/index.html index 2202f7366..82aa12f9d 100644 --- a/icon/italic/index.html +++ b/icon/italic/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/joomla/index.html b/icon/joomla/index.html index 84a0fa98e..efcf16901 100644 --- a/icon/joomla/index.html +++ b/icon/joomla/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/jpy/index.html b/icon/jpy/index.html index 73c570921..684f60140 100644 --- a/icon/jpy/index.html +++ b/icon/jpy/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -265,25 +264,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/jsfiddle/index.html b/icon/jsfiddle/index.html index b04e5bb1e..6edaef7aa 100644 --- a/icon/jsfiddle/index.html +++ b/icon/jsfiddle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/key/index.html b/icon/key/index.html index ac055b0f9..a3734bd78 100644 --- a/icon/key/index.html +++ b/icon/key/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/keyboard-o/index.html b/icon/keyboard-o/index.html index f4b7904ac..85f315c2c 100644 --- a/icon/keyboard-o/index.html +++ b/icon/keyboard-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/krw/index.html b/icon/krw/index.html index 81256fc37..3bc4822a1 100644 --- a/icon/krw/index.html +++ b/icon/krw/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/language/index.html b/icon/language/index.html index 66918e02f..eb4a86405 100644 --- a/icon/language/index.html +++ b/icon/language/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/laptop/index.html b/icon/laptop/index.html index 8d3d351b2..40c6c90bf 100644 --- a/icon/laptop/index.html +++ b/icon/laptop/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/lastfm-square/index.html b/icon/lastfm-square/index.html index 2b63c7bcf..adc171ccc 100644 --- a/icon/lastfm-square/index.html +++ b/icon/lastfm-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/lastfm/index.html b/icon/lastfm/index.html index c9941ccb5..80a6a4b58 100644 --- a/icon/lastfm/index.html +++ b/icon/lastfm/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/leaf/index.html b/icon/leaf/index.html index c6e77daff..c8e21ffd6 100644 --- a/icon/leaf/index.html +++ b/icon/leaf/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/leanpub/index.html b/icon/leanpub/index.html index 7fcf65489..f5083d1a0 100644 --- a/icon/leanpub/index.html +++ b/icon/leanpub/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/lemon-o/index.html b/icon/lemon-o/index.html index 85c6e742f..11f1a7c8a 100644 --- a/icon/lemon-o/index.html +++ b/icon/lemon-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/level-down/index.html b/icon/level-down/index.html index 43da905dd..77fba03d4 100644 --- a/icon/level-down/index.html +++ b/icon/level-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/level-up/index.html b/icon/level-up/index.html index 2c538b279..e28562668 100644 --- a/icon/level-up/index.html +++ b/icon/level-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/life-ring/index.html b/icon/life-ring/index.html index 96537f67b..8c43cba48 100644 --- a/icon/life-ring/index.html +++ b/icon/life-ring/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -267,25 +266,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/lightbulb-o/index.html b/icon/lightbulb-o/index.html index f86f20441..b566e0f34 100644 --- a/icon/lightbulb-o/index.html +++ b/icon/lightbulb-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/line-chart/index.html b/icon/line-chart/index.html index 478b9eb9f..2f34ba95d 100644 --- a/icon/line-chart/index.html +++ b/icon/line-chart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/link/index.html b/icon/link/index.html index 86ff85892..58d613ca6 100644 --- a/icon/link/index.html +++ b/icon/link/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/linkedin-square/index.html b/icon/linkedin-square/index.html index db0a607c5..7b99114f7 100644 --- a/icon/linkedin-square/index.html +++ b/icon/linkedin-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/linkedin/index.html b/icon/linkedin/index.html index 6b76ecb3d..2d6cde574 100644 --- a/icon/linkedin/index.html +++ b/icon/linkedin/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/linode/index.html b/icon/linode/index.html index d9d59a923..9374541bc 100644 --- a/icon/linode/index.html +++ b/icon/linode/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/linux/index.html b/icon/linux/index.html index 50bf3e499..2d7eea576 100644 --- a/icon/linux/index.html +++ b/icon/linux/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/list-alt/index.html b/icon/list-alt/index.html index c96e48a2d..010f17bea 100644 --- a/icon/list-alt/index.html +++ b/icon/list-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/list-ol/index.html b/icon/list-ol/index.html index 42cc40a54..e5a37fe0f 100644 --- a/icon/list-ol/index.html +++ b/icon/list-ol/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/list-ul/index.html b/icon/list-ul/index.html index 9741dcd96..28bf15d80 100644 --- a/icon/list-ul/index.html +++ b/icon/list-ul/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/list/index.html b/icon/list/index.html index 6f0fd359f..1ebc109ca 100644 --- a/icon/list/index.html +++ b/icon/list/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/location-arrow/index.html b/icon/location-arrow/index.html index c32b3b39d..2e1436eaa 100644 --- a/icon/location-arrow/index.html +++ b/icon/location-arrow/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/lock/index.html b/icon/lock/index.html index a39fcbe57..ba4dbf07c 100644 --- a/icon/lock/index.html +++ b/icon/lock/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/long-arrow-down/index.html b/icon/long-arrow-down/index.html index e4dd24c73..6390188c9 100644 --- a/icon/long-arrow-down/index.html +++ b/icon/long-arrow-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/long-arrow-left/index.html b/icon/long-arrow-left/index.html index de210abf1..3056d4e67 100644 --- a/icon/long-arrow-left/index.html +++ b/icon/long-arrow-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/long-arrow-right/index.html b/icon/long-arrow-right/index.html index d30edb015..e7d8fc01b 100644 --- a/icon/long-arrow-right/index.html +++ b/icon/long-arrow-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/long-arrow-up/index.html b/icon/long-arrow-up/index.html index c481e2e7b..cf2964482 100644 --- a/icon/long-arrow-up/index.html +++ b/icon/long-arrow-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/low-vision/index.html b/icon/low-vision/index.html index b8986e0be..a309c5f95 100644 --- a/icon/low-vision/index.html +++ b/icon/low-vision/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/magic/index.html b/icon/magic/index.html index 0672bf4c7..0f014b89d 100644 --- a/icon/magic/index.html +++ b/icon/magic/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/magnet/index.html b/icon/magnet/index.html index 547f3deb0..14d8ce618 100644 --- a/icon/magnet/index.html +++ b/icon/magnet/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/male/index.html b/icon/male/index.html index 9520f5c8f..a09c1577f 100644 --- a/icon/male/index.html +++ b/icon/male/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/map-marker/index.html b/icon/map-marker/index.html index 5c539e9dc..5b1dc6ed5 100644 --- a/icon/map-marker/index.html +++ b/icon/map-marker/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/map-o/index.html b/icon/map-o/index.html index f7cd6b3be..0b8160bcf 100644 --- a/icon/map-o/index.html +++ b/icon/map-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/map-pin/index.html b/icon/map-pin/index.html index 8b8fd704a..5cb0bf018 100644 --- a/icon/map-pin/index.html +++ b/icon/map-pin/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/map-signs/index.html b/icon/map-signs/index.html index 0a77d3abb..219e3f15b 100644 --- a/icon/map-signs/index.html +++ b/icon/map-signs/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/map/index.html b/icon/map/index.html index 06d13f7b1..77b523a73 100644 --- a/icon/map/index.html +++ b/icon/map/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mars-double/index.html b/icon/mars-double/index.html index 4c6b1207b..4c5b77795 100644 --- a/icon/mars-double/index.html +++ b/icon/mars-double/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mars-stroke-h/index.html b/icon/mars-stroke-h/index.html index 3d337c721..8064a6dd3 100644 --- a/icon/mars-stroke-h/index.html +++ b/icon/mars-stroke-h/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mars-stroke-v/index.html b/icon/mars-stroke-v/index.html index 85ec60cd9..ec3b328a8 100644 --- a/icon/mars-stroke-v/index.html +++ b/icon/mars-stroke-v/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mars-stroke/index.html b/icon/mars-stroke/index.html index b40066c01..c22e12947 100644 --- a/icon/mars-stroke/index.html +++ b/icon/mars-stroke/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mars/index.html b/icon/mars/index.html index c4569318e..da028f004 100644 --- a/icon/mars/index.html +++ b/icon/mars/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/maxcdn/index.html b/icon/maxcdn/index.html index 8b5cde02b..f1a7a6bdf 100644 --- a/icon/maxcdn/index.html +++ b/icon/maxcdn/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/meanpath/index.html b/icon/meanpath/index.html index e7c0d7617..f2f6d98bc 100644 --- a/icon/meanpath/index.html +++ b/icon/meanpath/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/medium/index.html b/icon/medium/index.html index ce3b787d9..71a399718 100644 --- a/icon/medium/index.html +++ b/icon/medium/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/medkit/index.html b/icon/medkit/index.html index 1ed22ac57..140fd3eaa 100644 --- a/icon/medkit/index.html +++ b/icon/medkit/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/meetup/index.html b/icon/meetup/index.html index c879a8734..870de3eb4 100644 --- a/icon/meetup/index.html +++ b/icon/meetup/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/meh-o/index.html b/icon/meh-o/index.html index b85d0d8bb..7eb5efcb2 100644 --- a/icon/meh-o/index.html +++ b/icon/meh-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mercury/index.html b/icon/mercury/index.html index 83986c5de..11b97ff1e 100644 --- a/icon/mercury/index.html +++ b/icon/mercury/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/microchip/index.html b/icon/microchip/index.html index 16194968d..cbdf5166c 100644 --- a/icon/microchip/index.html +++ b/icon/microchip/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/microphone-slash/index.html b/icon/microphone-slash/index.html index 1310cfcb1..630e79df4 100644 --- a/icon/microphone-slash/index.html +++ b/icon/microphone-slash/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/microphone/index.html b/icon/microphone/index.html index 066204e30..a0157d134 100644 --- a/icon/microphone/index.html +++ b/icon/microphone/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/minus-circle/index.html b/icon/minus-circle/index.html index 636b5663f..09521b5bd 100644 --- a/icon/minus-circle/index.html +++ b/icon/minus-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/minus-square-o/index.html b/icon/minus-square-o/index.html index a397efb93..12bc45dc8 100644 --- a/icon/minus-square-o/index.html +++ b/icon/minus-square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/minus-square/index.html b/icon/minus-square/index.html index bb2433f15..324e02dbf 100644 --- a/icon/minus-square/index.html +++ b/icon/minus-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/minus/index.html b/icon/minus/index.html index 5e3efc7ef..c9ffd53b8 100644 --- a/icon/minus/index.html +++ b/icon/minus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mixcloud/index.html b/icon/mixcloud/index.html index 81d020421..b697e7b51 100644 --- a/icon/mixcloud/index.html +++ b/icon/mixcloud/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mobile/index.html b/icon/mobile/index.html index f89d154b6..59cb75bbc 100644 --- a/icon/mobile/index.html +++ b/icon/mobile/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/modx/index.html b/icon/modx/index.html index 3df566ac9..51ee444a9 100644 --- a/icon/modx/index.html +++ b/icon/modx/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/money/index.html b/icon/money/index.html index 45e114d8d..355f99c27 100644 --- a/icon/money/index.html +++ b/icon/money/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/moon-o/index.html b/icon/moon-o/index.html index 181c0c1a3..4ea17dc60 100644 --- a/icon/moon-o/index.html +++ b/icon/moon-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/motorcycle/index.html b/icon/motorcycle/index.html index 907eb143e..40e22c461 100644 --- a/icon/motorcycle/index.html +++ b/icon/motorcycle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/mouse-pointer/index.html b/icon/mouse-pointer/index.html index 34bcd4905..e9fe5586e 100644 --- a/icon/mouse-pointer/index.html +++ b/icon/mouse-pointer/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/music/index.html b/icon/music/index.html index 9f259a027..d1a485bc2 100644 --- a/icon/music/index.html +++ b/icon/music/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/neuter/index.html b/icon/neuter/index.html index 851fa7df4..0c4676182 100644 --- a/icon/neuter/index.html +++ b/icon/neuter/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/newspaper-o/index.html b/icon/newspaper-o/index.html index 709e5b9db..e53c7441f 100644 --- a/icon/newspaper-o/index.html +++ b/icon/newspaper-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/object-group/index.html b/icon/object-group/index.html index 70794c6fa..66269e556 100644 --- a/icon/object-group/index.html +++ b/icon/object-group/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/object-ungroup/index.html b/icon/object-ungroup/index.html index 5c8fc9b44..cf05aa08c 100644 --- a/icon/object-ungroup/index.html +++ b/icon/object-ungroup/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/odnoklassniki-square/index.html b/icon/odnoklassniki-square/index.html index dc9e316ca..bea79abce 100644 --- a/icon/odnoklassniki-square/index.html +++ b/icon/odnoklassniki-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/odnoklassniki/index.html b/icon/odnoklassniki/index.html index a17b7791e..8a4f08e11 100644 --- a/icon/odnoklassniki/index.html +++ b/icon/odnoklassniki/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/opencart/index.html b/icon/opencart/index.html index be51b91b1..deecf6356 100644 --- a/icon/opencart/index.html +++ b/icon/opencart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/openid/index.html b/icon/openid/index.html index 64bb097e0..85910f366 100644 --- a/icon/openid/index.html +++ b/icon/openid/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/opera/index.html b/icon/opera/index.html index 34314ab66..2adb78050 100644 --- a/icon/opera/index.html +++ b/icon/opera/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/optin-monster/index.html b/icon/optin-monster/index.html index 95d932358..6380f7adb 100644 --- a/icon/optin-monster/index.html +++ b/icon/optin-monster/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/outdent/index.html b/icon/outdent/index.html index cb04b5844..ca8676f38 100644 --- a/icon/outdent/index.html +++ b/icon/outdent/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pagelines/index.html b/icon/pagelines/index.html index 353364b76..52a68f874 100644 --- a/icon/pagelines/index.html +++ b/icon/pagelines/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paint-brush/index.html b/icon/paint-brush/index.html index 2c9bc4749..9835fec6b 100644 --- a/icon/paint-brush/index.html +++ b/icon/paint-brush/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paper-plane-o/index.html b/icon/paper-plane-o/index.html index e0afce3d3..109cc9991 100644 --- a/icon/paper-plane-o/index.html +++ b/icon/paper-plane-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paper-plane/index.html b/icon/paper-plane/index.html index 3f30c03ad..624b535b2 100644 --- a/icon/paper-plane/index.html +++ b/icon/paper-plane/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paperclip/index.html b/icon/paperclip/index.html index 2283ab369..331b4a1f1 100644 --- a/icon/paperclip/index.html +++ b/icon/paperclip/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paragraph/index.html b/icon/paragraph/index.html index bd80bba27..e2d6c0a5b 100644 --- a/icon/paragraph/index.html +++ b/icon/paragraph/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pause-circle-o/index.html b/icon/pause-circle-o/index.html index 90e83c055..b25397e19 100644 --- a/icon/pause-circle-o/index.html +++ b/icon/pause-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pause-circle/index.html b/icon/pause-circle/index.html index 5f584e567..5cfd95302 100644 --- a/icon/pause-circle/index.html +++ b/icon/pause-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pause/index.html b/icon/pause/index.html index e98ca8a34..15294b0ce 100644 --- a/icon/pause/index.html +++ b/icon/pause/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paw/index.html b/icon/paw/index.html index f5e786f6e..025b0da04 100644 --- a/icon/paw/index.html +++ b/icon/paw/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/paypal/index.html b/icon/paypal/index.html index e9483bcc5..e87650e96 100644 --- a/icon/paypal/index.html +++ b/icon/paypal/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pencil-square-o/index.html b/icon/pencil-square-o/index.html index c77736e0b..ec7777825 100644 --- a/icon/pencil-square-o/index.html +++ b/icon/pencil-square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pencil-square/index.html b/icon/pencil-square/index.html index 6c179b654..32ef009de 100644 --- a/icon/pencil-square/index.html +++ b/icon/pencil-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pencil/index.html b/icon/pencil/index.html index 9b44ee6db..831a6b47a 100644 --- a/icon/pencil/index.html +++ b/icon/pencil/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/percent/index.html b/icon/percent/index.html index b570a4960..ec097ed4a 100644 --- a/icon/percent/index.html +++ b/icon/percent/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/phone-square/index.html b/icon/phone-square/index.html index 19dd97c75..e33d04780 100644 --- a/icon/phone-square/index.html +++ b/icon/phone-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/phone/index.html b/icon/phone/index.html index fac6d0388..9d0da915d 100644 --- a/icon/phone/index.html +++ b/icon/phone/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/picture-o/index.html b/icon/picture-o/index.html index b3014fa4c..21282e0e6 100644 --- a/icon/picture-o/index.html +++ b/icon/picture-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pie-chart/index.html b/icon/pie-chart/index.html index b82ad4156..e67e16254 100644 --- a/icon/pie-chart/index.html +++ b/icon/pie-chart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pied-piper-alt/index.html b/icon/pied-piper-alt/index.html index 507953565..8d41e62b9 100644 --- a/icon/pied-piper-alt/index.html +++ b/icon/pied-piper-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pied-piper-pp/index.html b/icon/pied-piper-pp/index.html index 43707f61f..0386af2a7 100644 --- a/icon/pied-piper-pp/index.html +++ b/icon/pied-piper-pp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pied-piper/index.html b/icon/pied-piper/index.html index 477b73a3e..431d2712f 100644 --- a/icon/pied-piper/index.html +++ b/icon/pied-piper/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pinterest-p/index.html b/icon/pinterest-p/index.html index 0663cbb15..1cd0e7a09 100644 --- a/icon/pinterest-p/index.html +++ b/icon/pinterest-p/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pinterest-square/index.html b/icon/pinterest-square/index.html index 8cd3d4a30..3dc1d3bea 100644 --- a/icon/pinterest-square/index.html +++ b/icon/pinterest-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/pinterest/index.html b/icon/pinterest/index.html index 767040965..59ec152a4 100644 --- a/icon/pinterest/index.html +++ b/icon/pinterest/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plane/index.html b/icon/plane/index.html index a2ea49238..bc837255e 100644 --- a/icon/plane/index.html +++ b/icon/plane/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/play-circle-o/index.html b/icon/play-circle-o/index.html index ebab9da4a..5fda4f370 100644 --- a/icon/play-circle-o/index.html +++ b/icon/play-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/play-circle/index.html b/icon/play-circle/index.html index 88d7291a7..91805beb9 100644 --- a/icon/play-circle/index.html +++ b/icon/play-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/play/index.html b/icon/play/index.html index 9ad89e253..fa10e2481 100644 --- a/icon/play/index.html +++ b/icon/play/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plug/index.html b/icon/plug/index.html index d3d1f6f47..57d26315d 100644 --- a/icon/plug/index.html +++ b/icon/plug/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plus-circle/index.html b/icon/plus-circle/index.html index b7dbd8242..29b2ed71b 100644 --- a/icon/plus-circle/index.html +++ b/icon/plus-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plus-square-o/index.html b/icon/plus-square-o/index.html index fabd358fe..195a24278 100644 --- a/icon/plus-square-o/index.html +++ b/icon/plus-square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plus-square/index.html b/icon/plus-square/index.html index c534f60d3..9992f9fb2 100644 --- a/icon/plus-square/index.html +++ b/icon/plus-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -260,25 +259,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/plus/index.html b/icon/plus/index.html index fb3796786..b35ef235a 100644 --- a/icon/plus/index.html +++ b/icon/plus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/podcast/index.html b/icon/podcast/index.html index e1a1fb03a..3bd8dc9cd 100644 --- a/icon/podcast/index.html +++ b/icon/podcast/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/power-off/index.html b/icon/power-off/index.html index a091e0952..d81a2d5c0 100644 --- a/icon/power-off/index.html +++ b/icon/power-off/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/print/index.html b/icon/print/index.html index fef2d6ec0..5a4bba02e 100644 --- a/icon/print/index.html +++ b/icon/print/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/product-hunt/index.html b/icon/product-hunt/index.html index bb41f0ff8..fed4d70bb 100644 --- a/icon/product-hunt/index.html +++ b/icon/product-hunt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/puzzle-piece/index.html b/icon/puzzle-piece/index.html index eea7d2dc4..990d340c3 100644 --- a/icon/puzzle-piece/index.html +++ b/icon/puzzle-piece/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/qq/index.html b/icon/qq/index.html index 2b596cf3a..18f093d19 100644 --- a/icon/qq/index.html +++ b/icon/qq/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/qrcode/index.html b/icon/qrcode/index.html index 38d7f8ea5..06e29518f 100644 --- a/icon/qrcode/index.html +++ b/icon/qrcode/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/question-circle-o/index.html b/icon/question-circle-o/index.html index d0acd678e..48d958578 100644 --- a/icon/question-circle-o/index.html +++ b/icon/question-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/question-circle/index.html b/icon/question-circle/index.html index a81946c91..2af94dcd1 100644 --- a/icon/question-circle/index.html +++ b/icon/question-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/question/index.html b/icon/question/index.html index cd80351b5..c60cc04b3 100644 --- a/icon/question/index.html +++ b/icon/question/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/quora/index.html b/icon/quora/index.html index 3ebf59bfd..70f0809b7 100644 --- a/icon/quora/index.html +++ b/icon/quora/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/quote-left/index.html b/icon/quote-left/index.html index e184d5b4f..d472db693 100644 --- a/icon/quote-left/index.html +++ b/icon/quote-left/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/quote-right/index.html b/icon/quote-right/index.html index 3073b603b..e809d1167 100644 --- a/icon/quote-right/index.html +++ b/icon/quote-right/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/random/index.html b/icon/random/index.html index 9655ec70b..c76e242d4 100644 --- a/icon/random/index.html +++ b/icon/random/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ravelry/index.html b/icon/ravelry/index.html index 5ec5e8ab1..36d70580b 100644 --- a/icon/ravelry/index.html +++ b/icon/ravelry/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/rebel/index.html b/icon/rebel/index.html index 2b9741dba..1a617d8d5 100644 --- a/icon/rebel/index.html +++ b/icon/rebel/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/recycle/index.html b/icon/recycle/index.html index 178df9fd0..c489ed686 100644 --- a/icon/recycle/index.html +++ b/icon/recycle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/reddit-alien/index.html b/icon/reddit-alien/index.html index 8b20d8c4f..ae5b524b2 100644 --- a/icon/reddit-alien/index.html +++ b/icon/reddit-alien/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/reddit-square/index.html b/icon/reddit-square/index.html index 8a5676688..5b7af1443 100644 --- a/icon/reddit-square/index.html +++ b/icon/reddit-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/reddit/index.html b/icon/reddit/index.html index 8b76d0e1b..5aad1dd9b 100644 --- a/icon/reddit/index.html +++ b/icon/reddit/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/refresh/index.html b/icon/refresh/index.html index 8682f7f7d..b562973fd 100644 --- a/icon/refresh/index.html +++ b/icon/refresh/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/registered/index.html b/icon/registered/index.html index 1693b7fff..5697929e6 100644 --- a/icon/registered/index.html +++ b/icon/registered/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/renren/index.html b/icon/renren/index.html index a559c2833..95648c726 100644 --- a/icon/renren/index.html +++ b/icon/renren/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/repeat/index.html b/icon/repeat/index.html index 65f803c50..ce8dffad0 100644 --- a/icon/repeat/index.html +++ b/icon/repeat/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/reply-all/index.html b/icon/reply-all/index.html index c2630b9b4..cf30a8436 100644 --- a/icon/reply-all/index.html +++ b/icon/reply-all/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/reply/index.html b/icon/reply/index.html index 8736848af..1beee8b6b 100644 --- a/icon/reply/index.html +++ b/icon/reply/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/retweet/index.html b/icon/retweet/index.html index 409ee6ee1..f8857b17c 100644 --- a/icon/retweet/index.html +++ b/icon/retweet/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/road/index.html b/icon/road/index.html index 284a06ba9..7ae3014de 100644 --- a/icon/road/index.html +++ b/icon/road/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/rocket/index.html b/icon/rocket/index.html index 0699bbab0..8e9cc03b2 100644 --- a/icon/rocket/index.html +++ b/icon/rocket/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/rss-square/index.html b/icon/rss-square/index.html index 278adf88e..029a52ea7 100644 --- a/icon/rss-square/index.html +++ b/icon/rss-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/rss/index.html b/icon/rss/index.html index a5fc51684..f51dd132a 100644 --- a/icon/rss/index.html +++ b/icon/rss/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/rub/index.html b/icon/rub/index.html index 0e329261e..31046689f 100644 --- a/icon/rub/index.html +++ b/icon/rub/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/safari/index.html b/icon/safari/index.html index 1051f1676..74199e8ea 100644 --- a/icon/safari/index.html +++ b/icon/safari/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/scissors/index.html b/icon/scissors/index.html index d8447f36a..f1049c664 100644 --- a/icon/scissors/index.html +++ b/icon/scissors/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/scribd/index.html b/icon/scribd/index.html index b7664c0d6..8faf43d65 100644 --- a/icon/scribd/index.html +++ b/icon/scribd/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/search-minus/index.html b/icon/search-minus/index.html index dc7e3e9f4..5910c8b1c 100644 --- a/icon/search-minus/index.html +++ b/icon/search-minus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/search-plus/index.html b/icon/search-plus/index.html index f5e5e05ff..718a64ee4 100644 --- a/icon/search-plus/index.html +++ b/icon/search-plus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/search/index.html b/icon/search/index.html index c295a5113..a98ef49fb 100644 --- a/icon/search/index.html +++ b/icon/search/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sellsy/index.html b/icon/sellsy/index.html index 3def35999..c2c7e22aa 100644 --- a/icon/sellsy/index.html +++ b/icon/sellsy/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/server/index.html b/icon/server/index.html index 74c7133c5..5a4a72970 100644 --- a/icon/server/index.html +++ b/icon/server/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/share-alt-square/index.html b/icon/share-alt-square/index.html index 305fc7db1..d27ab7fbf 100644 --- a/icon/share-alt-square/index.html +++ b/icon/share-alt-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/share-alt/index.html b/icon/share-alt/index.html index 1ee70ec0e..e75cc7c8b 100644 --- a/icon/share-alt/index.html +++ b/icon/share-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/share-square-o/index.html b/icon/share-square-o/index.html index 7cd475744..d391202dc 100644 --- a/icon/share-square-o/index.html +++ b/icon/share-square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/share-square/index.html b/icon/share-square/index.html index f2daab700..2d1414b8a 100644 --- a/icon/share-square/index.html +++ b/icon/share-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/share/index.html b/icon/share/index.html index d53d772f0..fc870e1bb 100644 --- a/icon/share/index.html +++ b/icon/share/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shield/index.html b/icon/shield/index.html index 519b7677d..2390de543 100644 --- a/icon/shield/index.html +++ b/icon/shield/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ship/index.html b/icon/ship/index.html index 20784e6bf..e877453d3 100644 --- a/icon/ship/index.html +++ b/icon/ship/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shirtsinbulk/index.html b/icon/shirtsinbulk/index.html index aea11cb1b..335f4822e 100644 --- a/icon/shirtsinbulk/index.html +++ b/icon/shirtsinbulk/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shopping-bag/index.html b/icon/shopping-bag/index.html index 9a9a29e2a..854addb04 100644 --- a/icon/shopping-bag/index.html +++ b/icon/shopping-bag/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shopping-basket/index.html b/icon/shopping-basket/index.html index cc6d86169..b514bade5 100644 --- a/icon/shopping-basket/index.html +++ b/icon/shopping-basket/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shopping-cart/index.html b/icon/shopping-cart/index.html index 098e7d98f..e1b173dd3 100644 --- a/icon/shopping-cart/index.html +++ b/icon/shopping-cart/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/shower/index.html b/icon/shower/index.html index 20dc94457..75906bfeb 100644 --- a/icon/shower/index.html +++ b/icon/shower/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sign-in/index.html b/icon/sign-in/index.html index e8959610c..a9ee396b7 100644 --- a/icon/sign-in/index.html +++ b/icon/sign-in/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sign-language/index.html b/icon/sign-language/index.html index 1417c7bdd..14a4cb0db 100644 --- a/icon/sign-language/index.html +++ b/icon/sign-language/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sign-out/index.html b/icon/sign-out/index.html index 83c440f37..755a872aa 100644 --- a/icon/sign-out/index.html +++ b/icon/sign-out/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/signal/index.html b/icon/signal/index.html index 5e2a24753..31994543a 100644 --- a/icon/signal/index.html +++ b/icon/signal/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/simplybuilt/index.html b/icon/simplybuilt/index.html index ecd80e2c0..b0c552779 100644 --- a/icon/simplybuilt/index.html +++ b/icon/simplybuilt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sitemap/index.html b/icon/sitemap/index.html index ccb8e502d..dd563555e 100644 --- a/icon/sitemap/index.html +++ b/icon/sitemap/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/skyatlas/index.html b/icon/skyatlas/index.html index bcf0c6772..58b7f69f7 100644 --- a/icon/skyatlas/index.html +++ b/icon/skyatlas/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/skype/index.html b/icon/skype/index.html index f34a861eb..851d757cf 100644 --- a/icon/skype/index.html +++ b/icon/skype/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/slack/index.html b/icon/slack/index.html index d999c9476..fe3271166 100644 --- a/icon/slack/index.html +++ b/icon/slack/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sliders/index.html b/icon/sliders/index.html index e35a37458..f1d2ff0e1 100644 --- a/icon/sliders/index.html +++ b/icon/sliders/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/slideshare/index.html b/icon/slideshare/index.html index 5ce251dcd..0826df89b 100644 --- a/icon/slideshare/index.html +++ b/icon/slideshare/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/smile-o/index.html b/icon/smile-o/index.html index dbfcd741d..bddcbd8ac 100644 --- a/icon/smile-o/index.html +++ b/icon/smile-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/snapchat-ghost/index.html b/icon/snapchat-ghost/index.html index e2953fe32..d726ca367 100644 --- a/icon/snapchat-ghost/index.html +++ b/icon/snapchat-ghost/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/snapchat-square/index.html b/icon/snapchat-square/index.html index 8183b9a23..cb992fc7f 100644 --- a/icon/snapchat-square/index.html +++ b/icon/snapchat-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/snapchat/index.html b/icon/snapchat/index.html index e610bc3c8..0e1e9225c 100644 --- a/icon/snapchat/index.html +++ b/icon/snapchat/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/snowflake-o/index.html b/icon/snowflake-o/index.html index 5cae9b886..f43b543d5 100644 --- a/icon/snowflake-o/index.html +++ b/icon/snowflake-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-alpha-asc/index.html b/icon/sort-alpha-asc/index.html index 316ff3a5f..f5b71dace 100644 --- a/icon/sort-alpha-asc/index.html +++ b/icon/sort-alpha-asc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-alpha-desc/index.html b/icon/sort-alpha-desc/index.html index 2750bb3df..f841d9813 100644 --- a/icon/sort-alpha-desc/index.html +++ b/icon/sort-alpha-desc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-amount-asc/index.html b/icon/sort-amount-asc/index.html index ecffc2295..32635975d 100644 --- a/icon/sort-amount-asc/index.html +++ b/icon/sort-amount-asc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-amount-desc/index.html b/icon/sort-amount-desc/index.html index 6b1d4e093..5242dc112 100644 --- a/icon/sort-amount-desc/index.html +++ b/icon/sort-amount-desc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-asc/index.html b/icon/sort-asc/index.html index c163a0f79..48a8a8d02 100644 --- a/icon/sort-asc/index.html +++ b/icon/sort-asc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-desc/index.html b/icon/sort-desc/index.html index 93617d549..743bf6253 100644 --- a/icon/sort-desc/index.html +++ b/icon/sort-desc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-numeric-asc/index.html b/icon/sort-numeric-asc/index.html index 80d9752f8..6029ea13d 100644 --- a/icon/sort-numeric-asc/index.html +++ b/icon/sort-numeric-asc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort-numeric-desc/index.html b/icon/sort-numeric-desc/index.html index 1a9d1f223..bcdd36958 100644 --- a/icon/sort-numeric-desc/index.html +++ b/icon/sort-numeric-desc/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sort/index.html b/icon/sort/index.html index fc4ade1f9..bcb7f70c3 100644 --- a/icon/sort/index.html +++ b/icon/sort/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/soundcloud/index.html b/icon/soundcloud/index.html index 850255b7b..89d839a3a 100644 --- a/icon/soundcloud/index.html +++ b/icon/soundcloud/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/space-shuttle/index.html b/icon/space-shuttle/index.html index 00f8eb7ba..a00778225 100644 --- a/icon/space-shuttle/index.html +++ b/icon/space-shuttle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/spinner/index.html b/icon/spinner/index.html index 5da857660..55b580429 100644 --- a/icon/spinner/index.html +++ b/icon/spinner/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/spoon/index.html b/icon/spoon/index.html index ba3690595..140140c49 100644 --- a/icon/spoon/index.html +++ b/icon/spoon/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/spotify/index.html b/icon/spotify/index.html index fa4ad57ad..957d2e88e 100644 --- a/icon/spotify/index.html +++ b/icon/spotify/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/square-o/index.html b/icon/square-o/index.html index 1e9234f9e..b8878f9ea 100644 --- a/icon/square-o/index.html +++ b/icon/square-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/square/index.html b/icon/square/index.html index 4e7375263..5435ba752 100644 --- a/icon/square/index.html +++ b/icon/square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stack-exchange/index.html b/icon/stack-exchange/index.html index c460a8dbf..499ec399a 100644 --- a/icon/stack-exchange/index.html +++ b/icon/stack-exchange/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stack-overflow/index.html b/icon/stack-overflow/index.html index 4c5918dae..1f07913ba 100644 --- a/icon/stack-overflow/index.html +++ b/icon/stack-overflow/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/star-half-o/index.html b/icon/star-half-o/index.html index c92407c7e..24c31fb16 100644 --- a/icon/star-half-o/index.html +++ b/icon/star-half-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/star-half/index.html b/icon/star-half/index.html index da9a1cebe..ec13211f9 100644 --- a/icon/star-half/index.html +++ b/icon/star-half/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/star-o/index.html b/icon/star-o/index.html index a7bff50e2..c48ca3f58 100644 --- a/icon/star-o/index.html +++ b/icon/star-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/star/index.html b/icon/star/index.html index f1e90d43a..2def3d701 100644 --- a/icon/star/index.html +++ b/icon/star/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/steam-square/index.html b/icon/steam-square/index.html index 2d3a7743c..f4f4020a8 100644 --- a/icon/steam-square/index.html +++ b/icon/steam-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/steam/index.html b/icon/steam/index.html index 206b80efb..aef9da7b7 100644 --- a/icon/steam/index.html +++ b/icon/steam/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/step-backward/index.html b/icon/step-backward/index.html index f522216ed..3e6426999 100644 --- a/icon/step-backward/index.html +++ b/icon/step-backward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/step-forward/index.html b/icon/step-forward/index.html index c57dd4760..9d6e7338f 100644 --- a/icon/step-forward/index.html +++ b/icon/step-forward/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stethoscope/index.html b/icon/stethoscope/index.html index 1b1fefdb7..d9d442b1e 100644 --- a/icon/stethoscope/index.html +++ b/icon/stethoscope/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sticky-note-o/index.html b/icon/sticky-note-o/index.html index 26af32377..d1cf4632d 100644 --- a/icon/sticky-note-o/index.html +++ b/icon/sticky-note-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sticky-note/index.html b/icon/sticky-note/index.html index 3972ffa04..d10e395ce 100644 --- a/icon/sticky-note/index.html +++ b/icon/sticky-note/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stop-circle-o/index.html b/icon/stop-circle-o/index.html index 19b0225ae..0d880f2c7 100644 --- a/icon/stop-circle-o/index.html +++ b/icon/stop-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stop-circle/index.html b/icon/stop-circle/index.html index 9613fb0f5..0720c8231 100644 --- a/icon/stop-circle/index.html +++ b/icon/stop-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stop/index.html b/icon/stop/index.html index 54ccc3785..85523dfb6 100644 --- a/icon/stop/index.html +++ b/icon/stop/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/street-view/index.html b/icon/street-view/index.html index c50afda44..4a6f38f85 100644 --- a/icon/street-view/index.html +++ b/icon/street-view/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/strikethrough/index.html b/icon/strikethrough/index.html index 3e1bc43f0..498b3a2df 100644 --- a/icon/strikethrough/index.html +++ b/icon/strikethrough/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stumbleupon-circle/index.html b/icon/stumbleupon-circle/index.html index a3d072770..4bf82d2ec 100644 --- a/icon/stumbleupon-circle/index.html +++ b/icon/stumbleupon-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/stumbleupon/index.html b/icon/stumbleupon/index.html index f887d17bd..27a8b6ac2 100644 --- a/icon/stumbleupon/index.html +++ b/icon/stumbleupon/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/subscript/index.html b/icon/subscript/index.html index 5c49528fe..ad577eb23 100644 --- a/icon/subscript/index.html +++ b/icon/subscript/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/subway/index.html b/icon/subway/index.html index 57cb4a9d0..717d04058 100644 --- a/icon/subway/index.html +++ b/icon/subway/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/suitcase/index.html b/icon/suitcase/index.html index 4c61c592a..d2b020da1 100644 --- a/icon/suitcase/index.html +++ b/icon/suitcase/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/sun-o/index.html b/icon/sun-o/index.html index c13af5fb7..c3c87d612 100644 --- a/icon/sun-o/index.html +++ b/icon/sun-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/superpowers/index.html b/icon/superpowers/index.html index 22b5f2db4..e29a0b0b9 100644 --- a/icon/superpowers/index.html +++ b/icon/superpowers/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/superscript/index.html b/icon/superscript/index.html index 02cc7ba31..6bb727ed0 100644 --- a/icon/superscript/index.html +++ b/icon/superscript/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/table/index.html b/icon/table/index.html index 8bafe575b..a372fc54f 100644 --- a/icon/table/index.html +++ b/icon/table/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tablet/index.html b/icon/tablet/index.html index 5ef0706ff..4725aef48 100644 --- a/icon/tablet/index.html +++ b/icon/tablet/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tachometer/index.html b/icon/tachometer/index.html index b3a6a6099..257246440 100644 --- a/icon/tachometer/index.html +++ b/icon/tachometer/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tag/index.html b/icon/tag/index.html index 8f037920b..ddd0eedc7 100644 --- a/icon/tag/index.html +++ b/icon/tag/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tags/index.html b/icon/tags/index.html index d3bc6809d..fecb7dece 100644 --- a/icon/tags/index.html +++ b/icon/tags/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tasks/index.html b/icon/tasks/index.html index 5f18eba79..3dc29a328 100644 --- a/icon/tasks/index.html +++ b/icon/tasks/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/taxi/index.html b/icon/taxi/index.html index cde87fe03..34d55efa3 100644 --- a/icon/taxi/index.html +++ b/icon/taxi/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/telegram/index.html b/icon/telegram/index.html index e42ab4c6f..7704b0b1f 100644 --- a/icon/telegram/index.html +++ b/icon/telegram/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/television/index.html b/icon/television/index.html index a88fe46ce..3545f4cb5 100644 --- a/icon/television/index.html +++ b/icon/television/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tencent-weibo/index.html b/icon/tencent-weibo/index.html index daf8e420f..931a8c907 100644 --- a/icon/tencent-weibo/index.html +++ b/icon/tencent-weibo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/terminal/index.html b/icon/terminal/index.html index a459a095c..ee0c48169 100644 --- a/icon/terminal/index.html +++ b/icon/terminal/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/text-height/index.html b/icon/text-height/index.html index a7efcbee2..ccbf2c140 100644 --- a/icon/text-height/index.html +++ b/icon/text-height/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/text-width/index.html b/icon/text-width/index.html index fcc2eb132..3ad5f224c 100644 --- a/icon/text-width/index.html +++ b/icon/text-width/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/th-large/index.html b/icon/th-large/index.html index 29db3210d..a1c8db7cf 100644 --- a/icon/th-large/index.html +++ b/icon/th-large/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/th-list/index.html b/icon/th-list/index.html index ea2e853eb..f61abbd4f 100644 --- a/icon/th-list/index.html +++ b/icon/th-list/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/th/index.html b/icon/th/index.html index ab4f392b5..82741f15e 100644 --- a/icon/th/index.html +++ b/icon/th/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/themeisle/index.html b/icon/themeisle/index.html index 97219287e..632983ce0 100644 --- a/icon/themeisle/index.html +++ b/icon/themeisle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thermometer-empty/index.html b/icon/thermometer-empty/index.html index 69659007c..c532f4663 100644 --- a/icon/thermometer-empty/index.html +++ b/icon/thermometer-empty/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thermometer-full/index.html b/icon/thermometer-full/index.html index f7798bb4e..aac122108 100644 --- a/icon/thermometer-full/index.html +++ b/icon/thermometer-full/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thermometer-half/index.html b/icon/thermometer-half/index.html index 0e4932749..38024d6b6 100644 --- a/icon/thermometer-half/index.html +++ b/icon/thermometer-half/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thermometer-quarter/index.html b/icon/thermometer-quarter/index.html index 14afa6953..2edd81020 100644 --- a/icon/thermometer-quarter/index.html +++ b/icon/thermometer-quarter/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thermometer-three-quarters/index.html b/icon/thermometer-three-quarters/index.html index cba812952..f193bf13b 100644 --- a/icon/thermometer-three-quarters/index.html +++ b/icon/thermometer-three-quarters/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thumb-tack/index.html b/icon/thumb-tack/index.html index c261d2eef..a1ee88cfa 100644 --- a/icon/thumb-tack/index.html +++ b/icon/thumb-tack/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thumbs-down/index.html b/icon/thumbs-down/index.html index a0362e761..3ff50fe99 100644 --- a/icon/thumbs-down/index.html +++ b/icon/thumbs-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thumbs-o-down/index.html b/icon/thumbs-o-down/index.html index 73deb03e9..899843958 100644 --- a/icon/thumbs-o-down/index.html +++ b/icon/thumbs-o-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thumbs-o-up/index.html b/icon/thumbs-o-up/index.html index 318b586ec..d3b523130 100644 --- a/icon/thumbs-o-up/index.html +++ b/icon/thumbs-o-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/thumbs-up/index.html b/icon/thumbs-up/index.html index 899d52f40..16ce9e7a9 100644 --- a/icon/thumbs-up/index.html +++ b/icon/thumbs-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/ticket/index.html b/icon/ticket/index.html index 084f97988..55a108da5 100644 --- a/icon/ticket/index.html +++ b/icon/ticket/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/times-circle-o/index.html b/icon/times-circle-o/index.html index 219a8fd18..b55cf1ffb 100644 --- a/icon/times-circle-o/index.html +++ b/icon/times-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/times-circle/index.html b/icon/times-circle/index.html index be7463f06..7fddd1104 100644 --- a/icon/times-circle/index.html +++ b/icon/times-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/times/index.html b/icon/times/index.html index cf3fca231..6dc26cc2e 100644 --- a/icon/times/index.html +++ b/icon/times/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tint/index.html b/icon/tint/index.html index bd0da20e1..91c1cb642 100644 --- a/icon/tint/index.html +++ b/icon/tint/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/toggle-off/index.html b/icon/toggle-off/index.html index acdf64130..bbd2a38d9 100644 --- a/icon/toggle-off/index.html +++ b/icon/toggle-off/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/toggle-on/index.html b/icon/toggle-on/index.html index 4ed75c9f5..260f6d64e 100644 --- a/icon/toggle-on/index.html +++ b/icon/toggle-on/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/trademark/index.html b/icon/trademark/index.html index 93b7a9d5f..e76d18f80 100644 --- a/icon/trademark/index.html +++ b/icon/trademark/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/train/index.html b/icon/train/index.html index 6de67ffdc..e56b74259 100644 --- a/icon/train/index.html +++ b/icon/train/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/transgender-alt/index.html b/icon/transgender-alt/index.html index 21d969ca8..cc5d39218 100644 --- a/icon/transgender-alt/index.html +++ b/icon/transgender-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/transgender/index.html b/icon/transgender/index.html index 6488c197c..f7af99e52 100644 --- a/icon/transgender/index.html +++ b/icon/transgender/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/trash-o/index.html b/icon/trash-o/index.html index 6da3dc49d..86dc51e0e 100644 --- a/icon/trash-o/index.html +++ b/icon/trash-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/trash/index.html b/icon/trash/index.html index 1905efe52..3603fcf3f 100644 --- a/icon/trash/index.html +++ b/icon/trash/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tree/index.html b/icon/tree/index.html index 162db5bb8..d5abc4b5e 100644 --- a/icon/tree/index.html +++ b/icon/tree/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/trello/index.html b/icon/trello/index.html index 39547bf42..691f9465c 100644 --- a/icon/trello/index.html +++ b/icon/trello/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tripadvisor/index.html b/icon/tripadvisor/index.html index b9942b0b3..61ac84a29 100644 --- a/icon/tripadvisor/index.html +++ b/icon/tripadvisor/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/trophy/index.html b/icon/trophy/index.html index 19f010cce..b59f7d8f0 100644 --- a/icon/trophy/index.html +++ b/icon/trophy/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/truck/index.html b/icon/truck/index.html index 10053bb17..1692dc2c7 100644 --- a/icon/truck/index.html +++ b/icon/truck/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/try/index.html b/icon/try/index.html index c810a3b62..9d726ce32 100644 --- a/icon/try/index.html +++ b/icon/try/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tty/index.html b/icon/tty/index.html index e77c6b86b..24b2fcbdc 100644 --- a/icon/tty/index.html +++ b/icon/tty/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tumblr-square/index.html b/icon/tumblr-square/index.html index ccfb1aae3..cf64c7005 100644 --- a/icon/tumblr-square/index.html +++ b/icon/tumblr-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/tumblr/index.html b/icon/tumblr/index.html index d4c5b5b2f..d2b629732 100644 --- a/icon/tumblr/index.html +++ b/icon/tumblr/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/twitch/index.html b/icon/twitch/index.html index 62084612a..c7379450b 100644 --- a/icon/twitch/index.html +++ b/icon/twitch/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/twitter-square/index.html b/icon/twitter-square/index.html index 1460a0d9a..0d8f7a30a 100644 --- a/icon/twitter-square/index.html +++ b/icon/twitter-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/twitter/index.html b/icon/twitter/index.html index 07068cd8e..297c6b6d7 100644 --- a/icon/twitter/index.html +++ b/icon/twitter/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/umbrella/index.html b/icon/umbrella/index.html index 1839e2dcc..346f29760 100644 --- a/icon/umbrella/index.html +++ b/icon/umbrella/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/underline/index.html b/icon/underline/index.html index f483b8a4e..c32ef8078 100644 --- a/icon/underline/index.html +++ b/icon/underline/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/undo/index.html b/icon/undo/index.html index 9243e3d0f..40de59915 100644 --- a/icon/undo/index.html +++ b/icon/undo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/universal-access/index.html b/icon/universal-access/index.html index a5e542e2b..51c09bdc5 100644 --- a/icon/universal-access/index.html +++ b/icon/universal-access/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/university/index.html b/icon/university/index.html index d9e361b67..ede14a1ec 100644 --- a/icon/university/index.html +++ b/icon/university/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -263,25 +262,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/unlock-alt/index.html b/icon/unlock-alt/index.html index 7c2f632c3..8ad7f0593 100644 --- a/icon/unlock-alt/index.html +++ b/icon/unlock-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/unlock/index.html b/icon/unlock/index.html index bd489d173..f85826f58 100644 --- a/icon/unlock/index.html +++ b/icon/unlock/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/upload/index.html b/icon/upload/index.html index 4cd8519fa..19c2bbf5f 100644 --- a/icon/upload/index.html +++ b/icon/upload/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/usb/index.html b/icon/usb/index.html index 334b8c45d..e1f34d9fe 100644 --- a/icon/usb/index.html +++ b/icon/usb/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/usd/index.html b/icon/usd/index.html index 87be3f4b1..d512d14f2 100644 --- a/icon/usd/index.html +++ b/icon/usd/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-circle-o/index.html b/icon/user-circle-o/index.html index 1943e5d5c..6603c2083 100644 --- a/icon/user-circle-o/index.html +++ b/icon/user-circle-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-circle/index.html b/icon/user-circle/index.html index df6e9e831..688b75acb 100644 --- a/icon/user-circle/index.html +++ b/icon/user-circle/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-md/index.html b/icon/user-md/index.html index 0c75589eb..775e3f117 100644 --- a/icon/user-md/index.html +++ b/icon/user-md/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-o/index.html b/icon/user-o/index.html index 22b951159..f2813127a 100644 --- a/icon/user-o/index.html +++ b/icon/user-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-plus/index.html b/icon/user-plus/index.html index 97fc602b1..c0b5c2c96 100644 --- a/icon/user-plus/index.html +++ b/icon/user-plus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-secret/index.html b/icon/user-secret/index.html index 0b222a4ad..c2efccddf 100644 --- a/icon/user-secret/index.html +++ b/icon/user-secret/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user-times/index.html b/icon/user-times/index.html index b987e08c2..5efee1e60 100644 --- a/icon/user-times/index.html +++ b/icon/user-times/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/user/index.html b/icon/user/index.html index 9a2f0ee53..ec2612c70 100644 --- a/icon/user/index.html +++ b/icon/user/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/users/index.html b/icon/users/index.html index 62ccb5bfb..0c0492d56 100644 --- a/icon/users/index.html +++ b/icon/users/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/venus-double/index.html b/icon/venus-double/index.html index 1616a0c69..9c6ff6f7c 100644 --- a/icon/venus-double/index.html +++ b/icon/venus-double/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/venus-mars/index.html b/icon/venus-mars/index.html index e4fbdc1c1..84b53ab2f 100644 --- a/icon/venus-mars/index.html +++ b/icon/venus-mars/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/venus/index.html b/icon/venus/index.html index a3ea82f1a..2c890a62e 100644 --- a/icon/venus/index.html +++ b/icon/venus/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/viacoin/index.html b/icon/viacoin/index.html index 59d576913..81bf8517c 100644 --- a/icon/viacoin/index.html +++ b/icon/viacoin/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -179,6 +178,8 @@ Created: v4.3 · Categories: + Currency Icons, + Brand Icons @@ -256,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/viadeo-square/index.html b/icon/viadeo-square/index.html index 4f4dde266..1e192cbe5 100644 --- a/icon/viadeo-square/index.html +++ b/icon/viadeo-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/viadeo/index.html b/icon/viadeo/index.html index 904186c02..fbc93d9b6 100644 --- a/icon/viadeo/index.html +++ b/icon/viadeo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/video-camera/index.html b/icon/video-camera/index.html index b0c528efb..340f34011 100644 --- a/icon/video-camera/index.html +++ b/icon/video-camera/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/vimeo-square/index.html b/icon/vimeo-square/index.html index 1a1070f24..aa80faff3 100644 --- a/icon/vimeo-square/index.html +++ b/icon/vimeo-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/vimeo/index.html b/icon/vimeo/index.html index 9fb8920c3..a31a60ad3 100644 --- a/icon/vimeo/index.html +++ b/icon/vimeo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/vine/index.html b/icon/vine/index.html index 8b987afac..ed38e6623 100644 --- a/icon/vine/index.html +++ b/icon/vine/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/vk/index.html b/icon/vk/index.html index 32185b564..27fa7f711 100644 --- a/icon/vk/index.html +++ b/icon/vk/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/volume-control-phone/index.html b/icon/volume-control-phone/index.html index 4c7235b52..c25ba9d4c 100644 --- a/icon/volume-control-phone/index.html +++ b/icon/volume-control-phone/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/volume-down/index.html b/icon/volume-down/index.html index 5ef549edf..58a6a8951 100644 --- a/icon/volume-down/index.html +++ b/icon/volume-down/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/volume-off/index.html b/icon/volume-off/index.html index 6deb01c37..4064b7b09 100644 --- a/icon/volume-off/index.html +++ b/icon/volume-off/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/volume-up/index.html b/icon/volume-up/index.html index a5c38e219..15d37c4c0 100644 --- a/icon/volume-up/index.html +++ b/icon/volume-up/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/weibo/index.html b/icon/weibo/index.html index c180dc278..091ac9f31 100644 --- a/icon/weibo/index.html +++ b/icon/weibo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/weixin/index.html b/icon/weixin/index.html index 3f304f745..0226c6de7 100644 --- a/icon/weixin/index.html +++ b/icon/weixin/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/whatsapp/index.html b/icon/whatsapp/index.html index 346723694..20785abfe 100644 --- a/icon/whatsapp/index.html +++ b/icon/whatsapp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wheelchair-alt/index.html b/icon/wheelchair-alt/index.html index 7628756f9..07aa5ba3d 100644 --- a/icon/wheelchair-alt/index.html +++ b/icon/wheelchair-alt/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -262,25 +261,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wheelchair/index.html b/icon/wheelchair/index.html index 5653be515..a28809df2 100644 --- a/icon/wheelchair/index.html +++ b/icon/wheelchair/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -262,25 +261,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wifi/index.html b/icon/wifi/index.html index e5ab8bb82..863f99a38 100644 --- a/icon/wifi/index.html +++ b/icon/wifi/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wikipedia-w/index.html b/icon/wikipedia-w/index.html index b6069f449..ffb5376ca 100644 --- a/icon/wikipedia-w/index.html +++ b/icon/wikipedia-w/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/window-close-o/index.html b/icon/window-close-o/index.html index fc48abfbe..b5f2d8f41 100644 --- a/icon/window-close-o/index.html +++ b/icon/window-close-o/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/window-close/index.html b/icon/window-close/index.html index b98ad76a0..1c5bdedb6 100644 --- a/icon/window-close/index.html +++ b/icon/window-close/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/window-maximize/index.html b/icon/window-maximize/index.html index a982b9930..ac11b5a1b 100644 --- a/icon/window-maximize/index.html +++ b/icon/window-maximize/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/window-minimize/index.html b/icon/window-minimize/index.html index 79bfa9261..090d9d1bf 100644 --- a/icon/window-minimize/index.html +++ b/icon/window-minimize/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/window-restore/index.html b/icon/window-restore/index.html index 730c49122..5eac42849 100644 --- a/icon/window-restore/index.html +++ b/icon/window-restore/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/windows/index.html b/icon/windows/index.html index 7cfea94b2..0c90902df 100644 --- a/icon/windows/index.html +++ b/icon/windows/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wordpress/index.html b/icon/wordpress/index.html index a122e0285..ba03d32c4 100644 --- a/icon/wordpress/index.html +++ b/icon/wordpress/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wpbeginner/index.html b/icon/wpbeginner/index.html index 4c0c618c6..c9e448f2b 100644 --- a/icon/wpbeginner/index.html +++ b/icon/wpbeginner/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wpexplorer/index.html b/icon/wpexplorer/index.html index 936eecd68..4d8639426 100644 --- a/icon/wpexplorer/index.html +++ b/icon/wpexplorer/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wpforms/index.html b/icon/wpforms/index.html index 65aed25e3..7d973eba7 100644 --- a/icon/wpforms/index.html +++ b/icon/wpforms/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/wrench/index.html b/icon/wrench/index.html index 21f376d2a..6d0a95742 100644 --- a/icon/wrench/index.html +++ b/icon/wrench/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/xing-square/index.html b/icon/xing-square/index.html index adbbb6ea0..58887ec05 100644 --- a/icon/xing-square/index.html +++ b/icon/xing-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/xing/index.html b/icon/xing/index.html index bfd834344..e6f9ac7a0 100644 --- a/icon/xing/index.html +++ b/icon/xing/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/y-combinator/index.html b/icon/y-combinator/index.html index 8d038b4d4..62ea3ae21 100644 --- a/icon/y-combinator/index.html +++ b/icon/y-combinator/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -261,25 +260,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/yahoo/index.html b/icon/yahoo/index.html index 96d972eb8..354f295ab 100644 --- a/icon/yahoo/index.html +++ b/icon/yahoo/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/yelp/index.html b/icon/yelp/index.html index 7b28ece58..a3ab6069b 100644 --- a/icon/yelp/index.html +++ b/icon/yelp/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/yoast/index.html b/icon/yoast/index.html index 7b2b99ae4..9396d12c5 100644 --- a/icon/yoast/index.html +++ b/icon/yoast/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/youtube-play/index.html b/icon/youtube-play/index.html index 022dec96e..f6db6f8a5 100644 --- a/icon/youtube-play/index.html +++ b/icon/youtube-play/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -258,25 +257,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/youtube-square/index.html b/icon/youtube-square/index.html index b95b7d7cc..99bb29ff0 100644 --- a/icon/youtube-square/index.html +++ b/icon/youtube-square/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> diff --git a/icon/youtube/index.html b/icon/youtube/index.html index bc1a274c2..81681ea96 100644 --- a/icon/youtube/index.html +++ b/icon/youtube/index.html @@ -40,17 +40,16 @@ </head> <body class="font-awesome "> <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer --> - <div class="collapse hidden-print" id="banner"> + <div class="hidden-print fa5" id="banner"> <div class="container"> <div class="message-container"> <div class="tagline"> - <span id="rotating-message"></span> - <div class="time-left"> - <span id="time-left-message"></span> - </div> + <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, & tons more. </div> <div class="action"> - <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a> + <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank"> + Font Awesome 5 <i class='fas fas-external-link'></i> + </a> </div> </div> </div> @@ -256,25 +255,53 @@ </footer> <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label"> - <div class="modal-dialog modal-lg" role="document"> + <div class="modal-dialog" role="document"> <div class="modal-content"> - <div class="modal-header"> + <div class="modal-header bg-fa5"> <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> - <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3> + <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3> </div> - <h3 class="bg-fa5 margin-none padding-lg text-center"> - Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60! - </h3> <div class="modal-body"> - <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style> - <div class="embed-container"> - <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe> + <div class="row margin-bottom-lg margin-top"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4> + <p> + Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them! + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-9"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4> + <p> + Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. + </p> + </div> + </div> + <div class="row margin-bottom-lg"> + <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm"> + <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i> + <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i> + </div> + <div class="col-md-9 col-sm-9 col-xs-10"> + <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4> + <p> + Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro. + </p> + </div> </div> - <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank" - onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);"> + <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block"> <h3 class="margin-top margin-bottom strong"> - Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! <i class="fas fas-external-link" aria-hidden="true"></i> + Font Awesome 5 <i class="fas fas-external-link" aria-hidden="true"></i> </h3> </a> |