Skip to content

Instantly share code, notes, and snippets.

@skrdvx
skrdvx / better-font-smoothing.css
Created December 4, 2017 13:24 — forked from hsleonis/better-font-smoothing.css
Better font smoothing in cross browser
html {
/* Adjust font size */
font-size: 100%;
-webkit-text-size-adjust: 100%;
/* Font varient */
font-variant-ligatures: none;
-webkit-font-variant-ligatures: none;
/* Smoothing */
text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
@skrdvx
skrdvx / Helvetica Neue stack
Created December 2, 2017 01:23 — forked from gpessia/Helvetica Neue stack
Helvetica Neue CSS font-family stack. Is there a web-safe Helvetica Neue CSS font-family stack? - See more at: http://rachaelmoore.name/posts/design/css/web-safe-helvetica-font-stack/#sthash.lt6rYYGz.dpuf
/**
* Helvetica Neue Normal (No Stretch)
*/
/* Helvetica Neue Black Font Stack */
.{font-family: "HelveticaNeueBlack", "HelveticaNeue-Black", "Helvetica Neue Black", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Arial Black", sans-serif; font-weight:800; font-stretch:normal;}
/* Helvetica Neue Heavy Font Stack */
.{font-family: "HelveticaNeueHeavy", "HelveticaNeue-Heavy", "Helvetica Neue Heavy", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Arial Black", sans-serif; font-weight:700; font-stretch:normal;}
// Alerts
@include alert-variant($background, $border, $text-color);
// Background Variant
@include bg-variant($parent, $color);
// Border Radius
@include border-top-radius($radius);
@include border-right-radius($radius);
@include border-bottom-radius($radius);
@skrdvx
skrdvx / css-responsive-images.html
Created August 29, 2017 23:17 — forked from necolas/css-responsive-images.html
Idea for CSS-only responsive images using CSS3 generated content and attr() function. No browser implementation as of May 2011
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS responsive images</title>
<style>
/* Doesn't stop original source image being
downloaded too */
@media (min-device-width:600px) {