diff options
Diffstat (limited to 'public/assets')
| -rw-r--r-- | public/assets/img/okfocus_logo.gif | bin | 0 -> 59245 bytes | |||
| -rw-r--r-- | public/assets/img/okfocus_logo.png | bin | 0 -> 2697 bytes | |||
| -rw-r--r-- | public/assets/js/app.js | 1 | ||||
| -rw-r--r-- | public/assets/ok.css | 69 |
4 files changed, 65 insertions, 5 deletions
diff --git a/public/assets/img/okfocus_logo.gif b/public/assets/img/okfocus_logo.gif Binary files differnew file mode 100644 index 0000000..1a1af64 --- /dev/null +++ b/public/assets/img/okfocus_logo.gif diff --git a/public/assets/img/okfocus_logo.png b/public/assets/img/okfocus_logo.png Binary files differnew file mode 100644 index 0000000..1bbf41b --- /dev/null +++ b/public/assets/img/okfocus_logo.png diff --git a/public/assets/js/app.js b/public/assets/js/app.js index 4c06729..b3503de 100644 --- a/public/assets/js/app.js +++ b/public/assets/js/app.js @@ -88,4 +88,5 @@ $('.top').flickity(app.flickity_options).on( 'cellSelect', function(e) { $(".previous, .next").css({ 'height': ($(".top").height() + 'px') }) + app.init() diff --git a/public/assets/ok.css b/public/assets/ok.css index 47c61b2..ae352c2 100644 --- a/public/assets/ok.css +++ b/public/assets/ok.css @@ -107,7 +107,19 @@ h3 { -webkit-filter: grayscale(100%); filter: grayscale(100%); } - +.intro.cover .left span#cred { + width: 100%; + border-top: 1px solid; + padding: 15px 0 10px 0; +} +.intro.cover .left small { + display:none; +} +.intro.cover .right { + background: url(https://upload.wikimedia.org/wikipedia/commons/d/de/Victoria_crater_from_HiRise.jpg)no-repeat center; + background-size: cover; + width:75%; +} .menu { position: fixed; height: 100vh; @@ -131,8 +143,9 @@ h3 { break-inside: avoid-column; } -menu ul { - list-style-type: upper-roman; +.menu ul { + height:100%; + } .menu ul li { @@ -162,9 +175,45 @@ menu ul { /*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; +} -.navopen .item .top, -.navopen .item .bottom { +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); background: #eee; @@ -177,6 +226,11 @@ span { float: left; } +#items { + display: block; + float: none; +} + .item { height: 100vh; width: 100%; @@ -461,6 +515,11 @@ ul li { width: calc(52% - 8px); } +.press ul { + cursor:default; + height: 100% +} + .nopress span:last-child { display: none; } |
