diff --git a/docs/source/docs/adding-new-utilities.blade.md b/docs/source/docs/adding-new-utilities.blade.md index adec78ccd..ea477be47 100644 --- a/docs/source/docs/adding-new-utilities.blade.md +++ b/docs/source/docs/adding-new-utilities.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Adding New Utilities" -description: null --- +# Adding New Utilities + Although Tailwind provides a pretty comprehensive set of utility classes out of the box, you're inevitably going to run into situations where you need to add a few of your own. Deciding on the best way to extend a framework can be paralyzing, so here's some best practices and tools to help you add your own utilities "the Tailwind way." diff --git a/docs/source/docs/background-color.blade.md b/docs/source/docs/background-color.blade.md index 6f4ba1444..45ad4cb2e 100644 --- a/docs/source/docs/background-color.blade.md +++ b/docs/source/docs/background-color.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Background Color" -description: "Utilities for controlling an element's background color." +title: "Backgrounds" --- +# Background Color + +
+ Utilities for controlling an element's background color. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/background-position.blade.md b/docs/source/docs/background-position.blade.md index 3f0255b5f..c2ee40acb 100644 --- a/docs/source/docs/background-position.blade.md +++ b/docs/source/docs/background-position.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Background Position" -description: "Utilities for controlling the position of an element's background image." --- +# Background Position + +
+ Utilities for controlling the position of an element's background image. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/background-size.blade.md b/docs/source/docs/background-size.blade.md index 87f36146a..bbf65bcc6 100644 --- a/docs/source/docs/background-size.blade.md +++ b/docs/source/docs/background-size.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Background Size" -description: "Utilities for controlling the background size of an element's background image." --- +# Background Size + +
+ Utilities for controlling the background size of an element's background image. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/border-color.blade.md b/docs/source/docs/border-color.blade.md index 13e3825fe..cadd9fd2e 100644 --- a/docs/source/docs/border-color.blade.md +++ b/docs/source/docs/border-color.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Border Color" -description: "Utilities for controlling the color of an element's borders." --- +# Border Color + +
+ Utilities for controlling the color of an element's borders. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/border-radius.blade.md b/docs/source/docs/border-radius.blade.md index bb7410eea..ae5cef3dc 100644 --- a/docs/source/docs/border-radius.blade.md +++ b/docs/source/docs/border-radius.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Border Radius" -description: "Utilities for controlling the border radius of an element." --- +# Border Radius + +
+ Utilities for controlling the border radius of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/border-style.blade.md b/docs/source/docs/border-style.blade.md index 522a4d752..ce05d929a 100644 --- a/docs/source/docs/border-style.blade.md +++ b/docs/source/docs/border-style.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Border Style" -description: "Utilities for controlling the style of an element's borders." --- +# Border Style + +
+ Utilities for controlling the style of an element's borders. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/border-width.blade.md b/docs/source/docs/border-width.blade.md index e4da82920..da33dce64 100644 --- a/docs/source/docs/border-width.blade.md +++ b/docs/source/docs/border-width.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Border Width" -description: "Utilities for controlling the width an element's borders." --- +# Border Width + +
+ Utilities for controlling the width an element's borders. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/colors.blade.md b/docs/source/docs/colors.blade.md index 8f025c820..14a94fbc2 100644 --- a/docs/source/docs/colors.blade.md +++ b/docs/source/docs/colors.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Colors" -description: null --- +# Colors + Developing an organized, consistent and beautiful color palette is critical to the design success of a project. Tailwind provides a fantastic color system that makes this very easy to accomplish. ## Default color palette diff --git a/docs/source/docs/configuration.blade.md b/docs/source/docs/configuration.blade.md index 0b5e67881..1906fe38a 100644 --- a/docs/source/docs/configuration.blade.md +++ b/docs/source/docs/configuration.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Configuration" -description: null --- +# Configuration + Tailwind's defining feature is its ability to be customized. We understand that no two projects are the same, so why should the CSS framework you use be? Tailwind provides developers with a helpful set of front-end conventions, while still leaving room for adjustments where appropriate. This is all done using the Tailwind config file. ## Introducing the Tailwind config diff --git a/docs/source/docs/container.blade.md b/docs/source/docs/container.blade.md index a26d99ee2..72a8c1ab5 100644 --- a/docs/source/docs/container.blade.md +++ b/docs/source/docs/container.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Container" -description: "A component for fixing an element's width to the current breakpoint." --- +# Container + +
+ A component for fixing an element's width to the current breakpoint. +
+ @include('_partials.work-in-progress')
diff --git a/docs/source/docs/cursor.blade.md b/docs/source/docs/cursor.blade.md index cbb097220..8fa2a639d 100644 --- a/docs/source/docs/cursor.blade.md +++ b/docs/source/docs/cursor.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Cursor" -description: "Utilities for controlling the cursor style when hovering over an element." --- +# Cursor + +
+ Utilities for controlling the cursor style when hovering over an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/display.blade.md b/docs/source/docs/display.blade.md index 99bf1449e..76cd49852 100644 --- a/docs/source/docs/display.blade.md +++ b/docs/source/docs/display.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Display" -description: "Utilities for controlling the display box type of an element." --- +# Display + +
+ Utilities for controlling the display box type of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/examples/alerts.blade.md b/docs/source/docs/examples/alerts.blade.md index 545fed73b..8b8461e05 100644 --- a/docs/source/docs/examples/alerts.blade.md +++ b/docs/source/docs/examples/alerts.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Alerts" -description: null --- -@include('_partials.work-in-progress-example') +# Alerts + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed documentation is coming soon, but in the meantime here's a bunch of quick examples.

