123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146 |
- /*
-
- COORDINATES
- Docs: http://tachyons.io/docs/layout/position/
-
- Use in combination with the position module.
-
- Base:
- top
- bottom
- right
- left
-
- Modifiers:
- -0 = literal value 0
- -1 = literal value 1
- -2 = literal value 2
- --1 = literal value -1
- --2 = literal value -2
-
- Media Query Extensions:
- -ns = not-small
- -m = medium
- -l = large
-
- */
-
- .top-0 { top: 0; }
- .right-0 { right: 0; }
- .bottom-0 { bottom: 0; }
- .left-0 { left: 0; }
-
- .top-1 { top: 1rem; }
- .right-1 { right: 1rem; }
- .bottom-1 { bottom: 1rem; }
- .left-1 { left: 1rem; }
-
- .top-2 { top: 2rem; }
- .right-2 { right: 2rem; }
- .bottom-2 { bottom: 2rem; }
- .left-2 { left: 2rem; }
-
- .top--1 { top: -1rem; }
- .right--1 { right: -1rem; }
- .bottom--1 { bottom: -1rem; }
- .left--1 { left: -1rem; }
-
- .top--2 { top: -2rem; }
- .right--2 { right: -2rem; }
- .bottom--2 { bottom: -2rem; }
- .left--2 { left: -2rem; }
-
-
- .absolute--fill {
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
-
- @media (--breakpoint-not-small) {
- .top-0-ns { top: 0; }
- .left-0-ns { left: 0; }
- .right-0-ns { right: 0; }
- .bottom-0-ns { bottom: 0; }
- .top-1-ns { top: 1rem; }
- .left-1-ns { left: 1rem; }
- .right-1-ns { right: 1rem; }
- .bottom-1-ns { bottom: 1rem; }
- .top-2-ns { top: 2rem; }
- .left-2-ns { left: 2rem; }
- .right-2-ns { right: 2rem; }
- .bottom-2-ns { bottom: 2rem; }
- .top--1-ns { top: -1rem; }
- .right--1-ns { right: -1rem; }
- .bottom--1-ns { bottom: -1rem; }
- .left--1-ns { left: -1rem; }
- .top--2-ns { top: -2rem; }
- .right--2-ns { right: -2rem; }
- .bottom--2-ns { bottom: -2rem; }
- .left--2-ns { left: -2rem; }
- .absolute--fill-ns {
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
- }
-
- @media (--breakpoint-medium) {
- .top-0-m { top: 0; }
- .left-0-m { left: 0; }
- .right-0-m { right: 0; }
- .bottom-0-m { bottom: 0; }
- .top-1-m { top: 1rem; }
- .left-1-m { left: 1rem; }
- .right-1-m { right: 1rem; }
- .bottom-1-m { bottom: 1rem; }
- .top-2-m { top: 2rem; }
- .left-2-m { left: 2rem; }
- .right-2-m { right: 2rem; }
- .bottom-2-m { bottom: 2rem; }
- .top--1-m { top: -1rem; }
- .right--1-m { right: -1rem; }
- .bottom--1-m { bottom: -1rem; }
- .left--1-m { left: -1rem; }
- .top--2-m { top: -2rem; }
- .right--2-m { right: -2rem; }
- .bottom--2-m { bottom: -2rem; }
- .left--2-m { left: -2rem; }
- .absolute--fill-m {
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
- }
-
- @media (--breakpoint-large) {
- .top-0-l { top: 0; }
- .left-0-l { left: 0; }
- .right-0-l { right: 0; }
- .bottom-0-l { bottom: 0; }
- .top-1-l { top: 1rem; }
- .left-1-l { left: 1rem; }
- .right-1-l { right: 1rem; }
- .bottom-1-l { bottom: 1rem; }
- .top-2-l { top: 2rem; }
- .left-2-l { left: 2rem; }
- .right-2-l { right: 2rem; }
- .bottom-2-l { bottom: 2rem; }
- .top--1-l { top: -1rem; }
- .right--1-l { right: -1rem; }
- .bottom--1-l { bottom: -1rem; }
- .left--1-l { left: -1rem; }
- .top--2-l { top: -2rem; }
- .right--2-l { right: -2rem; }
- .bottom--2-l { bottom: -2rem; }
- .left--2-l { left: -2rem; }
- .absolute--fill-l {
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- }
- }
|