androiddrew
/
datasketch-io
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Converted to new Tachyons based layout and style

Browse Source
master
androiddrew 6 years ago
parent a371f47bf2
commit bfcdb4b702
12 changed files with 161 additions and 79 deletions
Show Stats Download Patch File Download Diff File

3
services/cms/blog/templates/blog/blog_index_page.html
Unescape Escape View File

@ -6,6 +6,8 @@
{% block content %}
{% include 'header.html' %}
<section class="mw7 center bg-white-10">
<h1 class="ph3 ph0-l">{{ page.title }}</h1>
@ -33,5 +35,6 @@
</section>
{% include 'footer.html' %}
{% endblock %}

24
services/cms/blog/templates/blog/blog_page.html
Unescape Escape View File

@ -5,10 +5,18 @@
{% block body_class %}helvetica{% endblock %}
{% block content %}
{% include 'header.html' %}
<article class="ph3 ph3-ns center mw8">
<h1>{{ page.title }}</h1>
<p class="meta">{{ page.date }}</p>
{% if page.tags.all.count %}
<div class="dib">
{% for tag in page.tags.all %}
<a href="{% slugurl 'tags' %}?tag={{ tag }}" class="f6 link dim br1 ph3 pv2 mb2 dib white bg-black">{{ tag }}</a>
{% endfor %}
</div>
{% endif %}
<div class="intro">{{ page.intro }}</div>
{{ page.body|richtext }}
{% for item in page.gallery_images.all %}
@ -18,17 +26,5 @@
</div>
{% endfor %}
{% if page.tags.all.count %}
<div class="tags">
<h3>Tags</h3>
{% for tag in page.tags.all %}
<a href="{% slugurl 'tags' %}?tag={{ tag }}">
<button type="button">{{ tag }}</button>
</a>
{% endfor %}
</div>
{% endif %}
<p><a href="{{ page.get_parent.url }}">Return to blog</a></p>
</article>
{% endblock %}

2
services/cms/blog/templates/blog/blog_tag_index_page.html
Unescape Escape View File

@ -4,7 +4,7 @@
{% block body_class %}helvetica{% endblock %}
{% block content %}
{% include 'header.html' %}
<section class="mw7 center">
{% if request.GET.tag|length %}
<h1 class="ph3 ph0-l">Showing pages tagged "{{ request.GET.tag }}"</h1>

9
services/cms/cms/static/css/cms.css
Unescape Escape View File

