Extract reset to separate file, inline SUIT CSS Base, rename @tailwind at-rules
This commit is contained in:
parent
57cb4159a4
commit
cd41069cba
17 changed files with 170 additions and 114 deletions
|
|
@ -1,11 +1,4 @@
|
|||
@import (less) "../../../node_modules/normalize.css/normalize.css";
|
||||
@import (less) "../../../node_modules/suitcss-base/lib/base.css";
|
||||
|
||||
@-moz-viewport { width: device-width; }
|
||||
@-ms-viewport { width: device-width; }
|
||||
@-o-viewport { width: device-width; }
|
||||
@-webkit-viewport { width: device-width; }
|
||||
@viewport { width: device-width; }
|
||||
@tailwind reset;
|
||||
|
||||
html {
|
||||
@apply .bg-brand-soft;
|
||||
|
|
@ -37,18 +30,6 @@ body {
|
|||
line-height: 1.5;
|
||||
}
|
||||
|
||||
textarea {
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
button, [role=button] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
small {
|
||||
@apply .text-sm;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
@apply .mono;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
@import "markdown";
|
||||
@import "container";
|
||||
|
||||
@tailwind-utilities all;
|
||||
@tailwind utilities;
|
||||
|
||||
@import "utilities";
|
||||
|
||||
|
|
|
|||
|
|
@ -26,9 +26,14 @@
|
|||
@apply .leading-none;
|
||||
@apply .wrap-none;
|
||||
@apply .text-pink-dark;
|
||||
@apply .mono;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
> pre, pre& {
|
||||
@apply .mono;
|
||||
}
|
||||
|
||||
> blockquote, blockquote& {
|
||||
@apply .text-em;
|
||||
@apply .text-dark-soft;
|
||||
|
|
|
|||
|
|
@ -69,6 +69,7 @@
|
|||
<div class="mt-8">
|
||||
<p class="mb-4 text-dark-softer text-uppercase tracking-wide text-medium text-sm">Styles</p>
|
||||
<ul class="mb-8">
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/base" class="{{ $page->active('/styles/base') ? 'text-dark text-medium' : 'text-dark-soft' }}">Base</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/alignment" class="{{ $page->active('/styles/alignment') ? 'text-dark text-medium' : 'text-dark-soft' }}">Alignment</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/appearance" class="{{ $page->active('/appearance') ? 'text-dark text-medium' : 'text-dark-soft' }}">Appearance</a></li>
|
||||
<li class="mb-2">
|
||||
|
|
@ -79,7 +80,6 @@
|
|||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/backgrounds/size" class="{{ $page->active('/backgrounds/size') ? 'text-dark text-medium' : 'text-dark-soft' }}">Size</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/base" class="{{ $page->active('/base') ? 'text-dark text-medium' : 'text-dark-soft' }}">Base</a></li>
|
||||
<li class="mb-2">
|
||||
<a href="{{ $page->baseUrl }}/styles/borders/base" class="block mb-2 {{ $page->active('/borders/') ? 'text-dark text-medium' : 'text-dark-soft' }}">Borders</a>
|
||||
<ul class="pl-4 {{ $page->active('/borders/') ? 'block' : 'hidden' }}">
|
||||
|
|
@ -130,7 +130,7 @@
|
|||
</li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/svg" class="{{ $page->active('/svg') ? 'text-dark text-medium' : 'text-dark-soft' }}">SVG</a></li>
|
||||
<li class="mb-2">
|
||||
<a href="{{ $page->baseUrl }}/styles/text/fonts" class="block mb-2 {{ $page->active('/text/') ? 'text-dark text-medium' : 'text-dark-soft' }}">Text</a>
|
||||
<a href="{{ $page->baseUrl }}/styles/text/fonts" class="block mb-2 {{ $page->active('/text/') ? 'text-dark text-medium' : 'text-dark-soft' }}">Typography</a>
|
||||
<ul class="pl-4 {{ $page->active('/text/') ? 'block' : 'hidden' }}">
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/fonts" class="{{ $page->active('/text/fonts') ? 'text-dark text-medium' : 'text-dark-soft' }}">Fonts</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/color" class="{{ $page->active('/text/color') ? 'text-dark text-medium' : 'text-dark-soft' }}">Color</a></li>
|
||||
|
|
@ -138,7 +138,6 @@
|
|||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/weight" class="{{ $page->active('/text/weight') ? 'text-dark text-medium' : 'text-dark-soft' }}">Weight</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/line-height" class="{{ $page->active('/text/line-height') ? 'text-dark text-medium' : 'text-dark-soft' }}">Line Height</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/letter-spacing" class="{{ $page->active('/text/letter-spacing') ? 'text-dark text-medium' : 'text-dark-soft' }}">Letter Spacing</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/alignment" class="{{ $page->active('/text/alignment') ? 'text-dark text-medium' : 'text-dark-soft' }}">Alignment</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/wrapping" class="{{ $page->active('/text/wrapping') ? 'text-dark text-medium' : 'text-dark-soft' }}">Wrapping</a></li>
|
||||
<li class="mb-2"><a href="{{ $page->baseUrl }}/styles/text/style" class="{{ $page->active('/text/style') ? 'text-dark text-medium' : 'text-dark-soft' }}">Style & Decoration</a></li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ title: "Borders"
|
|||
|
||||
# Borders
|
||||
|
||||
|
||||
<div class="subnav">
|
||||
<a class="subnav-link" href="#usage">Usage</a>
|
||||
<a class="subnav-link" href="#responsive">Responsive</a>
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
---
|
||||
extends: _layouts.markdown
|
||||
title: "Text Alignment"
|
||||
---
|
||||
|
||||
# Text Alignment
|
||||
|
||||
<div class="subnav">
|
||||
<a class="subnav-link" href="#usage">Usage</a>
|
||||
<a class="subnav-link" href="#responsive">Responsive</a>
|
||||
<a class="subnav-link" href="#customizing">Customizing</a>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue