From 65df9b0915b4bfe76057f64f6c7c88ff82194328 Mon Sep 17 00:00:00 2001 From: “Ryder <“r@okfoc.us”> Date: Tue, 29 Mar 2016 12:48:42 -0400 Subject: cursors and intro --- public/assets/img/d.png | Bin 0 -> 290 bytes public/assets/img/l.png | Bin 0 -> 187 bytes public/assets/img/r.png | Bin 0 -> 186 bytes public/assets/img/u.png | Bin 0 -> 288 bytes public/assets/img/x.png | Bin 0 -> 422 bytes public/assets/ok.css | 125 +++++++++++++++++++++++++++++++++++++++++++----- 6 files changed, 114 insertions(+), 11 deletions(-) create mode 100644 public/assets/img/d.png create mode 100644 public/assets/img/l.png create mode 100644 public/assets/img/r.png create mode 100644 public/assets/img/u.png create mode 100644 public/assets/img/x.png (limited to 'public') diff --git a/public/assets/img/d.png b/public/assets/img/d.png new file mode 100644 index 0000000..9530c09 Binary files /dev/null and b/public/assets/img/d.png differ diff --git a/public/assets/img/l.png b/public/assets/img/l.png new file mode 100644 index 0000000..383e388 Binary files /dev/null and b/public/assets/img/l.png differ diff --git a/public/assets/img/r.png b/public/assets/img/r.png new file mode 100644 index 0000000..8fb6dfb Binary files /dev/null and b/public/assets/img/r.png differ diff --git a/public/assets/img/u.png b/public/assets/img/u.png new file mode 100644 index 0000000..530d460 Binary files /dev/null and b/public/assets/img/u.png differ diff --git a/public/assets/img/x.png b/public/assets/img/x.png new file mode 100644 index 0000000..71d3017 Binary files /dev/null and b/public/assets/img/x.png differ diff --git a/public/assets/ok.css b/public/assets/ok.css index ee7282b..ea931b0 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -35,6 +35,78 @@ body { overflow: hidden; } +.hidden { + display: none!important; +} + +h1 { + font-size: 27px; + line-height: 32px; +} + +h1 span { + font-size: 16px; + line-height: 20px; + width: 50%; + margin: 10px 0; +} + +h2 { + font-size: 16px; + margin: 20px 0; +} + +h3 { + font-size: 12px; +} + +.intro a { + width: 100%; + display: inline-block; +} + +.intro a:before { + content: "– "; +} + +.intro { + font-size: 12px; + line-height: 20px; +} + +.intro .left { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + justify-content: space-between; + align-content: stretch; + align-items: flex-start; +} + +.intro div { + width: 25%; + float: left; + clear: both; + height: 100%; + padding: 27px 5px 5px 5px; +} + +.intro div.text { + width: 50%; + -webkit-column-count: 2; + -webkit-column-gap: 5px; + -moz-column-gap: 5px; + column-gap: 5px; + font-size: 12px; +} + +.intro .right { + background: url(http://ryder-ripps.com/press/ryder-ripps.jpg)no-repeat center; + background-size: cover; + -webkit-filter: grayscale(100%); + filter: grayscale(100%); +} + .menu { position: fixed; height: 100vh; @@ -95,6 +167,7 @@ menu ul { opacity: 0.1; transition: 150ms opacity cubic-bezier(0, 0, 0, 1); background: #eee; + cursor: url(img/x.png), pointer; } div, @@ -105,6 +178,7 @@ span { .item { height: 100vh; + width: 100%; display: -webkit-flex; display: flex; -webkit-flex-flow: column wrap; @@ -114,7 +188,14 @@ span { body, nav { - background: #fff; + background: white; + transition: 300ms background 150ms; + transition-timing-function: cubic-bezier(0, 0, 0, 1); +} + +.navopen nav, +body.navopen { + background: #f9f9f9; } nav { @@ -141,7 +222,7 @@ nav span { } .index { - width: 60px; + width: 65px; transition: 150ms width; transition-timing-function: cubic-bezier(0, 0, 0, 1); } @@ -223,6 +304,28 @@ nav b { outline: none; } +.flickity-viewport:before { + content: ""; + height: 20vw; + width: 60vw; + position: absolute; + z-index: 3; + margin-left: 20vw; + cursor: url(img/u.png), pointer; +} + + +.flickity-viewport:after { + content: ""; + height: 20vw; + width: 60vw; + position: absolute; + z-index: 3; + bottom:0; + margin-left: 20vw; + cursor: url(img/d.png), pointer; +} + .flickity-viewport { overflow: hidden; position: relative; @@ -235,30 +338,29 @@ nav b { } button { - width: 10vw; + width: 20vw; position: absolute; top: 0; background: transparent; - cursor: pointer; } -.navopen button { +.navopen button, +.navopen iframe.cell { pointer-events: none; } button svg { - opacity: 0; - transition: 150ms all; - transition-timing-function: cubic-bezier(0, 0, 0, 1); - transform: scale(0.3); + display: none; } button.next { right: 0; + cursor: url(img/r.png), pointer; } button.previous { left: 0; + cursor: url(img/l.png), pointer; } .desktop button.previous:hover svg, @@ -267,8 +369,8 @@ button.previous { transform: scale(0.2); } -button.next:active svg, -button.previous:active svg { +.desktop button.next:active svg, +.desktop button.previous:active svg { transform: scale(0.1); } @@ -294,6 +396,7 @@ button.previous:active svg { flex: 0 auto; overflow: hidden; padding: 5px 0; + cursor: url(img/d.png), pointer; } .five { -- cgit v1.2.3-70-g09d2 From e7893c73df6d0a1ace66e764b3b3298f41232aec Mon Sep 17 00:00:00 2001 From: “Ryder <“r@okfoc.us”> Date: Tue, 29 Mar 2016 12:49:28 -0400 Subject: moving tomato --- public/assets/img/tomato20dancing.gif | Bin 0 -> 36620 bytes public/assets/ok.css | 2 +- public/assets/tomato20dancing.gif | Bin 36620 -> 0 bytes 3 files changed, 1 insertion(+), 1 deletion(-) create mode 100644 public/assets/img/tomato20dancing.gif delete mode 100644 public/assets/tomato20dancing.gif (limited to 'public') diff --git a/public/assets/img/tomato20dancing.gif b/public/assets/img/tomato20dancing.gif new file mode 100644 index 0000000..0416665 Binary files /dev/null and b/public/assets/img/tomato20dancing.gif differ diff --git a/public/assets/ok.css b/public/assets/ok.css index ea931b0..62c4428 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -388,7 +388,7 @@ button.previous { } .resizing .top { - background: url(tomato20dancing.gif)center; + background: url(img/tomato20dancing.gif)center; } .bottom { diff --git a/public/assets/tomato20dancing.gif b/public/assets/tomato20dancing.gif deleted file mode 100644 index 0416665..0000000 Binary files a/public/assets/tomato20dancing.gif and /dev/null differ -- cgit v1.2.3-70-g09d2 From 9caa4dec9468be2da599959dd0b73d958a71a1aa Mon Sep 17 00:00:00 2001 From: “Ryder <“r@okfoc.us”> Date: Tue, 29 Mar 2016 12:50:54 -0400 Subject: adding white x --- public/assets/img/x-w.png | Bin 0 -> 389 bytes public/assets/ok.css | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) create mode 100644 public/assets/img/x-w.png (limited to 'public') diff --git a/public/assets/img/x-w.png b/public/assets/img/x-w.png new file mode 100644 index 0000000..076b63d Binary files /dev/null and b/public/assets/img/x-w.png differ diff --git a/public/assets/ok.css b/public/assets/ok.css index 62c4428..64d139d 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -167,7 +167,7 @@ menu ul { opacity: 0.1; transition: 150ms opacity cubic-bezier(0, 0, 0, 1); background: #eee; - cursor: url(img/x.png), pointer; + cursor: url(img/x-w.png), pointer; } div, -- cgit v1.2.3-70-g09d2 From fa313e781f0aff437f8f631030e9b55da9c05b02 Mon Sep 17 00:00:00 2001 From: “Ryder <“r@okfoc.us”> Date: Tue, 29 Mar 2016 12:59:40 -0400 Subject: cursor offset --- db.json | 7 ++++++- public/assets/ok.css | 13 +++++++------ 2 files changed, 13 insertions(+), 7 deletions(-) (limited to 'public') diff --git a/db.json b/db.json index cd10ef1..b7f5093 100644 --- a/db.json +++ b/db.json @@ -159,7 +159,12 @@ "containImage": "false", "__index": "0", "dateCreated": "Tue, 29 Mar 2016 15:45:57 GMT", - "press": [] + "press": [ + { + "text": "google", + "uri": "google.com" + } + ] } ], "page": [ diff --git a/public/assets/ok.css b/public/assets/ok.css index 64d139d..03b0a3b 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -26,6 +26,7 @@ a:visited { color: blue; font-weight: bold; font-size: 11px; + cursor:pointer; } body { @@ -167,7 +168,7 @@ menu ul { opacity: 0.1; transition: 150ms opacity cubic-bezier(0, 0, 0, 1); background: #eee; - cursor: url(img/x-w.png), pointer; + cursor: url(img/x-w.png) 32 32, pointer; } div, @@ -311,7 +312,7 @@ nav b { position: absolute; z-index: 3; margin-left: 20vw; - cursor: url(img/u.png), pointer; + cursor: url(img/u.png) 32 0, pointer; } @@ -323,7 +324,7 @@ nav b { z-index: 3; bottom:0; margin-left: 20vw; - cursor: url(img/d.png), pointer; + cursor: url(img/d.png)32 64, pointer; } .flickity-viewport { @@ -355,12 +356,12 @@ button svg { button.next { right: 0; - cursor: url(img/r.png), pointer; + cursor: url(img/r.png)64 32, pointer; } button.previous { left: 0; - cursor: url(img/l.png), pointer; + cursor: url(img/l.png) 0 32, pointer; } .desktop button.previous:hover svg, @@ -396,7 +397,7 @@ button.previous { flex: 0 auto; overflow: hidden; padding: 5px 0; - cursor: url(img/d.png), pointer; + cursor: url(img/d.png)32 64, pointer; } .five { -- cgit v1.2.3-70-g09d2