knowledge/awesome-cheatsheets
1
1
Fork 0
mirror of https://github.com/namibia/awesome-cheatsheets.git synced 2024-12-20 01:03:14 +00:00
Code Issues Releases Activity

docs(tailwind): top right bottom left

Browse Source
This commit is contained in:
Julien Le Coupanec 2020-03-29 12:51:33 +02:00
parent 47a5e3cb7b
commit 43f33e5ac0
1 changed files with 556 additions and 541 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

269
frontend/tailwind.css
View File

@ -24,7 +24,7 @@
.container
/*
/*
* Box-sizing
* ----------
* Utilities for controlling how the browser should calculate an element's total size.
@ -34,7 +34,7 @@
.box-border /* box-sizing: border-box; */
.box-content /* box-sizing: content-box; */
/*
/*
* Display
* ----------
* Utilities for controlling the display box type of an element.
@ -58,7 +58,7 @@
.table-row-group /* display: table-row-group; */
.table-row /* display: table-row; */
/*
/*
* Floats
* ----------
* Utilities for controlling the wrapping of content around an element.
@ -70,7 +70,7 @@
.float-none /* float: none; */
.clearfix /* &::after { content: ""; display: table; clear: both; } */
/*
/*
* Clear
* ----------
* Utilities for controlling the wrapping of content around an element.
@ -81,7 +81,7 @@
.clear-right /* clear: right; */
.clear-both /* clear: both; */
/*
/*
* Object Fit
* ----------
* Utilities for controlling how a replaced element's content should be resized.
@ -94,66 +94,81 @@
.object-none /* object-fit: none; */
.object-scale-down /* object-fit: scale-down; */
/*
/*
* Object Position
* ----------
* Utilities for controlling how a replaced element's content should be positioned within its container.
* By default, only responsive variants are generated for object position utilities.
*/
.object-bottom /* object-position: bottom; */
.object-center /* object-position: center; */
.object-left /* object-position: left; */
.object-left-bottom /* object-position: left bottom; */
.object-left-top /* object-position: left top; */
.object-right /* object-position: right; */
.object-right-bottom /* object-position: right bottom; */
.object-right-top /* object-position: right top; */
.object-top /* object-position: top; */
.object-bottom /* object-position: bottom; */
.object-center /* object-position: center; */
.object-left /* object-position: left; */
.object-left-bottom /* object-position: left bottom; */
.object-left-top /* object-position: left top; */
.object-right /* object-position: right; */
.object-right-bottom /* object-position: right bottom; */
.object-right-top /* object-position: right top; */
.object-top /* object-position: top; */
/*
/*
* Overflow
* ----------
* Utilities for controlling how an element handles content that is too large for the container.
* By default, only responsive variants are generated for overflow utilities.
*/
.overflow-auto /* overflow: auto; */
.overflow-hidden /* overflow: hidden; */
.overflow-visible /* overflow: visible; */
.overflow-scroll /* overflow: scroll; */
.overflow-x-auto /* overflow-x: auto; */
.overflow-y-auto /* overflow-y: auto; */
.overflow-x-hidden /* overflow-x: hidden; */
.overflow-y-hidden /* overflow-y: hidden; */
.overflow-x-visible /* overflow-x: visible; */
.overflow-y-visible /* overflow-y: visible; */
.overflow-x-scroll /* overflow-x: scroll; */
.overflow-y-scroll /* overflow-y: scroll; */
.scrolling-touch /* -webkit-overflow-scrolling: touch; */
.scrolling-auto /* -webkit-overflow-scrolling: auto; */
.overflow-auto /* overflow: auto; */
.overflow-hidden /* overflow: hidden; */
.overflow-visible /* overflow: visible; */
.overflow-scroll /* overflow: scroll; */
.overflow-x-auto /* overflow-x: auto; */
.overflow-y-auto /* overflow-y: auto; */
.overflow-x-hidden /* overflow-x: hidden; */
.overflow-y-hidden /* overflow-y: hidden; */
.overflow-x-visible /* overflow-x: visible; */
.overflow-y-visible /* overflow-y: visible; */
.overflow-x-scroll /* overflow-x: scroll; */
.overflow-y-scroll /* overflow-y: scroll; */
.scrolling-touch /* -webkit-overflow-scrolling: touch; */
.scrolling-auto /* -webkit-overflow-scrolling: auto; */
/*
/*
* Position
* ----------
* Utilities for controlling how an element is positioned in the DOM.
* By default, only responsive variants are generated for position utilities.
*/
.static /* position: static; */
.fixed /* position: fixed; */
.absolute /* position: absolute; */
.relative /* position: relative; */
.sticky /* position: sticky; */
.static /* position: static; */
.fixed /* position: fixed; */
.absolute /* position: absolute; */
.relative /* position: relative; */
.sticky /* position: sticky; */
/*
/*
* Top / Right / Bottom / Left
* ----------
*
*
* Utilities for controlling the placement of positioned elements.
* By default, only responsive variants are generated for top, right, bottom, left, and inset utilities.
*/
/*
.inset-0 /* top: 0; right: 0; bottom: 0; left: 0; */
.inset-y-0 /* top: 0; bottom: 0; */
.inset-x-0 /* right: 0; left: 0; */
.top-0 /* top: 0; */
.right-0 /* right: 0; */
.bottom-0 /* bottom: 0; */
.left-0 /* left: 0; */
.inset-auto /* top: auto; right: auto; bottom: auto; left: auto; */
.inset-y-auto /* top: auto; bottom: auto; */
.inset-x-auto /* left: auto; right: auto; */
.top-auto /* top: auto; */
.bottom-auto /* bottom: auto; */
.left-auto /* left: auto; */
.right-auto /* right: auto; */
/*
* Visibility
* ----------
*
@ -161,7 +176,7 @@
*/
/*
/*
* Z-Index
* ----------
*
@ -169,265 +184,265 @@
*/
/* *******************************************************************************************
/* *******************************************************************************************
* FLEXBOX
* ******************************************************************************************* */
/*
/*
* Flex Direction
* ----------
*
*
*/
/*
/*
* Flex Wrap
* ----------
*
*
*/
/*
/*
* Align Items
* ----------
*
*
*/
/*
/*
* Align Content
* ----------
*
*
*/
/*
/*
* Align Self
* ----------
*
*
*/
/*
/*
* Justify Content
* ----------
*
*
*/
/*
/*
* Flex
* ----------
*
*
*/
/*
/*
* Flex Grow
* ----------
*
*
*/
/*
/*
* Flex Shrink
* ----------
*
*
*/
/*
/*
* Order
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* GRID
* ******************************************************************************************* */
/*
/*
* Grid Template Columns
* ----------
*
*
*/
/*
/*
* Grid Column Start / End
* ----------
*
*
*/
/*
/*
* Grid Template Rows
* ----------
*
*
*/
/*
/*
* Grid Row Start / End
* ----------
*
*
*/
/*
/*
* Gap
* ----------
*
*
*/
/*
/*
* Grid Auto Flow
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* SPACING
* ******************************************************************************************* */
/*
/*
* Padding
* ----------
*
*
*/
/*
/*
* Margin
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* SIZING
* ******************************************************************************************* */
/*
/*
* Width
* ----------
*
*
*/
/*
/*
* Min-Width
* ----------
*
*
*/
/*
/*
* Max-Width
* ----------
*
*
*/
/*
/*
* Height
* ----------
*
*
*/
/*
/*
* Min-Height
* ----------
*
*
*/
/*
/*
* Max-Height
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* TYPOGRAPHY
* ******************************************************************************************* */
/*
/*
* Font Family
* ----------
*
*
*/
/*
/*
* Font Size
* ----------
*
*
*/
/*
/*
* Font Smoothing
* ----------
*
*
*/
/*
/*
* Font Style
* ----------
*
*
*/
/*
/*
* Font Weight
* ----------
*
*
*/
/*
/*
* Letter Spacing
* ----------
*
*
*/
/*
/*
* Line Height
* ----------
*
*
*/
/*
/*
* List Style Type
* ----------
*
*
*/
/*
/*
* List Style Position
* ----------
*
*
*/
/*
/*
* Placeholder Color
* ----------
*
*
*/
/*
/*
* Text Align
* ----------
*
@ -435,35 +450,35 @@
*/
/*
/*
* Text Color
* ----------
*
*
*/
/*
/*
* Text Decoration
* ----------
*
*
*/
/*
/*
* Text Transform
* ----------
*
*
*/
/*
/*
* Vertical Align
* ----------
*
*
*/
/*
/*
* Whitespace
* ----------
*
@ -471,107 +486,107 @@
*/
/*
/*
* Word Break
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* BACKGROUNDS
* ******************************************************************************************* */
/*
/*
* BACKGROUND ATTACHMENT
* ----------
*
*
*/
/*
/*
* BACKGROUND COLOR
* ----------
*
*
*/
/*
/*
* BACKGROUND POSITION
* ----------
*
*
*/
/*
/*
* BACKGROUND REPEAT
* ----------
*
*
*/
/*
/*
* BACKGROUND SIZE
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* BORDERS
* ******************************************************************************************* */
/*
/*
* BORDER COLOR
* ----------
*
*
*/
/*
/*
* BORDER STYLE
* ----------
*
*
*/
/*
/*
* BORDER WIDTH
* ----------
*
*
*/
/*
/*
* BORDER RADIUS
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* TABLES
* ******************************************************************************************* */
/*
/*
* BORDER COLLAPSE
* ----------
*
*
*/
/*
/*
* TABLE LAYOUT
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* EFFECTS
* ******************************************************************************************* */
/*
/*
* BOX SHADOW
* ----------
*
@ -579,153 +594,153 @@
*/
/*
/*
* OPACITY
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* TRANSITIONS
* ******************************************************************************************* */
/*
/*
* TRANSITION PROPERTY
* ----------
*
*
*/
/*
/*
* TRANSITION DURATION
* ----------
*
*
*/
/*
/*
* TRANSITION TIMING FUNCTION
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* TRANSFORMS
* ******************************************************************************************* */
/*
/*
* SCALE
* ----------
*
*
*/
/*
/*
* ROTATE
* ----------
*
*
*/
/*
/*
* TRANSLATE
* ----------
*
*
*/
/*
/*
* SKEW
* ----------
*
*
*/
/*
/*
* TRANSFORM ORIGIN
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* INTERACTIVITY
* ******************************************************************************************* */
/*
/*
* APPEARANCE
* ----------
*
*
*/
/*
/*
* CURSOR
* ----------
*
*
*/
/*
/*
* OUTLINE
* ----------
*
*
*/
/*
/*
* POINTER EVENTS
* ----------
*
*
*/
/*
/*
* RESIZE
* ----------
*
*
*/
/*
/*
* USER SELECT
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* SVG
* ******************************************************************************************* */
/*
/*
* FILL
* ----------
*
*
*/
/*
/*
* STROKE
* ----------
*
*
*/
/*
/*
* STROKE WIDTH
* ----------
*
*
*/
/* *******************************************************************************************
/* *******************************************************************************************
* ACCESSIBILITY
* ******************************************************************************************* */
/*
/*
* SCREEN READERS
* ----------
*