From fd39dae3246863ca39a3b0d50565557d830cde21 Mon Sep 17 00:00:00 2001
From: John Ray <john@johnraymon.com>
Date: Sun, 21 Jul 2019 07:58:04 -0400
Subject: [PATCH] Add `vw-100` class to represent `width: 100vw`.

Added `vw-100`, `vw-100-ns`, `vw-100-m`, `vw-100-l`
---
 src/_widths.css | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/_widths.css b/src/_widths.css
index bfbd516..c8e794a 100644
--- a/src/_widths.css
+++ b/src/_widths.css
@@ -5,6 +5,7 @@
 
    Base:
      w = width
+     vw = view-width; 
 
    Modifiers
      1 = 1st step in width scale
@@ -63,6 +64,8 @@
 .w-90 {  width:  90%; }
 .w-100 { width: 100%; }
 
+.vw-100 { width: 100vw; }
+
 .w-third { width: calc(100% / 3); }
 .w-two-thirds { width: calc(100% / 1.5); }
 .w-auto { width: auto; }
@@ -87,6 +90,7 @@
   .w-80-ns { width:  80%; }
   .w-90-ns { width:  90%; }
   .w-100-ns { width: 100%; }
+  .vw-100-ns { width: 100vw; }
   .w-third-ns { width: calc(100% / 3); }
   .w-two-thirds-ns { width: calc(100% / 1.5); }
   .w-auto-ns { width: auto; }
@@ -112,6 +116,7 @@
   .w-80-m { width:  80%; }
   .w-90-m { width:  90%; }
   .w-100-m { width: 100%; }
+  .vw-100-m { width: 100vw; }
   .w-third-m { width: calc(100% / 3); }
   .w-two-thirds-m { width: calc(100% / 1.5); }
   .w-auto-m {    width: auto; }
@@ -137,6 +142,7 @@
   .w-80-l {    width:  80%; }
   .w-90-l {    width:  90%; }
   .w-100-l {   width: 100%; }
+  .vw-100-l { width: 100vw; }
   .w-third-l { width: calc(100% / 3); }
   .w-two-thirds-l { width: calc(100% / 1.5); }
   .w-auto-l {    width: auto; }