getdave / Tanlinell

Boilerplate Wordpress theme for rapid development of new WP themes. Based on the great work of the _s ("Underscore") theme.
GNU General Public License v2.0
6 stars 2 forks source link

Augment icon sizes and positioning classes #271

Closed getdave closed 10 years ago

getdave commented 10 years ago

Note that not all icons are designed to a 16px, 32px, 64px grid. Therefore we need alternative icon sizing classes to account for 20px,40px,60px scales.

// ==========================================================================
// SIZING MODIFIERS
// ==========================================================================

.icon--small   { font-size:16px; }
.icon--large   { font-size:32px; }
.icon--huge    { font-size:64px; }
.icon--natural { font-size:inherit; }

.icon--small-alt { font-size: 20px; }
.icon--large-alt { font-size: 40px; }
.icon--huge-alt { font-size: 60px; }

We also need to add positioning modifiers

// ==========================================================================
// POSITIONING
// ==========================================================================

// INLINE
// creates valigned icon with an appropriate RHS margin to push text away.
// ==========================================================================
.icon--inline {
    @include inline-block;
    vertical-align: text-bottom;
    margin-right: 0.2em;
}
nickwoodland commented 10 years ago

Done.

https://github.com/getdave/Tanlinell/commit/acb6102f67547d58461390ff2f8758ceef574751

Closing