+
+
+
+
### Traditional diff --git a/docs/source/docs/examples/buttons.blade.md b/docs/source/docs/examples/buttons.blade.md index 1a5988602..9498c1616 100644 --- a/docs/source/docs/examples/buttons.blade.md +++ b/docs/source/docs/examples/buttons.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Buttons" -description: null --- -@include('_partials.work-in-progress-example') +# Buttons + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed documentation is coming soon, but in the meantime here's a bunch of quick examples.

+
+
+
+
### Simple diff --git a/docs/source/docs/examples/cards.blade.md b/docs/source/docs/examples/cards.blade.md index ed61417e8..8cd08821e 100644 --- a/docs/source/docs/examples/cards.blade.md +++ b/docs/source/docs/examples/cards.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Cards" -description: null --- -@include('_partials.work-in-progress-example') +# Cards + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed examples are coming soon.

+
+
+
+
## Stacked diff --git a/docs/source/docs/examples/forms.blade.md b/docs/source/docs/examples/forms.blade.md index 26c119e72..d6fe11ed3 100644 --- a/docs/source/docs/examples/forms.blade.md +++ b/docs/source/docs/examples/forms.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Forms" -description: null --- -@include('_partials.work-in-progress-example') +# Forms + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed examples are coming soon.

+
+
+
+
## Login Form diff --git a/docs/source/docs/examples/navigation.blade.md b/docs/source/docs/examples/navigation.blade.md index 6226a01a6..edbce38e3 100644 --- a/docs/source/docs/examples/navigation.blade.md +++ b/docs/source/docs/examples/navigation.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Navigation" -description: null --- -@include('_partials.work-in-progress-example') +# Navigation + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed examples are coming soon.

