Skip to content

Instantly share code, notes, and snippets.

View scottgruber's full-sized avatar

Scott Gruber scottgruber

42 followers · 28 following
View GitHub Profile
@scottgruber
scottgruber / wmrc-field-stations.geojson
Created February 11, 2021 20:03
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@scottgruber
scottgruber / svg-example
Created May 9, 2020 21:55
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" class="svg tiger" data-name="tiger" viewBox="0 0 133.64 93.06">
<g class="ear-left">
<path class="ear-left-outer" d="M30.63,43.81s-23.1-18-9.72-36.26c0,0,15.91-22.75,40.08,10.74Z" fill="#ffc50a"></path>
<path class="ear-left-inner" d="M34.23,27.22S22.55,20.3,27.77,11.4c0,0,6.15-11.07,19.16,2.76Z"></path>
</g>
<g class="ear-right">
<path class="ear-right-outer" d="M103.32,43.81s23.09-18,9.71-36.26c0,0-15.91-22.75-40.07,10.74Z" fill="#ffc50a"></path>
<path class="ear-right-inner" d="M99.71,27.22s11.69-6.92,6.47-15.82c0,0-6.16-11.07-19.17,2.76Z"></path>
</g>
@scottgruber
scottgruber / bottle-recycling.geojson
Last active April 17, 2020 19:01
Deposit Refund Systems
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@scottgruber
scottgruber / audubon.css
Last active January 21, 2020 19:09
@charset "UTF-8";
.clear:after {
display: block;
visibility: hidden;
font-size: 0;
height: 0;
clear: both;
content: ".";
}
@scottgruber
scottgruber / empty-example.markdown
Created October 21, 2019 05:02
empty-example
@scottgruber
scottgruber / _colors.scss
Created July 30, 2019 17:39
UCLA Brand Colors 2019
// 2019 UCLA Color Palette SCSS
// Hex color space
$ucla-gold: #ffd100;
$ucla-blue: #2774ae;
$ucla-lightest-blue: #daebfe;
$ucla-lighter-blue: #8bb8e8;
$ucla-darker-blue: #005587;
$ucla-darkest-blue: #003b5c;
$ucla-darker-gold: #ffc72c;
@scottgruber
scottgruber / stylelint-order-config
Last active July 29, 2019 21:14
'use strict';
// See https://github.com/hudochenkov/stylelint-order
const order = [
// Overview
'all',
'content',
'box-sizing',
'will-change',
@scottgruber
scottgruber / Card Overlay List CSS Grid
Last active April 11, 2019 02:14
Card List component using CSS Grid, Flexbox and Semantic HTML
.ioes-c-card-overlay-grid {
display: grid;
grid-gap: 2vw;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
grid-template-rows: auto;
margin: 2vw;
}
.ioes-c-card-overlay figure {
@scottgruber
scottgruber / CSS Intrinsic Sizing
Created March 27, 2019 03:45
The min-content keyword gives us the width of the largest unbreakable element inside the box (i.e., the widest word or image or fixed-width box). This is exactly what we need! Now, giving our figures an appropriate width and horizontally centering them as simple is two lines of code: Fall back for older browser doesn't work unless you know exact…
figure {
width: min-content;
margin: auto;
}
@scottgruber
scottgruber / export-perch-blog-to-json
Last active December 5, 2023 13:20
Two scripts to export Perch blog posts to JSON and then import the JSON into a Perch Runway collection
<?php
//include('../perch/runtime.php');
$site_url = 'https://'.$_SERVER['HTTP_HOST'];
$items = perch_blog_custom([
'count' => 100,
'sort' => 'postDateTime',
'sort-order' => 'DESC',
'skip-template' => true,
]);