iksi

/**
 * Fluid typography between a min & max font-size and molten leading
 * calc(minSize + (maxSize - minSize) * ((100vw - minPort) / (maxPort - minPort)));
 */
:root {
    font-size: 100%;
}

body {
    font-size: 1em;

chriseppstein

@mixin agenda($type: "Lesbian") {
  @if (rand(100) < 3) {
    &:before {
      content: "#{$type} Kisses 👄👄";
      display: none;
    }
  }
}

pestbarn

ul#hitbox {
  list-style: none;
  padding: 20px 10px; // padding to make a hitbox
  height: 20px;
  width: 20px;
  cursor: pointer;
}

li#cross {
  background: #e04681;

yarl

/*
CSS styling for <input> 
https://github.com/angular/material/issues/276

JS:

  $scope.select = "foo";
  $scope.list = ["foo", "bar"];

Front:

jonathantneal

Font Face

A mixin for writing @font-face rules in SASS.

Usage

Create a font face rule. Embedded OpenType, WOFF2, WOFF, TrueType, and SVG files are automatically sourced.

@include font-face(Samplino, fonts/Samplino);

yadomi

#!/usr/bin/python3
# -*- coding: utf8 -*-

"""Utility to sanitize some warez movies filename"""
__author__ = "Felix Yadomi"
__version__ = "0.0.3"
__email__ = "dev.yadomi@gmail.com"

import sys, os, re
from titlecase import titlecase

LukyVj

/* This morning while browsing twitter, I've found a tweet from @DavidKaneda : 
  "Does anyone have a CSS trick (ahem, @chriscoyier) for changing font-weight 
  based on available/used font?"
  
  And it gave me the idea of this small sass snippet. 
  By the way, this is not what he meant. But it's still cool. 
*/ 

$font: 'font-a';
$font: 'font-b';

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

pixelass

Mandelbrot in SCSS

The mandelbrot algorithm in SCSS. rendering the mandelbrot set in one element

<mandelbrot-set></mandelbrot-set>

A Live example

zachharkey

@mixin coverer($position: absolute) {
  position: $position;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@mixin centerer($position: absolute) {
  position: $position;