Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Showing
86 changed files
with
7,080 additions
and
6,638 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,268 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/> | ||
| <title>Brutalist Framework || bIcons</title> | ||
| <meta name="description" content="A simple framework for the brutalist web design trend." /> | ||
|
|
||
| <!-- Twitter Card data --> | ||
| <meta name="twitter:card" content="summary"> | ||
| <meta name="twitter:site" content="@pinebuilder"> | ||
| <meta name="twitter:title" content="Brutalist Framework || bIcons"> | ||
| <meta name="twitter:description" content="A simple framework for the brutalist web design trend."> | ||
| <meta name="twitter:creator" content="@pinebuilder"> | ||
| <!-- Twitter Summary card images must be at least 120x120px --> | ||
| <meta name="twitter:image" content="http://www.brutalistframework.com/assets/images/brutalist-framework512.jpg"> | ||
|
|
||
| <!-- Open Graph data --> | ||
| <meta property="og:title" content="Brutalist Framework || bIcons" /> | ||
| <meta property="og:type" content="website" /> | ||
| <meta property="og:url" content="http://www.brutalistframework.com" /> | ||
| <meta property="og:image" content="http://www.brutalistframework.com/assets/images/brutalist-framework512.jpg" /> | ||
| <meta property="og:description" content="A simple framework for the brutalist web design trend." /> | ||
| <meta property="og:site_name" content="Brutalist Framework" /> | ||
|
|
||
| <!-- Icons --> | ||
| <link rel="shortcut icon" href="files/icons/bf44.png" type="image/x-icon" /> | ||
| <link rel="icon" href="files/icons/bf15.ico" type="image/x-icon" /> | ||
| <link rel="apple-touch-icon" href="files/icons/bf57.png" /> | ||
|
|
||
| <!-- CORE CSS --> | ||
| <!--<link href="core/css/dev/core.css" type="text/css" rel="stylesheet" media="screen,projection"/>--> | ||
| <link href="core/css/brutalist.min.css" type="text/css" rel="stylesheet" media="screen,projection"/> | ||
|
|
||
| <!-- Theme CSS --> | ||
| <link href="theme/default/css/theme.css" type="text/css" rel="stylesheet" media="screen,projection" /> | ||
|
|
||
| <!-- Plugins --> | ||
| <link href="plugins/megamenu/view.css" type="text/css" rel="stylesheet" media="screen,projection" /> | ||
| </head> | ||
| <body class="black"> | ||
| <header class="container-fluid triangle-light anim-bg-neon stack-base"> | ||
| <div class="row"><div class="col-sm-12"><div class="container-1200"> | ||
| <div class="row no-padding stack1 content" id="scrolltop"> | ||
| <div class="col-xs-12 col-sm-12 col-md-4 col-lg-3 no-padding"> | ||
| <a href="index.html" class="logo"><img class="responsive border-solid-fat red-border" src="files/images/brutalist-framework512.jpg" alt="Brutalist Framework" /></a> | ||
| </div> | ||
| <div class="col-xs-12 col-sm-12 col-md-8 col-lg-9 no-padding lucida-text"> | ||
| <h1 class="page-title border-solid-thick red-border courier-new-text fittext-h1 white-text baffle-prolonged">bIcons</h1> | ||
| <div class="page-desc border-solid-thick red-border rice-text"> | ||
| <h2 class="flow-text baffle">Brutal Icons</h2><br /> | ||
| <p>Native UTF-8 symbols in the form of icon classes</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div></div></div> | ||
| </header> | ||
| <div class="monochrome-gradient"> | ||
| <div class="container-1200 no-padding white"> | ||
| <div class="row"> | ||
| <div class="col-xs-12 col-sm-12 col-md-8 col-lg-9 no-padding"> | ||
| <!-- MEGAMENU --> | ||
| <div class="menu-container glued stack-top"> | ||
| <div class="menu lucida bold"> | ||
| <ul> | ||
| <li><a href="index.html">Home</a></li> | ||
| <li><a href="#">CORE</a> | ||
| <ul> | ||
| <li><a href="flavors.html">Flavors</a></li> | ||
| <li><a href="butch.html">BUTCH</a></li> | ||
| <li><a href="buix.html">BUIX</a></li> | ||
| <li><a href="bfx.html">BFX</a></li> | ||
| <li><a href="grid.html">Grid</a></li> | ||
| <li><a href="rebar.html">ReBAR</a></li> | ||
| <li><a href="bicons.html">bIcons</a></li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="extensions.html">Plugins</a> | ||
| <ul> | ||
| <li><a href="extensions.html#megamenu">Megamenu</a></li> | ||
| <li><a href="extensions.html#printer">Printer</a></li> | ||
| <li><a href="extensions.html#curvetext">CurveText</a></li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="templates.html">Starting Points</a> | ||
| <ul> | ||
| <li><a href="templates.html#emailbp">Email</a> | ||
| <ul> | ||
| <li><a href="starting-points/email-boilerplate-01.html" target="_blank">Boilerplate 01</a></li> | ||
| <li><a href="starting-points/email-boilerplate-02.html" target="_blank">Boilerplate 02</a></li> | ||
| <li><a href="starting-points/email-boilerplate-03.html" target="_blank">Boilerplate 03</a></li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="templates.html#landings">Landing Pages</a> | ||
| <ul> | ||
| <li><a href="starting-points/leads.html" target="_blank">Lead Capture</a></li> | ||
| <li><a href="starting-points/thank-you.html" target="_blank">Thank You</a></li> | ||
| <li><a href="starting-points/event.html" target="_blank">Event</a></li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="templates.html#blogs">Blog / Media</a> | ||
| <ul> | ||
| <li><a href="statting-points/blog-post-list.html" target="_blank">Blog Post List</a></li> | ||
| <li><a href="starting-points/blog-post.html" target="_blank">Blog Post</a></li> | ||
| </ul> | ||
| </li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="https://github.com/pinecreativelabs/Brutalist-Framework/wiki" target="_blank">About</a> | ||
| <ul> | ||
| <li><a href="https://github.com/pinecreativelabs/Brutalist-Framework/wiki/Roadmap" target="_blank">Roadmap</a></li> | ||
| <li><a href="https://github.com/pinecreativelabs/Brutalist-Framework" target="_blank">Github Repository</a></li> | ||
| <li><a href="https://twitter.com/brutalistfwk" target="_blank">Twitter</a></li> | ||
| </ul> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <!-- END MEGAMENU --> | ||
|
|
||
| <p class="padding"></p> | ||
| <div class="padded"> | ||
| <h4 class="lucida" id="getstarted">Getting Started</h4> | ||
| <p>Most browsers support some basic symbols, with no dependencies. <em>bIcons</em> allows you to render them by applying classes! Keep in mind that various browsers may render symbols differently. Simply use the following markup, where "icon-name" is any of the below class names.</p> | ||
| <code class="padded bold bigger lucida"><i class="bi bi-<em>icon-name</em>"></></code> | ||
| </div> | ||
| <hr class="thick tomato" /> | ||
| <div class="padding"> | ||
| <h4 class="lucida" id="genicons">General Icons</h4> | ||
| <p class="double-col flow-text"><i class="bi bi-sun"></i> sun<br /><i class="bi bi-cloud"></i> cloud<br /><i class="bi bi-thunderstorm"></i> thunderstorm<br /> | ||
| <i class="bi bi-rain"></i> rain<br /><i class="bi bi-star"></i> star<br /><i class="bi bi-star-o"></i> star-o<br /><i class="bi bi-comet"></i> comet<br /> | ||
| <i class="bi bi-phone"></i> phone<br /><i class="bi bi-phone-o"></i> phone-o<br /> | ||
| <i class="bi bi-box"></i> box<br /><i class="bi bi-box-check"></i> box-check<br /><i class="bi bi-box-x"></i> box-x<br /><i class="bi bi-music"></i> music<br /> | ||
| <i class="bi bi-opposition"></i> opposition<br /><i class="bi bi-conjunction"></i> conjunction<br /><i class="bi bi-cross"></i> cross<br /> | ||
| <i class="bi bi-balance"></i> balance<br /><i class="bi bi-sad"></i> sad<br /><i class="bi bi-happy"></i> happy<br /> | ||
| <i class="bi bi-peace"></i> peace<br /><i class="bi bi-yin-yang"></i> yin-yang<br /><i class="bi bi-love-o"></i> heart-o<br /><i class="bi bi-heart"></i> heart<br /> | ||
| <i class="bi bi-point-left"></i> point-left<br /><i class="bi bi-point-right"></i> point-right<br /><i class="bi bi-coffee"></i> coffee<br /> | ||
| <i class="bi bi-shamrock"></i> shamrock<br /><i class="bi bi-handicap"></i> handicap<br /><i class="bi bi-navigate"></i> navigate<br /> | ||
| <i class="bi bi-radioactive"></i> radioactive<br /><i class="bi bi-biohazard"></i> biohazard<br /><i class="bi bi-corners"></i> corners<br /> | ||
| <i class="bi bi-flag"></i> flag<br /><i class="bi bi-flag-o"></i> flag-o<br /><i class="bi bi-tools"></i> tools<br /><i class="bi bi-pick"></i> pick<br /> | ||
| <i class="bi bi-amp"></i> amp<br /><i class="bi bi-control"></i> control<br /> | ||
| <i class="bi bi-converge-right"></i> converge-right<br /><i class="bi bi-converge-left"></i> converge-left<br /> | ||
| <i class="bi bi-truck"></i> truck<br /><i class="bi bi-ship"></i> ship<br /><i class="bi bi-gear"></i> gear<br /><i class="bi bi-warning"></i> warning<br /> | ||
| <i class="bi bi-yield"></i> yield<br /><i class="bi bi-restricted"></i> restricted<br /><i class="bi bi-communist"></i> communist<br /> | ||
| <i class="bi bi-anchor"></i> anchor<br /><i class="bi bi-chains"></i> chains<br /><i class="bi bi-two-way"></i> two-way<br /><i class="bi bi-two-way-o"></i> two-way-o<br /> | ||
| <i class="bi bi-dead"></i> dead<br /><i class="bi bi-baseball"></i> baseball<br /><i class="bi bi-soccer"></i> soccer<br /><i class="bi bi-golf"></i> golf<br /> | ||
| <i class="bi bi-beach"></i> beach<br /> | ||
| <i class="bi bi-camp"></i> camp<br /><i class="bi bi-fuel"></i> fuel<br /><i class="bi bi-church"></i> church<br /><i class="bi bi-recycle"></i> recycle<br /> | ||
| <i class="bi bi-king"></i> king<br /><i class="bi bi-queen"></i> queen<br /><i class="bi bi-male"></i> male<br /><i class="bi bi-female"></i> female<br /> | ||
| </p> | ||
| <h4 class="lucida" id="horoscopes">Horoscope Icons</h4> | ||
| <p class="double-col flow-text"> | ||
| <i class="bi bi-aquarius"></i> aquarius<br /><i class="bi bi-aries"></i> aries<br /><i class="bi bi-cancer"></i> cancer<br /><i class="bi bi-capricorn"></i> capricorn<br /> | ||
| <i class="bi bi-gemini"></i> gemini<br /><i class="bi bi-leo"></i> leo<br /><i class="bi bi-libra"></i> libra<br /><i class="bi bi-pisces"></i> pisces<br /> | ||
| <i class="bi bi-saggitarius"></i> saggitarius<br /><i class="bi bi-scorpius"></i> scorpius<br /><i class="bi bi-taurus"></i> taurus<br /><i class="bi bi-virgo"></i> virgo | ||
| </p> | ||
|
|
||
| </div> | ||
| <p class="padding"></p> | ||
| </div> | ||
| <!-- Sidebar --> | ||
| <div class="col-xs-12 col-sm-12 col-md-4 col-lg-3 no-padding black"> | ||
| <img src="files/images/angle2.jpg" alt="bIcons" class="responsive" style="margin-bottom: -6px;" /> | ||
| <div class="glued"> | ||
| <div class="row"> | ||
| <div class="col-xs-12 no-padding"> | ||
| <nav class="simple blue"> | ||
| <ul class="courier-new-text flow-text lime-text"> | ||
| <li class="invert-hover"><a href="#getstarted" class="lime-text">Getting Started</a></li> | ||
| <li class="invert-hover"><a href="#genicons" class="lime-text">General Icons</a></li> | ||
| <li class="invert-hover"><a href="#horoscopes" class="lime-text">Horoscope Icons</a></li> | ||
| </ul> | ||
| </nav> | ||
| </div> | ||
| </div> | ||
| <a href="#scrolltop" class="lime invert-hover bold black-text scrolltop lucida-text">Back to Top ↑</a> | ||
| </div> | ||
| </div><!-- End Sidebar --> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <footer> | ||
| <div class="container-1200 no-padding"> | ||
| <div class="row"> | ||
| <div class="col-sm-12"> | ||
| <div class="jagged gray"> | ||
| <div class="row"> | ||
| <div class="col-sm-12 col-md-12 col-lg-4"> | ||
| <div class="padding vanilla-bean-text arial"> | ||
| <p>A <a href="http://www.pinecreativelabs.com" target="_blank" class="green yellow-text invert-hover">Pine Creative Labs</a> production</p> | ||
| <p>Developer: <a href="https://www.linkedin.com/in/bradfogelstrom" target="_blank"><span class="blue yellow-text invert-hover">Brad Fogelstrom</span></a></p> | ||
| </div> | ||
| </div> | ||
| <div class="col-sm-12 col-md-12 col-lg-4"> | ||
| <div class="padding flow-text vanilla-bean-text arial"> | ||
| <p>Interview on<br /><a href="http://www.brutalistwebsites.com/brutalistframework.com" target="_blank" class="white blue-text invert-hover">BrutalistWebsites.com</a> | ||
| </div> | ||
| </div> | ||
| <div class="col-sm-12 col-md-12 col-lg-4"> | ||
| <div class="padding arial vanilla-bean-text"> | ||
| <p class="flow-text">Contact us:</p> | ||
| <ul class="tags"> | ||
| <li><a href="http://www.twitter.com/brutalistfwk" target="_blank" class="btn white-text blue-candy hue-hover"><strong>Twitter</strong></a></li> | ||
| <li><a href="https://github.com/pinecreativelabs/Brutalist-Framework" target="_blank" class="btn black white-text invert-hover"><strong>GitHub</strong></a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <p class="center white-text lucida-text">© 2020 <em>BrutalistFramework</em>. All rights reserved.</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </footer> | ||
|
|
||
| <!-- Sticky Download Box --> | ||
| <a href="#download" data-modal-open> | ||
| <div class="sticky-bottom-right stack-top red jagged" style="padding: 8px;"> | ||
| <div class="skew sweden btn invert-hover"> | ||
| <p class="flow-text lucida skew-right"><strong>Download</strong></p> | ||
| </div> | ||
| <p class="glitch bold yellow-text center">Version 2.0.2.0</p> | ||
| </div></a> | ||
| <!-- Download Modal --> | ||
| <div id="download" style="display:none;"> | ||
| <div class="container monochrome" style="max-width: 760px;"> | ||
| <div class="row"> | ||
| <div class="col-sm-12 col-md-6 no-padding"> | ||
| <div class="padded"> | ||
| <h4 class="lucida">Download</h5> | ||
| <p>Released 2/20/2020</p> | ||
| <p class="bigger bold"><a href="http://www.brutalistframework.com/versions/Brutalist_Framework_2.0.zip" target="_blank" class="btn full-btn sweden invert-hover">Download 2.0.2.0</a></p><hr class="jagged-rule-dark" /> | ||
| <p><strong><span style="font-size: 1.4em;">Legacy Versions</span></strong><br /> | ||
| <a href="http://www.brutalistframework.com/versions/Brutalist_Framework_1.9.zip" target="_blank">Brutalist Framework 1.9</a><br /><br /></p> | ||
| </div> | ||
| </div> | ||
| <div class="col-sm-12 col-md-6 no-padding"> | ||
| <div class="sweden-gradient padded"> | ||
| <h5 class="lucida white-text"><i class="bi bi-amp"></i>Brutal Blast /<span class="blink-182">/</span>/<span class="blink">/</span>/</h5> | ||
| <p class="bold">Subscribe to our e-newsletter and receive periodic updates.</p> | ||
| </div> | ||
| <div class="black padded"> | ||
| <!-- Email signup form here --> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <!-- Initiate and display modal itself --> | ||
| <div class="modal"> | ||
| <div class="modal-inner draggable"><!-- Remove "draggable" class to prevent modals from being moveable --> | ||
| <span data-modal-close>×</span> | ||
| <div class="modal-content"></div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Scripts--> | ||
| <script src="core/js/jquery.js"></script> | ||
| <script src="core/js/brutalist.js"></script> | ||
| <script src="core/js/start.brutalizing.js"></script> | ||
|
|
||
| <!-- Plugin Scripts --> | ||
| <script src="plugins/megamenu/view.js"></script> | ||
|
|
||
| <!-- TRACKING --> | ||
|
|
||
| </body> | ||
| </html> |
Oops, something went wrong.