laurendorman

{
  "name": "example",
  "private": true,
  "description": "A simple starter to get up running with Gatsby + TailwindCSS + PostCSS + PurgeCSS",
  "version": "0.1.0",
  "author": "Lauren Dorman <[email protected]>",
  "dependencies": {
    "gatsby": "^2.19.6",
    "gatsby-image": "^2.2.39",
    "gatsby-plugin-manifest": "^2.2.38",

laurendorman

export default function updateQuery(params) {
  window.location.search = encodeURIParams(mergeObjects(decodeURIParams(), params), true);
};

function decodeURIParams(query) {
  if (query == null) {
    query = window.location.search;
  }
  
  if (query[0] == '?') {

laurendorman

@mixin apply-basis($frac) {
  > .u-grid__item {
    width: $frac * 100%;
  }
}

.u-grid {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;

laurendorman

@mixin keyframes($animation) {
  @-webkit-keyframes #{$animation} {
    @content;
  }
  @-moz-keyframes #{$animation} {
    @content;
  }
  @-o-keyframes #{$animation} {
    @content;
  }

laurendorman

// $dir = Direction of gradient
// $from = Starting color
// $to = Ending color
// $width = Border width/thickness

@mixin border-gradient($dir, $from, $to, $width) {
  border-left: $width solid $from;
  border-right: $width solid $to;
  background-image:
    // Needed for both the top and bottom borders

laurendorman

// Used to @include a cursor within a pre-existing class
@mixin cursor($cursor-type) {
  cursor: $cursor-type;
}

// Used to generate cursor classes
@mixin cursor-class($cursor-type) {
  .#{$cursor-type}-cursor { cursor: $cursor-type; }
}

laurendorman

// Utilities

// Layout
.inline { display: inline }
.block { display: block }
.inline-block { display: inline-block }

// Overflow
.overflow-hidden { overflow: hidden }
.overflow-scroll { overflow: scroll }