* fix border-radius typo

* Add patch from @lowmess for fixing shadow on hover
* Add links to nested css options
* Add opacity hovers
This commit is contained in:
mrmrs 2016-12-12 21:54:19 +00:00
parent bf83f285bb
commit 3f6aaa7513
6 changed files with 3381 additions and 4 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -109,8 +109,8 @@
.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;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.br--top-l {
border-bottom-left-radius: 0;

View File

@ -125,6 +125,11 @@
*/
.shadow-hover::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, .2 );
opacity: 0;
transition: opacity .25s ease-in-out;

View File

@ -1,6 +1,6 @@
/*
CHILDREN
NESTED
Tachyons module for styling nested elements
that are generated by a cms.
@ -44,3 +44,14 @@
display: block;
}
.nested-links a {
color: var(--blue);
transition: color .15s ease-in;
}
.nested-links a:hover,
.nested-links a:focus {
color: var(--light-blue);
transition: color .15s ease-in;
}

View File

@ -30,6 +30,43 @@
.hover-white:hover,
.hover-white:focus { color: var(--white); }
.hover-black-90:hover,
.hover-black-90:focus { color: var(--black-90); }
.hover-black-80:hover,
.hover-black-80:focus { color: var(--black-80); }
.hover-black-70:hover,
.hover-black-70:focus { color: var(--black-70); }
.hover-black-60:hover,
.hover-black-60:focus { color: var(--black-60); }
.hover-black-50:hover,
.hover-black-50:focus { color: var(--black-50); }
.hover-black-40:hover,
.hover-black-40:focus { color: var(--black-40); }
.hover-black-30:hover,
.hover-black-30:focus { color: var(--black-30); }
.hover-black-20:hover,
.hover-black-20:focus { color: var(--black-20); }
.hover-black-10:hover,
.hover-black-10:focus { color: var(--black-10); }
.hover-white-90:hover,
.hover-white-90:focus { color: var(--white-90); }
.hover-white-80:hover,
.hover-white-80:focus { color: var(--white-80); }
.hover-white-70:hover,
.hover-white-70:focus { color: var(--white-70); }
.hover-white-60:hover,
.hover-white-60:focus { color: var(--white-60); }
.hover-white-50:hover,
.hover-white-50:focus { color: var(--white-50); }
.hover-white-40:hover,
.hover-white-40:focus { color: var(--white-40); }
.hover-white-30:hover,
.hover-white-30:focus { color: var(--white-30); }
.hover-white-20:hover,
.hover-white-20:focus { color: var(--white-20); }
.hover-white-10:hover,
.hover-white-10:focus { color: var(--white-10); }
.hover-bg-black:hover,
.hover-bg-black:focus { background-color: var(--black); }
.hover-bg-near-black:hover,
@ -55,6 +92,43 @@
.hover-bg-transparent:hover,
.hover-bg-transparent:focus { background-color: var(--transparent); }
.hover-bg-black-90:hover,
.hover-bg-black-90:focus { color: var(--black-90); }
.hover-bg-black-80:hover,
.hover-bg-black-80:focus { color: var(--black-80); }
.hover-bg-black-70:hover,
.hover-bg-black-70:focus { color: var(--black-70); }
.hover-bg-black-60:hover,
.hover-bg-black-60:focus { color: var(--black-60); }
.hover-bg-black-50:hover,
.hover-bg-black-50:focus { color: var(--black-50); }
.hover-bg-black-40:hover,
.hover-bg-black-40:focus { color: var(--black-40); }
.hover-bg-black-30:hover,
.hover-bg-black-30:focus { color: var(--black-30); }
.hover-bg-black-20:hover,
.hover-bg-black-20:focus { color: var(--black-20); }
.hover-bg-black-10:hover,
.hover-bg-black-10:focus { color: var(--black-10); }
.hover-bg-white-90:hover,
.hover-bg-white-90:focus { color: var(--white-90); }
.hover-bg-white-80:hover,
.hover-bg-white-80:focus { color: var(--white-80); }
.hover-bg-white-70:hover,
.hover-bg-white-70:focus { color: var(--white-70); }
.hover-bg-white-60:hover,
.hover-bg-white-60:focus { color: var(--white-60); }
.hover-bg-white-50:hover,
.hover-bg-white-50:focus { color: var(--white-50); }
.hover-bg-white-40:hover,
.hover-bg-white-40:focus { color: var(--white-40); }
.hover-bg-white-30:hover,
.hover-bg-white-30:focus { color: var(--white-30); }
.hover-bg-white-20:hover,
.hover-bg-white-20:focus { color: var(--white-20); }
.hover-bg-white-10:hover,
.hover-bg-white-10:focus { color: var(--white-10); }
.hover-dark-red:hover,
.hover-dark-red:focus { color: var(--dark-red); }
.hover-red:hover,