@ -0,0 +1,9 @@
.bg-grad-blue {
background-image: linear-gradient(-208deg, #86C3D0 0%, #4E90A3 66%); }
.bg-grad-green {
background-image: linear-gradient(to top right, #41b782, #86D169); }
.hover-bg-orange:hover {
background-color: #FF6300;
transition: all .3s ease; }

12
services/cms/cms/static/icon/basic_book_pen.svg
Unescape Escape View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="64px" height="64px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
<rect x="1" y="1" fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" width="46" height="62"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="9" y1="63" x2="9" y2="2"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="14" y1="15" x2="42" y2="15"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="14" y1="21" x2="42" y2="21"/>
<polygon fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" points="63,3 63,53 59,61 55,53 55,3 "/>
<polyline fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" points="55,7 51,7 51,17 "/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

12
services/cms/cms/static/icon/basic_settings.svg
Unescape Escape View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="64px" height="64px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="36" y1="34" x2="41" y2="39"/>
<rect x="46.257" y="35.065" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 120.5036 47.0858)" fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" width="8.485" height="26.87"/>
<polygon fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" points="12,16 18,10 8,4 6,6 "/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="28" y1="26" x2="15" y2="13"/>
<path fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M58,12.5l-8,3.75l-4-4.125l3.5-8.062l0,0
C39.5,4.062,37,9,37,14v4L3.5,52l-1.75,6l2.125,2l6.062-1.5L44,25h4C53,25,58,22.5,58,12.5L58,12.5z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

14
services/cms/cms/static/icon/basic_webpage_txt.svg
Unescape Escape View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="64px" height="64px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="6" y1="25" x2="58" y2="25"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="6" y1="33" x2="58" y2="33"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="6" y1="41" x2="58" y2="41"/>
<rect x="1" y="7" fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" width="62" height="50"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="1" y1="15" x2="63" y2="15"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="10" y1="11" x2="6" y2="11"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="18" y1="11" x2="14" y2="11"/>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="26" y1="11" x2="22" y2="11"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

12
services/cms/cms/static/scss/cms.scss
Unescape Escape View File

@ -0,0 +1,12 @@
.bg-grad-blue {
background-image: linear-gradient(-208deg, #86C3D0 0%, #4E90A3 66%);
}
.bg-grad-green {
background-image: linear-gradient(to top right, #41b782, #86D169);
}
.hover-bg-orange:hover {
background-color: #FF6300;
transition: all .3s ease;
}

2
services/cms/cms/templates/base.html
Unescape Escape View File

@ -29,8 +29,6 @@
<body class="{% block body_class %}{% endblock %}">
{% wagtailuserbar %}
{% include "header.html" %}
{% block content %}{% endblock %}

10
services/cms/cms/templates/footer.html
Unescape Escape View File

@ -0,0 +1,10 @@
{% load wagtailcore_tags %}
<footer class="pv5 pv6-ns ph3 ph5-m ph6-l white-70 bg-black-50">
<small class="f6 db tc">© 2018 <span class="ttu f5 fw3">Andrew Bednar</span>, All Rights Reserved</small>
<div class="tc mt3">
<a href="/terms/" title="Terms" class="f5 dib ph2 link white-70 dim mb2">Terms of Use</a>
<a href="/privacy/" title="Privacy" class="f5 dib ph2 link white-70 dim mb2">Privacy</a>
<a href="http://linea.io/" title="Privacy" class="f5 dib ph2 link white-70 dim mb2">Icons by Dario Ferrando</a>
</div>
</footer>

21
services/cms/cms/templates/header.html
Unescape Escape View File

@ -1,17 +1,20 @@
{% load wagtailcore_tags %}
<nav class="dt w-100 center bg-dark-green">
<div class="dtc w2 v-mid pa3">
<a href="{% slugurl 'home' %}" class="dib w2 h2 pa1 br1 ba b--white-90 grow-large border-box">
<header class="dt w-100 bg-grad-blue ph2 ph3-ns ph3-m">
<div id="logo" class="dtc v-mid">
<a href="{% slugurl 'home' %}" class="f2-ns f3 fw6 link dim white mr3">Datasketch.io</a>
</div>
<nav class="dtc tr fw6 f6 pv3 pv4-ns pv4-m pv4-l ttu tracked">
<a href="{% slugurl 'blog' %}" class="no-underline dim white mr2 mr3-ns dn dib-l dib-m">Blog</a>
<a href="{% slugurl 'home' %}#services" class="no-underline dim white mr2 mr3-ns dn dib-l dib-m">Services</a>
<!-- <a href="{% slugurl 'blog' %}" class="no-underline dim white mr2 mr3-ns dn dib-l dib-m">Portfolio</a> -->
<a href="{% slugurl 'home' %}#connect" class="hover-bg-orange no-underline white mr2 mr3-ns ba pv2 ph3 br1 dn dib-l dib-m">Connect</a>
<a href="{% slugurl 'home' %}" class="dib dn-ns w2 h2 pa1 br1 ba b--white-90 grow-large border-box">
<svg class="link white-90 hover-white" data-icon="skull" viewBox="0 0 32 32" style="fill:currentcolor"><title>
skull icon</title>
<path
d="M16 0 C6 0 2 4 2 14 L2 22 L6 24 L6 30 L26 30 L26 24 L30 22 L30 14 C30 4 26 0 16 0 M9 12 A4.5 4.5 0 0 1 9 21 A4.5 4.5 0 0 1 9 12 M23 12 A4.5 4.5 0 0 1 23 21 A4.5 4.5 0 0 1 23 12"></path>
</svg>
</a>
</div>
<div class="dtc v-mid tr pa3">
<a class="f6 fw4 hover-white no-underline white-70 dn dib-ns pv2 ph3" href="{% slugurl 'blog' %}">Blog</a>
<a class="f6 fw4 hover-white no-underline white-70 br1 dib ml2 pv2 ph3 ba grow" href="#">Connect</a>
</div>
</nav>
</nav>
</header>

51
services/cms/home/templates/home/home_page.html
Unescape Escape View File

@ -7,26 +7,24 @@
{% block body_class %}helvetica bg-black-10{% endblock %}
{% block content %}
<header class="sans-serif">
<div class="cover bg-left bg-center-l" style="background-image: url({% static "img/programming_background.jpg" %})">
<div class="cover bg-left bg-center-l" style="background-image: url({% static 'img/programming_background.jpg' %})">
<div class="bg-black-80 pb5 pb6-m pb7-l">
<div class="tc-l pt4 pt5-m pt6-l pb3">
<h1 class="f2 f1-l fw2 white-90 mb0 lh-title">Datasketch</h1>
<h2 class="fw1 f3 white-80 mt3 mb4">A full stack shop for web design, application development, and
training</h2>
<a class="f6 no-underline grow dib v-mid bg-blue white br1 ba b--blue ph3 pv2 mb3"
href="{% slugurl 'blog' %}">Read the blog</a>
{% include "header.html" %}
<div id="hero-text" class="tc-l mt4 mt5-m mt6-l ph3">
<h1 class="f2 f1-l fw2 white-90 mb0 lh-title">Hire Datasketch</h1>
<h2 class="fw1 f3 white-80 mt3 mb4">A full stack shop for web design, application development, and training</h2>
<a href="#connect" class="f6 no-underline grow dib v-mid bg-orange white ba bn ph3 pv2 mb3 br1 tracked">Connect</a>
<span class="dib v-mid ph3 white-70 mb3">or</span>
<a class="f6 no-underline grow dib v-mid white ba b--white br1 ph3 pv2 mb3" href="">Connect with us</a>
<a class="f6 no-underline grow dib v-mid white ba b--white ph3 pv2 mb3 br1" href="{% slugurl 'blog' %}" ">Read our blog</a>
</div>
</div>
</div>
</header>
<main class="pv4 ph2 tc">
<h1>Just a man trying to make a buck</h1>
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 grow shadow-4">
<main id="services" class="pv4 ph2 tc">
<h1 class="f2 fw6">Just a man trying to make a buck</h1>
<div class="flex-ns justify-center-ns">
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 shadow-4">
<div class="tc">
<img src="http://tachyons.io/img/avatar_1.jpg" class="br-100 h3 w3 dib" title="Photo of a kitty staring at you">
<img src="{% static 'icon/basic_book_pen.svg' %}" class="h3 w3 dib" title="Photo of a kitty staring at you">
<h1 class="f4">Training</h1>
<hr class="mw3 bb bw1 b--black-10">
</div>
@ -35,19 +33,19 @@
along thier learning journey.
</p>
</article>
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 grow shadow-4">
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 shadow-4">
<div class="tc">
<img src="http://tachyons.io/img/avatar_1.jpg" class="br-100 h3 w3 dib" title="Photo of a kitty staring at you">
<img src="{% static 'icon/basic_webpage_txt.svg' %}" class="h3 w3 dib" title="web-icon">
<h1 class="f4">Websites</h1>
<hr class="mw3 bb bw1 b--black-10">
</div>
<p class="lh-copy measure center f6 black-70">
<p class="h3 lh-copy measure center f6 black-70">
Design & Development, eCommerce, Responsive Design. I can deliver you a stunning website.
</p>
</article>
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 grow shadow-4">
<article class="mw5 dib bg-white br1 pa3 pa4-ns mv3 mr4-l ba b--black-10 shadow-4">
<div class="tc">
<img src="http://tachyons.io/img/avatar_1.jpg" class="br-100 h3 w3 dib" title="Photo of a kitty staring at you">
<img src="{% static 'icon/basic_settings.svg' %}" class="h3 w3 dib" title="App development icon">
<h1 class="f4">App Development</h1>
<hr class="mw3 bb bw1 b--black-10">
</div>
@ -57,5 +55,20 @@
roll around on the floor waiting for you give her more of them.
</p>
</article>
</div>
</main>
<div id="connect" class="bg-grad-blue tc pv5 pv6-ns ph2">
<div class="mw6 center">
<h1 class="white f2 fw5 mb5">Together we can make great things.</h1>
<form class="" action="">
<input class="input-reset w-100 w-45-ns mb3 pv2 ba br1 b--black-10" type="text" name="fullname" placeholder="Full Name">
<input class="input-reset w-100 mb3 pv2 ba br1 b--black-10 mail-icon" type="email" name="email" placeholder="Email">
<br>
<textarea class="input-reset w-100 h4 mb3 pv2 ba br1 b--black-10" name="comments" placeholder="Comments"></textarea>
<br>
<button class="f5 dim fw5 dib v-mid bg-orange white ba bn ph3 pv2 mb3 br1 tracked">Talk to the developer!</button>
</form>
</div>
</div>
{% include "footer.html" %}
{% endblock %}

Write Preview
Loading…
Cancel
Save