+
+
+
+
## Simple diff --git a/docs/source/docs/extracting-components.blade.md b/docs/source/docs/extracting-components.blade.md index a52a15cd9..f1bc2de1a 100644 --- a/docs/source/docs/extracting-components.blade.md +++ b/docs/source/docs/extracting-components.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Extracting Components" -description: null --- +# Extracting Components + Tailwind encourages a "utility-first" workflow, where new designs are initially implemented using only utility classes to avoid premature abstraction. While we strongly believe you can get a lot further with just utilities than you might initially expect, **we don't believe that a dogmatic utility*-only* approach is the best way to write CSS.** diff --git a/docs/source/docs/flexbox-align-content.blade.md b/docs/source/docs/flexbox-align-content.blade.md index 207cb5b81..33fb9f2f4 100644 --- a/docs/source/docs/flexbox-align-content.blade.md +++ b/docs/source/docs/flexbox-align-content.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Align Content" -description: "Utilities for controlling how lines are positioned in multi-line flex containers." +title: "Align Content - Flexbox" --- +# Align Content + +
+ Utilities for controlling how lines are positioned in multi-line flex containers. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-align-items.blade.md b/docs/source/docs/flexbox-align-items.blade.md index 5fb291cc6..399034185 100644 --- a/docs/source/docs/flexbox-align-items.blade.md +++ b/docs/source/docs/flexbox-align-items.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Align Items" -description: "Utilities for controlling how flex items are positioned along a container's cross axis." +title: "Align Items - Flexbox" --- +# Align Items + +
+ Utilities for controlling how flex items are positioned along a container's cross axis. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-align-self.blade.md b/docs/source/docs/flexbox-align-self.blade.md index e3cb4007b..1de5c8d2c 100644 --- a/docs/source/docs/flexbox-align-self.blade.md +++ b/docs/source/docs/flexbox-align-self.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Align Self" -description: "Utilities for controlling how an individual flex item is positioned along its container's cross axis." +title: "Align Items - Flexbox" --- +# Align Self + +
+ Utilities for controlling how an individual flex item is positioned along its container's cross axis. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-direction.blade.md b/docs/source/docs/flexbox-direction.blade.md index f842c2c94..149beff46 100644 --- a/docs/source/docs/flexbox-direction.blade.md +++ b/docs/source/docs/flexbox-direction.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Flex Direction" -description: "Utilities for controlling the direction of flex items." +title: "Flex Direction - Flexbox" --- +# Flex Direction + +
+ Utilities for controlling the direction of flex items. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-display.blade.md b/docs/source/docs/flexbox-display.blade.md index 4ac0b7fdc..1e4a29dd3 100644 --- a/docs/source/docs/flexbox-display.blade.md +++ b/docs/source/docs/flexbox-display.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Flex Display" -description: "Utilities for creating flex containers." +title: "Flex Display – Flexbox" --- +# Flex Display + +
+ Utilities for creating flex containers. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-flex-grow-shrink.blade.md b/docs/source/docs/flexbox-flex-grow-shrink.blade.md index 592647035..391e5af8f 100644 --- a/docs/source/docs/flexbox-flex-grow-shrink.blade.md +++ b/docs/source/docs/flexbox-flex-grow-shrink.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Flex, Grow, & Shrink" -description: "Utilities for controlling how flex items grow and shrink." +title: "Flex, Grow, & Shrink - Flexbox" --- +# Flex, Grow, & Shrink + +
+ Utilities for controlling how flex items grow and shrink. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-justify-content.blade.md b/docs/source/docs/flexbox-justify-content.blade.md index 2caad06fb..30723d5a8 100644 --- a/docs/source/docs/flexbox-justify-content.blade.md +++ b/docs/source/docs/flexbox-justify-content.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Justify Content" -description: "Utilities for controlling flex items are positioned along a container's main axis." +title: "Justify Content - Flexbox" --- +# Justify Content + +
+ Utilities for controlling flex items are positioned along a container's main axis. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox-wrapping.blade.md b/docs/source/docs/flexbox-wrapping.blade.md index a23ed3fc3..6334f7416 100644 --- a/docs/source/docs/flexbox-wrapping.blade.md +++ b/docs/source/docs/flexbox-wrapping.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation -title: "Flex Wrapping" -description: "Utilities for controlling how flex items wrap." +title: "Flex Wrapping - Flexbox" --- +# Flex Wrapping + +
+ Utilities for controlling how flex items wrap. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/flexbox.blade.md b/docs/source/docs/flexbox.blade.md index 17344a90a..d6dce0728 100644 --- a/docs/source/docs/flexbox.blade.md +++ b/docs/source/docs/flexbox.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Flexbox" -description: null --- +# Flexbox +
Usage Responsive diff --git a/docs/source/docs/floats.blade.md b/docs/source/docs/floats.blade.md index 3d2bd4a10..68fd26766 100644 --- a/docs/source/docs/floats.blade.md +++ b/docs/source/docs/floats.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Floats" -description: "Utilities for controlling the wrapping of content around an element." --- +# Floats + +
+ Utilities for controlling the wrapping of content around an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/font-weight.blade.md b/docs/source/docs/font-weight.blade.md index 287e0b8d5..d8a6477bd 100644 --- a/docs/source/docs/font-weight.blade.md +++ b/docs/source/docs/font-weight.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Font Weight" -description: "Utilities for controlling the font weight of an element." --- +# Font Weight + +
+ Utilities for controlling the font weight of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/fonts.blade.md b/docs/source/docs/fonts.blade.md index 7bbc35c5a..cba4d4e67 100644 --- a/docs/source/docs/fonts.blade.md +++ b/docs/source/docs/fonts.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Font Families" -description: "Utilities for controlling the font family of an element." --- +# Font Families + +
+ Utilities for controlling the font family of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/forms.blade.md b/docs/source/docs/forms.blade.md index ca3c7a93f..34fff99e9 100644 --- a/docs/source/docs/forms.blade.md +++ b/docs/source/docs/forms.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Forms" -description: "Utilities for styling form controls." --- +# Forms + +
+ Utilities for styling form controls. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/functions-and-directives.blade.md b/docs/source/docs/functions-and-directives.blade.md index 4efd483d3..0f3f5d754 100644 --- a/docs/source/docs/functions-and-directives.blade.md +++ b/docs/source/docs/functions-and-directives.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Functions & Directives" -description: null --- +# Functions & Directives + Tailwind exposes a few custom CSS functions and directives that can be used in your actual CSS files. ### `@@tailwind` diff --git a/docs/source/docs/grid.blade.md b/docs/source/docs/grid.blade.md index fbbd93465..c9f23166d 100644 --- a/docs/source/docs/grid.blade.md +++ b/docs/source/docs/grid.blade.md @@ -1,10 +1,23 @@ --- extends: _layouts.documentation title: "Grid" -description: null --- -@include('_partials.work-in-progress-example') +# Grid + +
+
+
+
+ +
+
+

