aboutsummaryrefslogtreecommitdiffstats
path: root/src/css/imports/_border-radius.css
diff options
context:
space:
mode:
authorDarin Dimitroff <d@thecrazyones.agency>2017-01-02 16:09:21 +0200
committerDarin Dimitroff <d@thecrazyones.agency>2017-01-02 16:09:21 +0200
commit20d33818a838a7c022456d5620d255283531ba97 (patch)
tree7ea19ac7b847c10f2783a5b50f956f1e3ed5cbd6 /src/css/imports/_border-radius.css
parent4ad2ee71fbecb4dcef47319e3cbbe18b57cd1c61 (diff)
WIP
Diffstat (limited to 'src/css/imports/_border-radius.css')
-rwxr-xr-xsrc/css/imports/_border-radius.css190
1 files changed, 80 insertions, 110 deletions
diff --git a/src/css/imports/_border-radius.css b/src/css/imports/_border-radius.css
index 2422bd2..8cde05d 100755
--- a/src/css/imports/_border-radius.css
+++ b/src/css/imports/_border-radius.css
@@ -1,119 +1,89 @@
-/*
-
- BORDER RADIUS
- Docs: http://tachyons.io/docs/themes/border-radius/
-
- Base:
- br = border-radius
-
- Modifiers:
- 0 = 0/none
- 1 = 1st step in scale
- 2 = 2nd step in scale
- 3 = 3rd step in scale
- 4 = 4th step in scale
-
- Literal values:
- -100 = 100%
- -pill = 9999px
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
-*/
-
- :root {
- --border-radius: .25rem;
- }
-
- .br0 { border-radius: 0; }
- .br1 { border-radius: var(--border-radius); }
- .br-100 { border-radius: 100%; }
- .br-pill { border-radius: 9999px; }
- .br--bottom {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
- }
- .br--top {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- }
- .br--right {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
- }
- .br--left {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- }
+.br0 { border-radius: 0!important; }
+.br1 { border-radius: var(--border-radius); }
+.br-100 { border-radius: 100%; }
+.br-pill { border-radius: 9999px; }
+.br--bottom {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}
+.br--top {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+}
+.br--right {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.br--left {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
@media (--breakpoint-not-small) {
- .br0-ns { border-radius: 0; }
- .br1-ns { border-radius: var(--border-radius); }
- .br-100-ns { border-radius: 100%; }
- .br-pill-ns { border-radius: 9999px; }
- .br--bottom-ns {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
- }
- .br--top-ns {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- }
- .br--right-ns {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
- }
- .br--left-ns {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- }
+.br0-ns { border-radius: 0; }
+.br1-ns { border-radius: var(--border-radius); }
+.br-100-ns { border-radius: 100%; }
+.br-pill-ns { border-radius: 9999px; }
+.br--bottom-ns {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}
+.br--top-ns {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+}
+.br--right-ns {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.br--left-ns {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
}
@media (--breakpoint-medium) {
- .br0-m { border-radius: 0; }
- .br1-m { border-radius: var(--border-radius); }
- .br-100-m { border-radius: 100%; }
- .br-pill-m { border-radius: 9999px; }
- .br--bottom-m {
- border-top-left-radius: 0;
- border-top-right-radius: 0;
- }
- .br--top-m {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- }
- .br--right-m {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
- }
- .br--left-m {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- }
+.br0-m { border-radius: 0; }
+.br1-m { border-radius: var(--border-radius); }
+.br-100-m { border-radius: 100%; }
+.br-pill-m { border-radius: 9999px; }
+.br--bottom-m {
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}
+.br--top-m {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+}
+.br--right-m {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.br--left-m {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
}
@media (--breakpoint-large) {
- .br0-l { border-radius: 0; }
- .br1-l { border-radius: var(--border-radius); }
- .br-100-l { border-radius: 100%; }
- .br-pill-l { border-radius: 9999px; }
- .br--bottom-l {
- border-radius-top-left: 0;
- border-radius-top-right: 0;
- }
- .br--top-l {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- }
- .br--right-l {
- border-top-left-radius: 0;
- border-bottom-left-radius: 0;
- }
- .br--left-l {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
- }
+.br0-l { border-radius: 0; }
+.br1-l { border-radius: var(--border-radius); }
+.br-100-l { border-radius: 100%; }
+.br-pill-l { border-radius: 9999px; }
+.br--bottom-l {
+ border-radius-top-left: 0;
+ border-radius-top-right: 0;
+}
+.br--top-l {
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+}
+.br--right-l {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.br--left-l {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
}