From 3bad6d0f65f399f9c2c662025f9cf9527e90fe4b Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Thu, 19 Oct 2017 18:02:02 -0400 Subject: [PATCH 01/11] Update to latest default config as base --- docs/tailwind.js | 307 +++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 285 insertions(+), 22 deletions(-) diff --git a/docs/tailwind.js b/docs/tailwind.js index f5e040f76..917ccfb71 100644 --- a/docs/tailwind.js +++ b/docs/tailwind.js @@ -1,23 +1,286 @@ -module.exports = { - "extend": { - "sizing": { - "width": { - "128": "32rem", - } - }, - "spacing": { - "padding": { - "12": "3rem", - "16": "4rem" - }, - "margin": { - "12": "3rem", - "16": "4rem" - }, - "negativeMargin": { - "12": "3rem", - "16": "4rem" - }, - } - } +var colors = { + 'black': '#000000', + 'white': '#ffffff', + 'transparent': 'transparent', + + 'slate-darker': '#212b35', + 'slate-dark': '#404e5c', + 'slate': '#647382', + 'slate-light': '#919eab', + 'slate-lighter': '#c5ced6', + + 'smoke-darker': '#919eab', + 'smoke-dark': '#c5ced6', + 'smoke': '#dfe3e8', + 'smoke-light': '#f0f2f5', + 'smoke-lighter': '#f7f9fa', + + 'red-darker': '#960f0d', + 'red-dark': '#d43633', + 'red': '#f25451', + 'red-light': '#fa8785', + 'red-lighter': '#fff1f0', + + 'orange-darker': '#875200', + 'orange-dark': '#f29500', + 'orange': '#ffb82b', + 'orange-light': '#ffd685', + 'orange-lighter': '#fff8eb', + + 'yellow-darker': '#966100', + 'yellow-dark': '#ffc400', + 'yellow': '#ffe14a', + 'yellow-light': '#ffea83', + 'yellow-lighter': '#fffbe5', + + 'green-darker': '#056619', + 'green-dark': '#34ae4c', + 'green': '#57d06f', + 'green-light': '#b1f3be', + 'green-lighter': '#eefff1', + + 'teal-darker': '#025654', + 'teal-dark': '#249e9a', + 'teal': '#4dc0b5', + 'teal-light': '#9eebe4', + 'teal-lighter': '#e8fdfa', + + 'blue-darker': '#154267', + 'blue-dark': '#3687c8', + 'blue': '#4aa2ea', + 'blue-light': '#acdaff', + 'blue-lighter': '#f1f9ff', + + 'indigo-darker': '#242b54', + 'indigo-dark': '#4957a5', + 'indigo': '#6574cd', + 'indigo-light': '#bcc5fb', + 'indigo-lighter': '#f4f5ff', + + 'purple-darker': '#331f56', + 'purple-dark': '#714cb4', + 'purple': '#976ae6', + 'purple-light': '#ceb3ff', + 'purple-lighter': '#f7f3ff', + + 'pink-darker': '#6b2052', + 'pink-dark': '#d84f7d', + 'pink': '#f66d9b', + 'pink-light': '#ffa5c3', + 'pink-lighter': '#fdf2f5', +} + +module.exports = { + colors: colors, + screens: { + sm: '576px', + md: '768px', + lg: '992px', + xl: '1200px', + }, + text: { + fonts: { + 'sans': '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', + 'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif', + 'mono': 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace', + }, + sizes: { + 'base': '1rem', // 16px + 'xs': '.75rem', // 12px + 'sm': '.875rem', // 14px + 'md': '1rem', // 16px + 'lg': '1.125rem', // 18px + 'xl': '1.25rem', // 20px + '2xl': '1.75rem', // 28px + '3xl': '2.375rem', // 38px + '4xl': '2.875rem', // 46px + }, + weights: { + 'hairline': 100, + 'thin': 200, + 'light': 300, + 'normal': 400, + 'medium': 500, + 'semibold': 600, + 'bold': 700, + 'extrabold': 800, + 'black': 900, + }, + leading: { + 'none': 1, + 'tight': 1.25, + 'normal': 1.5, + 'loose': 2, + }, + tracking: { + 'tight': '-0.05em', + 'normal': '0', + 'wide': '0.1em', + }, + colors: { + ...colors + }, + }, + backgrounds: { + colors: { + ...colors + }, + }, + borders: { + widths: { + default: '1px', + '0': '0', + '2': '2px', + '4': '4px', + '8': '8px', + }, + colors: { + default: colors['slate-lighter'], + ...colors + }, + }, + radiuses: { + default: '.25rem', + sm: '.125rem', + lg: '.5rem', + pill: '9999px', + }, + sizing: { + width: { + 'auto': 'auto', + 'px': '1px', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '24': '6rem', + '32': '8rem', + '48': '12rem', + '64': '16rem', + '128': '32rem', + '1/2': '50%', + '1/3': '33.33333%', + '2/3': '66.66667%', + '1/4': '25%', + '3/4': '75%', + '1/5': '20%', + '2/5': '40%', + '3/5': '60%', + '4/5': '80%', + '1/6': '16.66667%', + '5/6': '83.33333%', + 'full': '100%', + 'screen': '100vw' + }, + height: { + 'auto': 'auto', + 'px': '1px', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '6': '1.5rem', + '8': '2rem', + '10': '2.5rem', + '12': '3rem', + '16': '4rem', + '24': '6rem', + '32': '8rem', + '48': '12rem', + '64': '16rem', + 'full': '100%', + 'screen': '100vh' + }, + minHeight: { + '0': '0', + 'full': '100%', + 'screen': '100vh' + }, + maxHeight: { + 'full': '100%', + 'screen': '100vh' + }, + minWidth: { + '0': '0', + 'full': '100%', + }, + maxWidth: { + 'xs': '20rem', + 'sm': '30rem', + 'md': '40rem', + 'lg': '50rem', + 'xl': '60rem', + '2xl': '70rem', + '3xl': '80rem', + '4xl': '90rem', + '5xl': '100rem', + 'full': '100%', + }, + }, + spacing: { + padding: { + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '6': '1.5rem', + '8': '2rem', + '12': '3rem', + '16': '4rem' + }, + margin: { + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '6': '1.5rem', + '8': '2rem', + '12': '3rem', + '16': '4rem' + }, + negativeMargin: { + 'px': '1px', + '0': '0', + '1': '0.25rem', + '2': '0.5rem', + '3': '0.75rem', + '4': '1rem', + '6': '1.5rem', + '8': '2rem', + '12': '3rem', + '16': '4rem' + }, + }, + shadows: { + default: '0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.15)', + md: '0 3px 6px rgba(0,0,0,.12), 0 3px 6px rgba(0,0,0,.13)', + lg: '0 10px 20px rgba(0,0,0,.13), 0 6px 6px rgba(0,0,0,.13)', + inner: 'inset 0 1px 2px rgba(0, 0, 0, 0.05)', + none: 'none', + }, + zIndex: { + '0': 0, + '10': 10, + '20': 20, + '30': 30, + '40': 40, + '50': 50, + 'auto': 'auto', + }, + opacity: { + '0': '0', + '25': '.25', + '50': '.5', + '75': '.75', + '100': '1', + }, } From 4bb4bae349645d00bde1bf2eace8a26ea844b702 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Thu, 19 Oct 2017 18:02:26 -0400 Subject: [PATCH 02/11] Import Museo Sans from Typekit --- docs/source/_layouts/master.blade.php | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/source/_layouts/master.blade.php b/docs/source/_layouts/master.blade.php index 299c657f4..dcd646661 100644 --- a/docs/source/_layouts/master.blade.php +++ b/docs/source/_layouts/master.blade.php @@ -5,6 +5,9 @@ {{ $page->title ? $page->title . ' - Tailwind CSS' : 'Tailwind CSS' }} + From 1a22d9a810d633104c5323624961f2a23e0d3ffc Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Thu, 19 Oct 2017 18:13:26 -0400 Subject: [PATCH 03/11] Inherit font on all form controls, not just inputs --- __tests__/fixtures/tailwind.css | 6 +++++- css/preflight.css | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/__tests__/fixtures/tailwind.css b/__tests__/fixtures/tailwind.css index a77aed872..b354ee328 100644 --- a/__tests__/fixtures/tailwind.css +++ b/__tests__/fixtures/tailwind.css @@ -540,7 +540,11 @@ svg { fill: currentColor; } -input { +button, +input, +optgroup, +select, +textarea { font-family: inherit; } diff --git a/css/preflight.css b/css/preflight.css index d3b668085..4be97e1db 100644 --- a/css/preflight.css +++ b/css/preflight.css @@ -87,7 +87,7 @@ img { max-width: 100%; } svg { fill: currentColor; } -input { font-family: inherit; } +button, input, optgroup, select, textarea { font-family: inherit; } input::placeholder { color: inherit; From 8cf83ce4646dd3e2c2f5eed4fd25b880b0fd6970 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Thu, 19 Oct 2017 19:18:48 -0400 Subject: [PATCH 04/11] Working on new docs design --- docs/source/_assets/less/markdown.less | 15 +- docs/source/_assets/less/prism.less | 29 +- docs/source/_layouts/master.blade.php | 297 ++++++++++---------- docs/source/_partials/code-sample.blade.php | 4 +- docs/tailwind.js | 16 +- 5 files changed, 188 insertions(+), 173 deletions(-) diff --git a/docs/source/_assets/less/markdown.less b/docs/source/_assets/less/markdown.less index a22c76be3..7b05ee426 100644 --- a/docs/source/_assets/less/markdown.less +++ b/docs/source/_assets/less/markdown.less @@ -8,7 +8,7 @@ .subnav-link, .subnav-link& { @apply .mr-6; @apply .leading-none; - @apply .text-slate; + @apply .text-slate-dark; @apply .text-sm; } } @@ -38,11 +38,12 @@ > pre, pre& { @apply .font-mono; + @apply .font-medium; } > blockquote, blockquote& { @apply .italic; - @apply .text-slate; + @apply .text-slate-dark; @apply .text-sm; } @@ -50,7 +51,7 @@ @apply .mb-4; @apply .leading-none; @apply .text-slate-darker; - @apply .font-bold; + @apply .font-semibold; @apply .text-3xl; } @@ -59,7 +60,7 @@ @apply .mb-8; @apply .text-slate-darker; @apply .leading-none; - @apply .font-bold; + @apply .font-semibold; @apply .text-xl; } @@ -73,14 +74,14 @@ } > p, p&, > blockquote > p { - @apply .text-slate; + @apply .text-slate-dark; @apply .mt-4; @apply .mb-4; line-height: 1.75; } > ul, > ol { - @apply .text-slate; + @apply .text-slate-dark; margin: 0 0 2em; } @@ -94,7 +95,7 @@ > li { @apply .my-2; - @apply .text-slate; + @apply .text-slate-dark; } > :not(pre) > code[class*="language-"], > pre[class*="language-"], pre[class*="language-"]& { diff --git a/docs/source/_assets/less/prism.less b/docs/source/_assets/less/prism.less index 3d0f09378..9cae792bb 100644 --- a/docs/source/_assets/less/prism.less +++ b/docs/source/_assets/less/prism.less @@ -7,10 +7,12 @@ code[class*="language-"], pre[class*="language-"] { + @apply .font-mono; + color: black; background: none; text-shadow: 0 1px white; - font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + // font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; text-align: left; white-space: pre; word-spacing: normal; @@ -74,7 +76,8 @@ pre[class*="language-"] { } .token.punctuation { - color: #999; + @apply .text-blue-dark; + // color: #999; } .namespace { @@ -88,17 +91,18 @@ pre[class*="language-"] { .token.constant, .token.symbol, .token.deleted { - color: #905; + @apply .text-blue-dark; + // color: #905; } -.token.selector, -.token.attr-name, -.token.string, -.token.char, -.token.builtin, -.token.inserted { - color: #690; -} +// .token.selector, +// .token.attr-name, +// .token.string, +// .token.char, +// .token.builtin, +// .token.inserted { +// color: #690; +// } .token.operator, .token.entity, @@ -112,7 +116,8 @@ pre[class*="language-"] { .token.atrule, .token.attr-value, .token.keyword { - color: #07a; + @apply .text-purple-dark; + // color: #07a; } .token.function { diff --git a/docs/source/_layouts/master.blade.php b/docs/source/_layouts/master.blade.php index dcd646661..2deb49431 100644 --- a/docs/source/_layouts/master.blade.php +++ b/docs/source/_layouts/master.blade.php @@ -6,163 +6,160 @@ {{ $page->title ? $page->title . ' - Tailwind CSS' : 'Tailwind CSS' }} - -
-
-
-
-
- + +
+
+
+ + Tailwind CSS + {{-- --}} + {{-- Tailwind CSS --}} + {{-- --}} + {{-- --}} +
+
+
+ +
+ +
- - Tailwind CSS - - -
-
- GitHub
+
-
-
-
- -
-
- @yield('body') -
+
+
+ @yield('body')
diff --git a/docs/source/_partials/code-sample.blade.php b/docs/source/_partials/code-sample.blade.php index 710241377..8002352be 100644 --- a/docs/source/_partials/code-sample.blade.php +++ b/docs/source/_partials/code-sample.blade.php @@ -1,5 +1,5 @@ -
-
+
+
{{ $slot }}
diff --git a/docs/tailwind.js b/docs/tailwind.js index 917ccfb71..260bfac1e 100644 --- a/docs/tailwind.js +++ b/docs/tailwind.js @@ -80,9 +80,9 @@ module.exports = { }, text: { fonts: { - 'sans': '-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', + 'sans': '"Lato", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', 'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif', - 'mono': 'Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace', + 'mono': '"Roboto Mono", Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace', }, sizes: { 'base': '1rem', // 16px @@ -174,6 +174,15 @@ module.exports = { '4/5': '80%', '1/6': '16.66667%', '5/6': '83.33333%', + 'xs': '20rem', + 'sm': '30rem', + 'md': '40rem', + 'lg': '50rem', + 'xl': '60rem', + '2xl': '70rem', + '3xl': '80rem', + '4xl': '90rem', + '5xl': '100rem', 'full': '100%', 'screen': '100vw' }, @@ -232,6 +241,7 @@ module.exports = { '4': '1rem', '6': '1.5rem', '8': '2rem', + '10': '2.5rem', '12': '3rem', '16': '4rem' }, @@ -244,6 +254,7 @@ module.exports = { '4': '1rem', '6': '1.5rem', '8': '2rem', + '10': '2.5rem', '12': '3rem', '16': '4rem' }, @@ -256,6 +267,7 @@ module.exports = { '4': '1rem', '6': '1.5rem', '8': '2rem', + '10': '2.5rem', '12': '3rem', '16': '4rem' }, From b631014ef4a0fa2e7494a11ef834e850934f87a0 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Thu, 19 Oct 2017 19:36:43 -0400 Subject: [PATCH 05/11] Tweak some colors --- docs/source/_layouts/master.blade.php | 2 +- docs/tailwind.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/source/_layouts/master.blade.php b/docs/source/_layouts/master.blade.php index 2deb49431..bc931c7c3 100644 --- a/docs/source/_layouts/master.blade.php +++ b/docs/source/_layouts/master.blade.php @@ -16,7 +16,7 @@
- Tailwind CSS + Tailwind CSS {{-- --}} {{-- Tailwind CSS --}} {{-- --}} diff --git a/docs/tailwind.js b/docs/tailwind.js index 260bfac1e..1f32f05aa 100644 --- a/docs/tailwind.js +++ b/docs/tailwind.js @@ -12,8 +12,8 @@ var colors = { 'smoke-darker': '#919eab', 'smoke-dark': '#c5ced6', 'smoke': '#dfe3e8', - 'smoke-light': '#f0f2f5', - 'smoke-lighter': '#f7f9fa', + 'smoke-light': 'hsl(200, 33%, 96%)', + 'smoke-lighter': 'hsl(200, 25%, 98%)', 'red-darker': '#960f0d', 'red-dark': '#d43633', @@ -46,7 +46,7 @@ var colors = { 'teal-lighter': '#e8fdfa', 'blue-darker': '#154267', - 'blue-dark': '#3687c8', + 'blue-dark': '#317af6', 'blue': '#4aa2ea', 'blue-light': '#acdaff', 'blue-lighter': '#f1f9ff', From 525a86bd0a9ff4d9887d53bfffb6948806b195dc Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Fri, 20 Oct 2017 11:31:25 -0400 Subject: [PATCH 06/11] WIP --- docs/source/_assets/less/markdown.less | 2 +- docs/source/_layouts/master.blade.php | 15 ++++++++------- docs/tailwind.js | 23 ++++------------------- 3 files changed, 13 insertions(+), 27 deletions(-) diff --git a/docs/source/_assets/less/markdown.less b/docs/source/_assets/less/markdown.less index 7b05ee426..a491ca0c3 100644 --- a/docs/source/_assets/less/markdown.less +++ b/docs/source/_assets/less/markdown.less @@ -38,7 +38,7 @@ > pre, pre& { @apply .font-mono; - @apply .font-medium; + @apply .font-normal; } > blockquote, blockquote& { diff --git a/docs/source/_layouts/master.blade.php b/docs/source/_layouts/master.blade.php index bc931c7c3..332487f3d 100644 --- a/docs/source/_layouts/master.blade.php +++ b/docs/source/_layouts/master.blade.php @@ -6,14 +6,15 @@ {{ $page->title ? $page->title . ' - Tailwind CSS' : 'Tailwind CSS' }} + {{-- --}}
-
+
Tailwind CSS @@ -32,13 +33,13 @@
-
+
@yield('body')
diff --git a/docs/tailwind.js b/docs/tailwind.js index 1f32f05aa..4827e1e97 100644 --- a/docs/tailwind.js +++ b/docs/tailwind.js @@ -80,9 +80,9 @@ module.exports = { }, text: { fonts: { - 'sans': '"Lato", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', + 'sans': 'museo-sans, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', 'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif', - 'mono': '"Roboto Mono", Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace', + 'mono': '"SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', }, sizes: { 'base': '1rem', // 16px @@ -96,15 +96,9 @@ module.exports = { '4xl': '2.875rem', // 46px }, weights: { - 'hairline': 100, - 'thin': 200, - 'light': 300, - 'normal': 400, - 'medium': 500, - 'semibold': 600, + 'normal': 300, + 'semibold': 500, 'bold': 700, - 'extrabold': 800, - 'black': 900, }, leading: { 'none': 1, @@ -174,15 +168,6 @@ module.exports = { '4/5': '80%', '1/6': '16.66667%', '5/6': '83.33333%', - 'xs': '20rem', - 'sm': '30rem', - 'md': '40rem', - 'lg': '50rem', - 'xl': '60rem', - '2xl': '70rem', - '3xl': '80rem', - '4xl': '90rem', - '5xl': '100rem', 'full': '100%', 'screen': '100vw' }, From 6cd1208ca11da1ba129f545847e730ce181b0949 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Fri, 20 Oct 2017 21:07:50 -0400 Subject: [PATCH 07/11] Tweak some font weights in alert examples --- docs/source/examples/alerts.blade.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/source/examples/alerts.blade.md b/docs/source/examples/alerts.blade.md index 9cacbc141..2f2710d04 100644 --- a/docs/source/examples/alerts.blade.md +++ b/docs/source/examples/alerts.blade.md @@ -13,7 +13,7 @@ Here's a bunch of examples: @component('_partials.code-sample', ['lang' => 'html'])
- Holy smokes! Something seriously bad happened. + Holy smokes! Something seriously bad happened. @@ -68,7 +68,7 @@ Here's a bunch of examples:
-

Our privacy policy has changed

+

Our privacy policy has changed

Make sure you know how these changes affect you.

From 9755505d8dbfd26812bb447fe46379c9b1a98324 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Fri, 20 Oct 2017 21:11:25 -0400 Subject: [PATCH 08/11] Reverse background color swatches, seems better I dunno whatever --- docs/source/styles/backgrounds/color.md | 220 ++++++++++++------------ 1 file changed, 110 insertions(+), 110 deletions(-) diff --git a/docs/source/styles/backgrounds/color.md b/docs/source/styles/backgrounds/color.md index d182672b0..4a9b82bf4 100644 --- a/docs/source/styles/backgrounds/color.md +++ b/docs/source/styles/backgrounds/color.md @@ -17,39 +17,39 @@ title: "Backgrounds"
-
- .bg-slate-darker -
-
- .bg-slate-dark -
-
- .bg-slate +
+ .bg-slate-lighter
.bg-slate-light
-
- .bg-slate-lighter +
+ .bg-slate +
+
+ .bg-slate-dark +
+
+ .bg-slate-darker
-
- .bg-smoke-darker -
-
- .bg-smoke-dark -
-
- .bg-smoke +
+ .bg-smoke-lighter
.bg-smoke-light
-
- .bg-smoke-lighter +
+ .bg-smoke +
+
+ .bg-smoke-dark +
+
+ .bg-smoke-darker
@@ -58,58 +58,58 @@ title: "Backgrounds"
-
- .bg-red-darker -
-
- .bg-red-dark -
-
- .bg-red +
+ .bg-red-lighter
.bg-red-light
-
- .bg-red-lighter +
+ .bg-red +
+
+ .bg-red-dark +
+
+ .bg-red-darker
-
- .bg-orange-darker -
-
- .bg-orange-dark -
-
- .bg-orange +
+ .bg-orange-lighter
.bg-orange-light
-
- .bg-orange-lighter +
+ .bg-orange +
+
+ .bg-orange-dark +
+
+ .bg-orange-darker
-
- .bg-yellow-darker -
-
- .bg-yellow-dark -
-
- .bg-yellow +
+ .bg-yellow-lighter
.bg-yellow-light
-
- .bg-yellow-lighter +
+ .bg-yellow +
+
+ .bg-yellow-dark +
+
+ .bg-yellow-darker
@@ -118,58 +118,58 @@ title: "Backgrounds"
-
- .bg-green-darker -
-
- .bg-green-dark -
-
- .bg-green +
+ .bg-green-lighter
.bg-green-light
-
- .bg-green-lighter +
+ .bg-green +
+
+ .bg-green-dark +
+
+ .bg-green-darker
-
- .bg-teal-darker -
-
- .bg-teal-dark -
-
- .bg-teal +
+ .bg-teal-lighter
.bg-teal-light
-
- .bg-teal-lighter +
+ .bg-teal +
+
+ .bg-teal-dark +
+
+ .bg-teal-darker
-
- .bg-blue-darker -
-
- .bg-blue-dark -
-
- .bg-blue +
+ .bg-blue-lighter
.bg-blue-light
-
- .bg-blue-lighter +
+ .bg-blue +
+
+ .bg-blue-dark +
+
+ .bg-blue-darker
@@ -178,58 +178,58 @@ title: "Backgrounds"
-
- .bg-indigo-darker -
-
- .bg-indigo-dark -
-
- .bg-indigo +
+ .bg-indigo-lighter
.bg-indigo-light
-
- .bg-indigo-lighter +
+ .bg-indigo +
+
+ .bg-indigo-dark +
+
+ .bg-indigo-darker
-
- .bg-purple-darker -
-
- .bg-purple-dark -
-
- .bg-purple +
+ .bg-purple-lighter
.bg-purple-light
-
- .bg-purple-lighter +
+ .bg-purple +
+
+ .bg-purple-dark +
+
+ .bg-purple-darker
-
- .bg-pink-darker -
-
- .bg-pink-dark -
-
- .bg-pink +
+ .bg-pink-lighter
.bg-pink-light
-
- .bg-pink-lighter +
+ .bg-pink +
+
+ .bg-pink-dark +
+
+ .bg-pink-darker
From ed1f632d7a6fe9bcf846ca4d0eb4fbd97ddc14ff Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Sat, 21 Oct 2017 17:15:00 -0400 Subject: [PATCH 09/11] Move some base styles to classes in layout --- docs/source/_assets/less/base.less | 38 --------------------------- docs/source/_layouts/master.blade.php | 4 +-- 2 files changed, 2 insertions(+), 40 deletions(-) diff --git a/docs/source/_assets/less/base.less b/docs/source/_assets/less/base.less index 1cdee3d8d..e9cc60cbd 100644 --- a/docs/source/_assets/less/base.less +++ b/docs/source/_assets/less/base.less @@ -1,54 +1,16 @@ @tailwind reset; html { - @apply .bg-brand-soft; - font-size: 12px; - // Changes the default tap highlight to be completely transparent in iOS. - -webkit-tap-highlight-color: rgba(0,0,0,0); - - // -webkit-font-smoothing: antialiased; - @media (min-width: 420px) { font-size: 16px; } } -*, -*::before, -*::after { - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -body { - @apply .font-sans; - @apply .text-base; - @apply .font-normal; - @apply .text-slate-darker; - line-height: 1.5; -} - -pre, code { - @apply .font-mono; -} - -img { - vertical-align: middle; -} - a { color: inherit; text-decoration: none; - - &:hover { - @apply .underline; - } -} - -svg { - fill: currentColor; } ol, ul { diff --git a/docs/source/_layouts/master.blade.php b/docs/source/_layouts/master.blade.php index 332487f3d..3b3ba7a38 100644 --- a/docs/source/_layouts/master.blade.php +++ b/docs/source/_layouts/master.blade.php @@ -1,5 +1,5 @@ - + @@ -12,7 +12,7 @@ - +
From 0a0dd2e8a4063d5d6be492ccef67e12d72454335 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Mon, 23 Oct 2017 06:53:11 -0400 Subject: [PATCH 10/11] Update lock file --- yarn.lock | 21 +-------------------- 1 file changed, 1 insertion(+), 20 deletions(-) diff --git a/yarn.lock b/yarn.lock index f0163c2e4..3c092d869 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1056,7 +1056,7 @@ circular-json@^0.3.1: version "0.3.3" resolved "https://registry.yarnpkg.com/circular-json/-/circular-json-0.3.3.tgz#815c99ea84f6809529d2f45791bdf82711352d66" -clean-css@^4.1.9, clean-css@^4.x: +clean-css@^4.1.9: version "4.1.9" resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.1.9.tgz#35cee8ae7687a49b98034f70de00c4edd3826301" dependencies: @@ -3071,13 +3071,6 @@ plur@^2.0.0, plur@^2.1.2: dependencies: irregular-plurals "^1.0.0" -postcss-clean@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/postcss-clean/-/postcss-clean-1.1.0.tgz#c2d61d5d8caf19a585adba16897726c2674c4207" - dependencies: - clean-css "^4.x" - postcss "^6.x" - postcss-functions@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/postcss-functions/-/postcss-functions-3.0.0.tgz#0e94d01444700a481de20de4d55fb2640564250e" @@ -3176,14 +3169,6 @@ postcss@^6.0.1, postcss@^6.0.3, postcss@^6.0.9: source-map "^0.5.7" supports-color "^4.4.0" -postcss@^6.x: - version "6.0.13" - resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.13.tgz#b9ecab4ee00c89db3ec931145bd9590bbf3f125f" - dependencies: - chalk "^2.1.0" - source-map "^0.6.1" - supports-color "^4.4.0" - prelude-ls@~1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" @@ -3558,10 +3543,6 @@ source-map@^0.4.2, source-map@^0.4.4: dependencies: amdefine ">=0.0.4" -source-map@^0.6.1: - version "0.6.1" - resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" - spdx-correct@~1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40" From a983e8bc1cb6220aecf10fcccdcaa313ab9f7c08 Mon Sep 17 00:00:00 2001 From: Adam Wathan Date: Mon, 23 Oct 2017 11:01:39 -0400 Subject: [PATCH 11/11] Don't use SFMono, doesn't seem to actually work? --- docs/tailwind.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/tailwind.js b/docs/tailwind.js index 4827e1e97..218b3a472 100644 --- a/docs/tailwind.js +++ b/docs/tailwind.js @@ -82,7 +82,7 @@ module.exports = { fonts: { 'sans': 'museo-sans, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue', 'serif': 'Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif', - 'mono': '"SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', + 'mono': 'Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', }, sizes: { 'base': '1rem', // 16px