From 722484ef71b0298671fdc66e8985fc5c531f5907 Mon Sep 17 00:00:00 2001
From: “Ryder <“r@okfoc.us”>
Date: Tue, 29 Mar 2016 14:04:27 -0400
Subject: slick icon animation

---
 public/assets/ok.css | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

(limited to 'public')

diff --git a/public/assets/ok.css b/public/assets/ok.css
index c232883..6fc82e4 100644
--- a/public/assets/ok.css
+++ b/public/assets/ok.css
@@ -175,8 +175,44 @@ h3 {
     /*opacity:0.5;*/
     background: black;
 }
+nav svg g g rect {
+    transition:150ms all 50ms;
+    width: 100px;
+}
+
+
+nav svg g g:first-child rect{
+    transform: rotate(0deg);
+    transform-origin: center;
+}
+
+nav svg g g:nth-child(2) rect{
+    opacity:1;
+}
+
+nav svg g g:last-child rect{
+    transform: rotate(0deg);
+    transform-origin: center;
+}
 
 
+
+.navopen nav svg g g:first-child rect{
+    transform: rotate(45deg);
+    transform-origin: center;
+    width: 100px;
+}
+
+.navopen nav svg g g:nth-child(2) rect{
+    opacity:0;
+}
+
+.navopen nav svg g g:last-child rect{
+    transform: rotate(-45deg);
+    transform-origin: center;
+    width: 100px;
+}
+
 .navopen .item > * {
     opacity: 0.1;
     transition: 150ms opacity cubic-bezier(0, 0, 0, 1);
-- 
cgit v1.2.3-70-g09d2