Work in progress!

+

More detailed documentation is coming soon, but in the meantime here are some quick and dirty examples.

+
+
+
+
Basic grid example: diff --git a/docs/source/docs/height.blade.md b/docs/source/docs/height.blade.md index fadc7de68..fc86e6b11 100644 --- a/docs/source/docs/height.blade.md +++ b/docs/source/docs/height.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Height" -description: "Utilities for setting the height of an element" --- +# Height + +
+ Utilities for setting the height of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/installation.blade.md b/docs/source/docs/installation.blade.md index 82a607328..233c447a2 100644 --- a/docs/source/docs/installation.blade.md +++ b/docs/source/docs/installation.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Installation" -description: "Quick start guide for installing and configuring Tailwind CSS." --- +# Installation + +
+ Quick start guide for installing and configuring Tailwind CSS. +
+ ## CDN Before getting started please note, **many of the features that make Tailwind CSS great are not available using the CDN builds.** To take full advantage of Tailwind's features, [install Tailwind via npm](#npm). @@ -24,6 +29,7 @@ Or if you'd like to pull in the base styles separate from the utility classes: ``` + ## NPM For most projects (and to take advantage of Tailwind's customization features), you'll want to install Tailwind via npm. diff --git a/docs/source/docs/letter-spacing.blade.md b/docs/source/docs/letter-spacing.blade.md index 260779d0a..e133ff9b9 100644 --- a/docs/source/docs/letter-spacing.blade.md +++ b/docs/source/docs/letter-spacing.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Letter Spacing" -description: "Utilities for controlling the tracking (letter spacing) of an element." --- +# Letter Spacing + +
+ Utilities for controlling the tracking (letter spacing) of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/line-height.blade.md b/docs/source/docs/line-height.blade.md index 2d79a1cca..1d9f1f4b2 100644 --- a/docs/source/docs/line-height.blade.md +++ b/docs/source/docs/line-height.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Line Height" -description: "Utilities for controlling the leading (line height) of an element." --- +# Line Height + +
+ Utilities for controlling the leading (line height) of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/lists.blade.md b/docs/source/docs/lists.blade.md index 8c717c586..7895cfd11 100644 --- a/docs/source/docs/lists.blade.md +++ b/docs/source/docs/lists.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Lists" -description: "Utilities for controlling list styles." --- +# Lists + +
+ Utilities for controlling list styles. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/max-height.blade.md b/docs/source/docs/max-height.blade.md index d36662606..a6e10804e 100644 --- a/docs/source/docs/max-height.blade.md +++ b/docs/source/docs/max-height.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Max-Height" -description: "Utilities for setting the maximum height of an element" --- +# Max-Height + +
+ Utilities for setting the maximum height of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/max-width.blade.md b/docs/source/docs/max-width.blade.md index e040484f9..1f9fb28e7 100644 --- a/docs/source/docs/max-width.blade.md +++ b/docs/source/docs/max-width.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Max-Width" -description: "Utilities for setting the maximum width of an element" --- +# Max-Width + +
+ Utilities for setting the maximum width of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/min-height.blade.md b/docs/source/docs/min-height.blade.md index 4f21a066b..8731f6091 100644 --- a/docs/source/docs/min-height.blade.md +++ b/docs/source/docs/min-height.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Min-Height" -description: "Utilities for setting the minimum height of an element" --- +# Min-Height + +
+ Utilities for setting the minimum height of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/min-width.blade.md b/docs/source/docs/min-width.blade.md index 05afdfeb2..0ba5d58ef 100644 --- a/docs/source/docs/min-width.blade.md +++ b/docs/source/docs/min-width.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Min-Width" -description: "Utilities for setting the minimum width of an element" --- +# Min-Width + +
+ Utilities for setting the minimum width of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/opacity.blade.md b/docs/source/docs/opacity.blade.md index c54ae5056..e901277d5 100644 --- a/docs/source/docs/opacity.blade.md +++ b/docs/source/docs/opacity.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Opacity" -description: "Utilities for controlling the opacity of an element." --- +# Opacity + +
+ Utilities for controlling the opacity of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/overflow.blade.md b/docs/source/docs/overflow.blade.md index 5f053661d..ead2182d7 100644 --- a/docs/source/docs/overflow.blade.md +++ b/docs/source/docs/overflow.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Overflow" -description: "Utilities for controlling how an element handles content that is too large for the container." --- +# Overflow + +
+ Utilities for controlling how an element handles content that is too large for the container. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/pointer-events.blade.md b/docs/source/docs/pointer-events.blade.md index 076f77837..ea87a0bd9 100644 --- a/docs/source/docs/pointer-events.blade.md +++ b/docs/source/docs/pointer-events.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Pointer Events" -description: "Utilities for controlling whether an element responds to pointer events." --- +# Pointer Events + +
+ Utilities for controlling whether an element responds to pointer events. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/positioning.blade.md b/docs/source/docs/positioning.blade.md index 0a0f109c3..cc0d2cf9a 100644 --- a/docs/source/docs/positioning.blade.md +++ b/docs/source/docs/positioning.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Positioning" -descriptioj: "Utilities for controlling how an element is positioned in the DOM." --- +# Positioning + +
+ Utilities for controlling how an element is positioned in the DOM. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/resize.blade.md b/docs/source/docs/resize.blade.md index 763a758ae..7a1fcc666 100644 --- a/docs/source/docs/resize.blade.md +++ b/docs/source/docs/resize.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Resize" -description: "Utilities for controlling the how a textarea can be resized." --- +# Resize + +
+ Utilities for controlling the how a textarea can be resized. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/responsive-design.blade.md b/docs/source/docs/responsive-design.blade.md index b7d462195..a3b5806a7 100644 --- a/docs/source/docs/responsive-design.blade.md +++ b/docs/source/docs/responsive-design.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "Responsive Design" -description: null --- +# Responsive Design + Tailwind allows you to build responsive designs in the same way you build the rest of your design — using utility classes. Every utility in Tailwind is also available in screen-size specific variations. For example, the `.font-bold` utility can be used on small screen sizes using the `.sm:font-bold` class, on medium screen sizes using the `.md:font-bold` class, on large screen sizes using the `.lg:font-bold` class and on extra large screen sizes using the `.xl:font-bold` class. This is done using predefined screen sizes (media query breakpoints), each of which are given a unique name like `sm`, `md`, `lg` and `xl`. By default Tailwind takes a "mobile first" approach, where each screen size represents a minimum viewport width. Any classes you apply at smaller screen sizes are also applied to larger sizes, unless of course you override them, which is the whole point! This approach, while simple, is actually very powerful and can be used to build complex, beautiful, responsive designs. diff --git a/docs/source/docs/shadows.blade.md b/docs/source/docs/shadows.blade.md index a01db0034..4507b6dfc 100644 --- a/docs/source/docs/shadows.blade.md +++ b/docs/source/docs/shadows.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Shadows" -description: "Utilities for controlling the box shadow of an element." --- +# Shadows + +
+ Utilities for controlling the box shadow of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/spacing.blade.md b/docs/source/docs/spacing.blade.md index fff97323c..c93cb3565 100644 --- a/docs/source/docs/spacing.blade.md +++ b/docs/source/docs/spacing.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Spacing" -description: "Utilities for controlling an element's padding and margin." --- +# Spacing + +
+ Utilities for controlling an element's padding and margin. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/svg.blade.md b/docs/source/docs/svg.blade.md index 23664cd03..e2e70261c 100644 --- a/docs/source/docs/svg.blade.md +++ b/docs/source/docs/svg.blade.md @@ -1,10 +1,17 @@ --- extends: _layouts.documentation title: "SVG" -description: "Utilities for styling SVG elements." --- -@include('_partials.work-in-progress') +# SVG + +
+ Useful utilities for styling SVG elements. +
+ +
+ @include('_partials.work-in-progress') +
Tailwind doesn't provide SVG-specific utilites. Instead, use the generic sizing utilites to control an SVG's width and height, and the text color utilities to control an SVG's fill color. diff --git a/docs/source/docs/text-alignment.blade.md b/docs/source/docs/text-alignment.blade.md index d85aeb5f1..12a4307d5 100644 --- a/docs/source/docs/text-alignment.blade.md +++ b/docs/source/docs/text-alignment.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Text Alignment" -description: "Utilities for controlling the alignment of text." --- +# Text Alignment + +
+ Utilities for controlling the alignment of text. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/text-color.blade.md b/docs/source/docs/text-color.blade.md index 439cb052f..51c3ca5e1 100644 --- a/docs/source/docs/text-color.blade.md +++ b/docs/source/docs/text-color.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Text Color" -description: "Utilities for controlling the text color of an element." --- +# Text Color + +
+ Utilities for controlling the text color of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/text-sizing.blade.md b/docs/source/docs/text-sizing.blade.md index 982821b3d..b5ad7a111 100644 --- a/docs/source/docs/text-sizing.blade.md +++ b/docs/source/docs/text-sizing.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Text Sizing" -description: "Utilities for controlling the text size of an element." --- +# Text Sizing + +
+ Utilities for controlling the text size of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/text-style.blade.md b/docs/source/docs/text-style.blade.md index 5b1701db9..ce748c9c5 100644 --- a/docs/source/docs/text-style.blade.md +++ b/docs/source/docs/text-style.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Style & Decoration" -description: "Utilities for controlling the style of text." --- +# Text Style & Decoration + +
+ Utilities for controlling the style of text. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/user-select.blade.md b/docs/source/docs/user-select.blade.md index 11bbdecf9..526286189 100644 --- a/docs/source/docs/user-select.blade.md +++ b/docs/source/docs/user-select.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "User Select" -description: "Utilities for controlling whether the user can select text in an element." --- +# User Select + +
+ Utilities for controlling whether the user can select text in an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/vertical-alignment.blade.md b/docs/source/docs/vertical-alignment.blade.md index baccfce7b..5789d0cd1 100644 --- a/docs/source/docs/vertical-alignment.blade.md +++ b/docs/source/docs/vertical-alignment.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Vertical Alignment" -description: "Utilities for controlling the vertical alignment of an inline or table-cell box." --- +# Vertical Alignment + +
+ Utilities for controlling the vertical alignment of an inline or table-cell box. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/visibility.blade.md b/docs/source/docs/visibility.blade.md index eb0b79b2f..35e6c39ee 100644 --- a/docs/source/docs/visibility.blade.md +++ b/docs/source/docs/visibility.blade.md @@ -1,9 +1,15 @@ --- extends: _layouts.documentation title: "Visibility" -description: "Utilities for controlling the visible of an element." --- +# Visibility + + +
+ Utilities for controlling the visible of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => false, diff --git a/docs/source/docs/what-is-tailwind.blade.md b/docs/source/docs/what-is-tailwind.blade.md index 6e2644d8e..45bd45c28 100644 --- a/docs/source/docs/what-is-tailwind.blade.md +++ b/docs/source/docs/what-is-tailwind.blade.md @@ -1,9 +1,10 @@ --- extends: _layouts.documentation title: "What is Tailwind?" -description: null --- +# What is Tailwind? +

