bradsiefert

// Skinny Containers
@media (max-width: 1599px) {
  .wide-contain {
    max-width: 1024px;
  }
}

@media (min-width: 1199px) {
  .slim-contain {
    max-width: 992px;

bradsiefert

// Responsive Text
@include media-breakpoint-up(xs) {
  html {
    font-size: 1.125rem;
  }
}

@include media-breakpoint-up(sm) {
  html {
    font-size: 1.1rem;

bradsiefert

a:active {
  position: relative;
  top: 2px;
}

bradsiefert

// All this is to make the footer sticky to the bottom.
html, body, #app { min-height: 100vh; }
body, #app { display: flex; flex-direction: column; }
main { flex: 1 0 auto; }
.footer { flex-shrink: 0; }

bradsiefert

<style>
  body {
    font-size: 1rem;
    background-color: white;
    color: #333;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 48px;
  }

bradsiefert

for file in *.jpg; do convert $file -resize 1600 ${file%.*}-small.jpg; done

bradsiefert

Getting a Web app Up and Running with VueJS

1. Install from Vue CLI (Choose the default settings) vue create appname

2. cd into appname cd appname

3. Install router (Choose ) vue add router

bradsiefert

# !/bin/sh
# A shell script to create a new WordPress site using Valet to develop locally.

echo "What do you want your site's folder to be named? No Spaces, only choose lowercase letters."
read wp_site_name

mkdir $wp_site_name
cd $wp_site_name

echo "Launching a new Valet site..."

bradsiefert

// 8pt Spacers Extended
$spacer: 1rem !default;
$spacers: () !default;
$spacers: map-merge((
  0: 0,
  1: ($spacer * .25), 2: ($spacer * .5),   3: ($spacer * 1),   4: ($spacer * 1.5),
  5: ($spacer * 2),   6: ($spacer * 2.5),  7: ($spacer * 3),   8: ($spacer * 3.5),
  9: ($spacer * 4),   10: ($spacer * 4.5), 11: ($spacer * 5),  12: ($spacer * 6),
  13: ($spacer * 8),  14: ($spacer * 10),  15: ($spacer * 12), 16: ($spacer * 16)
), $spacers);

bradsiefert

// Update to 8pt Grid System
$grid-gutter-width:     32px !default;
$container-max-widths:  (sm: 480px, md: 736px, lg: 992px, xl: 1200px) !default;
$grid-breakpoints:      (xs: 0, sm: 512px, md: 768px, lg: 1024px, xl: 1200px ) !default;