archive-gh-me/tailwindcss
1
0
Fork 0
mirror of https://github.com/tailwindlabs/tailwindcss.git synced 2025-12-08 21:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Reintroduce radius-{side} utilities

Browse Source
This commit is contained in:
Adam Wathan 2017-11-13 14:56:11 -05:00
parent 924986f7ec
commit 5ef221cb64
2 changed files with 516 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

500
__tests__/fixtures/tailwind-output.css
View File

@ -2116,6 +2116,26 @@ button,
border-radius: 0;
}
.radius-t-none {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.radius-r-none {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.radius-b-none {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.radius-l-none {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.radius-tr-none {
border-top-right-radius: 0;
}
@ -2136,6 +2156,26 @@ button,
border-radius: .125rem;
}
.radius-t-sm {
border-top-left-radius: .125rem;
border-top-right-radius: .125rem;
}
.radius-r-sm {
border-top-right-radius: .125rem;
border-bottom-right-radius: .125rem;
}
.radius-b-sm {
border-bottom-right-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.radius-l-sm {
border-top-left-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.radius-tr-sm {
border-top-right-radius: .125rem;
}
@ -2156,6 +2196,26 @@ button,
border-radius: .25rem;
}
.radius-t-md {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.radius-r-md {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
.radius-b-md {
border-bottom-right-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.radius-l-md {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.radius-tr-md {
border-top-right-radius: .25rem;
}
@ -2176,6 +2236,26 @@ button,
border-radius: .5rem;
}
.radius-t-lg {
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
}
.radius-r-lg {
border-top-right-radius: .5rem;
border-bottom-right-radius: .5rem;
}
.radius-b-lg {
border-bottom-right-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.radius-l-lg {
border-top-left-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.radius-tr-lg {
border-top-right-radius: .5rem;
}
@ -2196,6 +2276,26 @@ button,
border-radius: 9999px;
}
.radius-t-full {
border-top-left-radius: 9999px;
border-top-right-radius: 9999px;
}
.radius-r-full {
border-top-right-radius: 9999px;
border-bottom-right-radius: 9999px;
}
.radius-b-full {
border-bottom-right-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.radius-l-full {
border-top-left-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.radius-tr-full {
border-top-right-radius: 9999px;
}
@ -5136,6 +5236,26 @@ button,
border-radius: 0;
}
.sm\:radius-t-none {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.sm\:radius-r-none {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.sm\:radius-b-none {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.sm\:radius-l-none {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.sm\:radius-tr-none {
border-top-right-radius: 0;
}
@ -5156,6 +5276,26 @@ button,
border-radius: .125rem;
}
.sm\:radius-t-sm {
border-top-left-radius: .125rem;
border-top-right-radius: .125rem;
}
.sm\:radius-r-sm {
border-top-right-radius: .125rem;
border-bottom-right-radius: .125rem;
}
.sm\:radius-b-sm {
border-bottom-right-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.sm\:radius-l-sm {
border-top-left-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.sm\:radius-tr-sm {
border-top-right-radius: .125rem;
}
@ -5176,6 +5316,26 @@ button,
border-radius: .25rem;
}
.sm\:radius-t-md {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.sm\:radius-r-md {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
.sm\:radius-b-md {
border-bottom-right-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.sm\:radius-l-md {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.sm\:radius-tr-md {
border-top-right-radius: .25rem;
}
@ -5196,6 +5356,26 @@ button,
border-radius: .5rem;
}
.sm\:radius-t-lg {
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
}
.sm\:radius-r-lg {
border-top-right-radius: .5rem;
border-bottom-right-radius: .5rem;
}
.sm\:radius-b-lg {
border-bottom-right-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.sm\:radius-l-lg {
border-top-left-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.sm\:radius-tr-lg {
border-top-right-radius: .5rem;
}
@ -5216,6 +5396,26 @@ button,
border-radius: 9999px;
}
.sm\:radius-t-full {
border-top-left-radius: 9999px;
border-top-right-radius: 9999px;
}
.sm\:radius-r-full {
border-top-right-radius: 9999px;
border-bottom-right-radius: 9999px;
}
.sm\:radius-b-full {
border-bottom-right-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.sm\:radius-l-full {
border-top-left-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.sm\:radius-tr-full {
border-top-right-radius: 9999px;
}
@ -8157,6 +8357,26 @@ button,
border-radius: 0;
}
.md\:radius-t-none {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.md\:radius-r-none {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.md\:radius-b-none {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.md\:radius-l-none {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.md\:radius-tr-none {
border-top-right-radius: 0;
}
@ -8177,6 +8397,26 @@ button,
border-radius: .125rem;
}
.md\:radius-t-sm {
border-top-left-radius: .125rem;
border-top-right-radius: .125rem;
}
.md\:radius-r-sm {
border-top-right-radius: .125rem;
border-bottom-right-radius: .125rem;
}
.md\:radius-b-sm {
border-bottom-right-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.md\:radius-l-sm {
border-top-left-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.md\:radius-tr-sm {
border-top-right-radius: .125rem;
}
@ -8197,6 +8437,26 @@ button,
border-radius: .25rem;
}
.md\:radius-t-md {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.md\:radius-r-md {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
.md\:radius-b-md {
border-bottom-right-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.md\:radius-l-md {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.md\:radius-tr-md {
border-top-right-radius: .25rem;
}
@ -8217,6 +8477,26 @@ button,
border-radius: .5rem;
}
.md\:radius-t-lg {
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
}
.md\:radius-r-lg {
border-top-right-radius: .5rem;
border-bottom-right-radius: .5rem;
}
.md\:radius-b-lg {
border-bottom-right-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.md\:radius-l-lg {
border-top-left-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.md\:radius-tr-lg {
border-top-right-radius: .5rem;
}
@ -8237,6 +8517,26 @@ button,
border-radius: 9999px;
}
.md\:radius-t-full {
border-top-left-radius: 9999px;
border-top-right-radius: 9999px;
}
.md\:radius-r-full {
border-top-right-radius: 9999px;
border-bottom-right-radius: 9999px;
}
.md\:radius-b-full {
border-bottom-right-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.md\:radius-l-full {
border-top-left-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.md\:radius-tr-full {
border-top-right-radius: 9999px;
}
@ -11178,6 +11478,26 @@ button,
border-radius: 0;
}
.lg\:radius-t-none {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.lg\:radius-r-none {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.lg\:radius-b-none {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.lg\:radius-l-none {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.lg\:radius-tr-none {
border-top-right-radius: 0;
}
@ -11198,6 +11518,26 @@ button,
border-radius: .125rem;
}
.lg\:radius-t-sm {
border-top-left-radius: .125rem;
border-top-right-radius: .125rem;
}
.lg\:radius-r-sm {
border-top-right-radius: .125rem;
border-bottom-right-radius: .125rem;
}
.lg\:radius-b-sm {
border-bottom-right-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.lg\:radius-l-sm {
border-top-left-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.lg\:radius-tr-sm {
border-top-right-radius: .125rem;
}
@ -11218,6 +11558,26 @@ button,
border-radius: .25rem;
}
.lg\:radius-t-md {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.lg\:radius-r-md {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
.lg\:radius-b-md {
border-bottom-right-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.lg\:radius-l-md {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.lg\:radius-tr-md {
border-top-right-radius: .25rem;
}
@ -11238,6 +11598,26 @@ button,
border-radius: .5rem;
}
.lg\:radius-t-lg {
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
}
.lg\:radius-r-lg {
border-top-right-radius: .5rem;
border-bottom-right-radius: .5rem;
}
.lg\:radius-b-lg {
border-bottom-right-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.lg\:radius-l-lg {
border-top-left-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.lg\:radius-tr-lg {
border-top-right-radius: .5rem;
}
@ -11258,6 +11638,26 @@ button,
border-radius: 9999px;
}
.lg\:radius-t-full {
border-top-left-radius: 9999px;
border-top-right-radius: 9999px;
}
.lg\:radius-r-full {
border-top-right-radius: 9999px;
border-bottom-right-radius: 9999px;
}
.lg\:radius-b-full {
border-bottom-right-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.lg\:radius-l-full {
border-top-left-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.lg\:radius-tr-full {
border-top-right-radius: 9999px;
}
@ -14199,6 +14599,26 @@ button,
border-radius: 0;
}
.xl\:radius-t-none {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.xl\:radius-r-none {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
.xl\:radius-b-none {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.xl\:radius-l-none {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.xl\:radius-tr-none {
border-top-right-radius: 0;
}
@ -14219,6 +14639,26 @@ button,
border-radius: .125rem;
}
.xl\:radius-t-sm {
border-top-left-radius: .125rem;
border-top-right-radius: .125rem;
}
.xl\:radius-r-sm {
border-top-right-radius: .125rem;
border-bottom-right-radius: .125rem;
}
.xl\:radius-b-sm {
border-bottom-right-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.xl\:radius-l-sm {
border-top-left-radius: .125rem;
border-bottom-left-radius: .125rem;
}
.xl\:radius-tr-sm {
border-top-right-radius: .125rem;
}
@ -14239,6 +14679,26 @@ button,
border-radius: .25rem;
}
.xl\:radius-t-md {
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
}
.xl\:radius-r-md {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
.xl\:radius-b-md {
border-bottom-right-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.xl\:radius-l-md {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.xl\:radius-tr-md {
border-top-right-radius: .25rem;
}
@ -14259,6 +14719,26 @@ button,
border-radius: .5rem;
}
.xl\:radius-t-lg {
border-top-left-radius: .5rem;
border-top-right-radius: .5rem;
}
.xl\:radius-r-lg {
border-top-right-radius: .5rem;
border-bottom-right-radius: .5rem;
}
.xl\:radius-b-lg {
border-bottom-right-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.xl\:radius-l-lg {
border-top-left-radius: .5rem;
border-bottom-left-radius: .5rem;
}
.xl\:radius-tr-lg {
border-top-right-radius: .5rem;
}
@ -14279,6 +14759,26 @@ button,
border-radius: 9999px;
}
.xl\:radius-t-full {
border-top-left-radius: 9999px;
border-top-right-radius: 9999px;
}
.xl\:radius-r-full {
border-top-right-radius: 9999px;
border-bottom-right-radius: 9999px;
}
.xl\:radius-b-full {
border-bottom-right-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.xl\:radius-l-full {
border-top-left-radius: 9999px;
border-bottom-left-radius: 9999px;
}
.xl\:radius-tr-full {
border-top-right-radius: 9999px;
}

16
src/generators/rounded.js
View File

@ -6,6 +6,22 @@ function sizedBorder(radius, modifier) {
[`radius-${modifier}`]: {
'border-radius': `${radius}`,
},
[`radius-t-${modifier}`]: {
'border-top-left-radius': `${radius}`,
'border-top-right-radius': `${radius}`,
},
[`radius-r-${modifier}`]: {
'border-top-right-radius': `${radius}`,
'border-bottom-right-radius': `${radius}`,
},
[`radius-b-${modifier}`]: {
'border-bottom-right-radius': `${radius}`,
'border-bottom-left-radius': `${radius}`,
},
[`radius-l-${modifier}`]: {
'border-top-left-radius': `${radius}`,
'border-bottom-left-radius': `${radius}`,
},
[`radius-tr-${modifier}`]: {
'border-top-right-radius': `${radius}`,
},