diff options
Diffstat (limited to 'templates/index.liquid')
| -rw-r--r-- | templates/index.liquid | 203 |
1 files changed, 43 insertions, 160 deletions
diff --git a/templates/index.liquid b/templates/index.liquid index 0313ec1..f045321 100644 --- a/templates/index.liquid +++ b/templates/index.liquid @@ -1,158 +1,40 @@ <!DOCTYPE html> <html> + <head> - <title>OKFOCUS</title> - <meta charset="utf-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> - <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> - <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> - <meta name="apple-mobile-web-app-status-bar-style" content="black"> - <meta name="apple-mobile-web-app-capable" content="yes"> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> - <meta name="keywords" content="OKFocus, " /> - <meta name="description" content="OKFocus" /> - <meta property="og:title" content="OKFocus" /> - <meta property="og:type" content="website" /> - <meta property="og:image" content="/icon.jpg" /> - <meta property="og:url" content="http://" /> - <meta property="og:site_name" content="OKFocus" /> - <meta name="apple-mobile-web-app-capable" content="yes"> - <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> - <link rel="image_src" href="/icon.jpg" /> - <link rel="shortcut icon" href="/favicon.ico" /> - <link rel="apple-touch-icon" href="/icon.jpg" /> - <link rel="apple-touch-icon-precomposed" href="/icon.jpg" /> - <link href='https://fonts.googleapis.com/css?family=Roboto+Mono:400,100,100italic,300,300italic,400italic,700,700italic|Roboto:400,300italic,300,500italic,500,400italic,700,700italic' rel='stylesheet' type='text/css'> - <style> - html { - box-sizing: border-box; - } - - *, - *:before, - *:after { - box-sizing: inherit; - padding: 0; - margin: 0; - } - - a, - a:visited { - color: blue; - } - - body { - font-family: 'Roboto Mono', monospace; - font-size: 11px; - } - - div, - span { - display: inline-block; - float: left; - } - - .item { - height: 100vh; - display: -webkit-flex; - display: flex; - -webkit-flex-flow: column wrap; - flex-flow: column wrap; - } - - .top, - .bottom { - -webkit-flex: 1 auto; - flex: 1 auto; - } - - .top { - background: yellow; - width: 100%; - /*height: 80vh;*/ - flex: 1 auto; - } - - .bottom { - /*height: 20vh;*/ - flex: 0 auto; - background: #eee; - overflow: hidden; - padding:5px 0; - } - - .five { - width: 100%; - } - - .headings { - font-size: 10px; - font-weight: 700; - } - - .texts { - font-weight: 400; - padding: 5px 0 0 0; - } - - .five span { - width: calc(12% - 8px); - margin: 0 4px; - } - - .press .headings span:nth-child(5) { - width: calc(40% - 8px); - } - - .headings span { - border-bottom: 1px solid; - padding: 0 0 2px 0; - } - - .press .headings span:last-child:before { - content: "PRESS"; - } - - .five .description { - width: 50%; - -webkit-column-count: 3; - font-size: 12px; - } - - .press .five .description { - width: calc(40% - 8px); - -webkit-column-count: 2; - } - - .press .texts span:last-child a { - width: 100%; - display: inline-block; - } - - ul li { - list-style-type: none; - } - .nopress span:nth-child(5) { - width: calc(52% - 8px); - } - .nopress span:last-child { - display:none; - } - </style> + <title>OKFocus</title> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> + <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> + <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> + <meta name="apple-mobile-web-app-status-bar-style" content="black"> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> + <meta name="keywords" content="OKFocus, " /> + <meta name="description" content="OKFocus" /> + <meta property="og:title" content="OKFocus" /> + <meta property="og:type" content="website" /> + <meta property="og:image" content="/icon.jpg" /> + <meta property="og:url" content="http://" /> + <meta property="og:site_name" content="OKFocus" /> + <meta name="apple-mobile-web-app-capable" content="yes"> + <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> + <link rel="image_src" href="/icon.jpg" /> + <link rel="shortcut icon" href="/favicon.ico" /> + <link rel="apple-touch-icon" href="/icon.jpg" /> + <link rel="apple-touch-icon-precomposed" href="/icon.jpg" /> + <link href='https://fonts.googleapis.com/css?family=Roboto:400,300italic,300,400italic,700|Roboto+Mono:700' rel='stylesheet' type='text/css'> + <link href='assets/ok.css' rel='stylesheet' type='text/css'> </head> <body> - -{% for project in projects %} + {% for project in projects %} <div class="item"> <div class="top"> - <nav> - <div class="gallery"> - <div class="cell" style="background-image:url({{ project.image.uri }})">...</div> - <div class="cell">...</div> - <div class="cell">...</div> - </div> + <div class="cell" style="background-image:url({{ project.image.uri }})"></div> + <div class="cell"></div> + <div class="cell"></div> </div> <div class="bottom {% if project.press %}press{% else %}nopress{% endif %}"> <div class="headings five"> @@ -171,9 +53,9 @@ <ul> {% assign categories = project.NatureOfWork | split "\n" %} {% for category in categories %} - <li> - {{ category }} - </li> + <li> + {{ category }} + </li> {% endfor %} </ul> </span> @@ -181,24 +63,25 @@ {{ project.brief }} </span> <span> - <ul> - {% for link in project.links %} - <li> - <a href="{{ link.url }}">{{ link.name }}</a> - </li> - {% endfor %} - </ul> + <ul> + {% for link in project.links %} + <li> + <a href="{{ link.url }}">{{ link.name }}</a> + </li> + {% endfor %} + </ul> </span> </div> </div> </div> -{% endfor %} - + {% endfor %} </body> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> {% if meta.production %} <script src="/assets/js/app.min.js"></script> {% else %} +<script src="/assets/js/flickity.pkfg.js"></script> <script src="/assets/js/app.js"></script> {% endif %} -</html> + +</html>
\ No newline at end of file |