aboutsummaryrefslogtreecommitdiffstats
path: root/src/css/imports/_hovers.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/css/imports/_hovers.css')
-rwxr-xr-xsrc/css/imports/_hovers.css71
1 files changed, 13 insertions, 58 deletions
diff --git a/src/css/imports/_hovers.css b/src/css/imports/_hovers.css
index 7e9a64e..a10c718 100755
--- a/src/css/imports/_hovers.css
+++ b/src/css/imports/_hovers.css
@@ -1,33 +1,16 @@
-/*
-
- HOVER EFFECTS
- Docs: http://tachyons.io/docs/themes/hovers/
-
- - Dim
- - Hide Child
- - Underline text
- - Grow
- - Pointer
- - Shadow
-
-*/
-
-/*
-
- Dim element on hover by adding the dim class.
-
-*/
-.dim {
- opacity: 1;
- transition: opacity .15s ease-in;
-}
-.dim:hover,
-.dim:focus {
- opacity: .5;
- transition: opacity .15s ease-in;
-}
-.dim:active {
- opacity: .8; transition: opacity .15s ease-out;
+@media (--breakpoint-large) {
+ .raise {
+ transform: none;
+ transition: var(--hover-transition);
+ }
+ .raise:hover,
+ .raise:focus {
+ transform: translateY(-.1rem);
+ transition: var(--hover-transition);
+ }
+ .raise:active {
+ opacity: .5; transition: var(--hover-transition);
+ }
}
/*
@@ -101,31 +84,3 @@
.pointer:hover {
cursor: pointer;
}
-
-/*
- Add shadow on hover.
-
- Performant box-shadow animation pattern from
- http://tobiasahlin.com/blog/how-to-animate-box-shadow/
-*/
-
-.shadow-hover::after {
- box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, .2 );
- opacity: 0;
- transition: opacity .25s ease-in-out;
-}
-
-.shadow-hover:hover::after,
-.shadow-hover:focus::after {
- opacity: 1;
-}
-
-/* Combine with classes in skins and skins-pseudo for
- * thousands of different transition possibilities. */
-
-.bg-animate,
-.bg-animate:hover,
-.bg-animate:focus {
- transition: background-color .15s ease-in-out;
-}
-