Tailwind is a utility-first CSS framework for rapidly building custom user interfaces. diff --git a/docs/source/docs/whitespace-and-wrapping.blade.md b/docs/source/docs/whitespace-and-wrapping.blade.md index 3f771d238..f6ffa8c35 100644 --- a/docs/source/docs/whitespace-and-wrapping.blade.md +++ b/docs/source/docs/whitespace-and-wrapping.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Whitespace & Wrapping" -description: "Utilities for controlling the whitespace and wrapping of an element." --- +# Whitespace & Wrapping + +

+ Utilities for controlling the whitespace and wrapping of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/width.blade.md b/docs/source/docs/width.blade.md index ff01c5f07..6a1c1abd7 100644 --- a/docs/source/docs/width.blade.md +++ b/docs/source/docs/width.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Width" -description: "Utilities for setting the width of an element" --- +# Width + +
+ Utilities for setting the width of an element +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true, diff --git a/docs/source/docs/working-utility-first.blade.md b/docs/source/docs/working-utility-first.blade.md index 28b2c84ae..1e9a6ed1c 100644 --- a/docs/source/docs/working-utility-first.blade.md +++ b/docs/source/docs/working-utility-first.blade.md @@ -1,5 +1,6 @@ --- extends: _layouts.documentation title: "Working Utility-First" -description: null --- + +# Working Utility-First diff --git a/docs/source/docs/z-index.blade.md b/docs/source/docs/z-index.blade.md index 31a4ffb50..3a28f90ca 100644 --- a/docs/source/docs/z-index.blade.md +++ b/docs/source/docs/z-index.blade.md @@ -1,9 +1,14 @@ --- extends: _layouts.documentation title: "Z-Index" -description: "Utilities for controlling the stack order of an element." --- +# Z-Index + +
+ Utilities for controlling the stack order of an element. +
+ @include('_partials.feature-badges', [ 'responsive' => true, 'customizable' => true,