Skip to content

Instantly share code, notes, and snippets.

@Saminou24

Saminou24/Analog-Weather-App.markdown

Created October 1, 2013 20:43
Show Gist options
  • Save Saminou24/6784789 to your computer and use it in GitHub Desktop.
Save Saminou24/6784789 to your computer and use it in GitHub Desktop.
Download ZIP
A Pen by Johan Fagerbeg.
Raw
Analog-Weather-App.markdown
Raw
index.html
<section class="wrapper">
<section class="clock">
<figure class="flipper">
<span class="icon">1</span>
</figure>
<figure class="flipper">
<span>17</span>
</figure>
</section>
<section class="toggles">
<figure class="toggle on">
<span class="icon">2</span>
</figure>
<figure class="toggle">
<span class="icon">3</span>
</figure>
<figure class="toggle">
<span class="icon">4</span>
</figure>
<figure class="toggle">
<span class="icon">5</span>
</figure>
</section>
<section class="graph">
<h1>Amsterdam</h1>
<div class="days">
<span data-icon="6" data-degrees="19°">T</span>
<span data-icon="6" data-degrees="16°">W</span>
<span data-icon="1" data-degrees="20°">TH</span>
<span data-icon="2" data-degrees="25°">F</span>
<span data-icon="7" data-degrees="21°">S</span>
<span data-icon="6" data-degrees="18°">SU</span>
</div>
</section>
<nav>
<button>
<span class="icon">-</span>
</button>
</nav>
</section>
Raw
script.js
// Source:
// http://dribbble.com/shots/1235592-Analog-Weather-App/
Raw
style.css
::selection {background: rgba(0,0,0,.1);}
::-moz-selection {background: rgba(0,0,0,.1);}
* {
margin:0;
padding:0;
font-family:"Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
html {
width:100%;
height:100%;
background:url(http://cdn0.dribbble.com/assets/attachments/attachments-bg.png?1);
}
.wrapper {
width:640px;
height:1136px;
background:#2d3034;
background:linear-gradient(
#2d3034 0%,
#212527 100%);
position:absolute;
left:50%;
margin:15px -320px;
padding-top:50px;
box-shadow:0 0 25px #000;
}
.clock {
width:550px;
height:295px;
background:#191b1d;
background:linear-gradient(
#191b1d 0%,
#212527 100%);
position:relative;
margin:0 auto;
border-radius:15px;
box-shadow:0 1px 2px rgba(255,255,255,.1);
}
.flipper {
width:250px;
height:250px;
background:#212527;
background:linear-gradient(
#1b1d1f 0%,
#242629 50%,
#212527 100%);
position:absolute;
left:15px;
top:15px;
font-size:192px;
color:white;
text-align:center;
line-height:240px;
border-radius:5px;
box-shadow:inset 0 1px rgba(255,255,255,.1), /* Top shine */
0 6px 5px -5px rgba(0,0,0,.5), /* Shadow 1 */
0 7px 0 -2px rgba(30,30,30,1), /* Flip 1 */
0 11px 5px -5px rgba(0,0,0,.5), /* Shadow 2 */
0 13px 0 -4px rgba(30,30,30,.7), /* Flip 2 */
0 16px 5px -5px rgba(0,0,0,.5), /* Shadow 3 */
0 20px 0 -8px rgba(30,30,30,.5), /* Flip 3 */
0 15px 0 5px #000, /* Black border */
0 0 0 5px #000; /* Black border */
}
.flipper:nth-child(2) {
right:15px;
left:auto;
font-size:128px;
}
.flipper:before, .flipper:after {
content:"";
width:5px;
height:40px;
background:rgb(30,30,30);
position:absolute;
top:50%;
left:0;
margin-top:-20px;
box-shadow:inset 0 -1px rgba(60,60,60,.4), /* Ridge 1 */
inset 0 -3px rgb(25,25,25), /* Gradient 1 */
inset 0 -4px rgba(60,60,60,.5), /* Ridge 2 */
inset 0 -6px rgb(30,30,30),
inset 0 -7px rgba(60,60,60,.6), /* Ridge 3 */
inset 0 -9px rgb(35,35,35),
inset 0 -10px rgba(60,60,60,.7), /* Ridge 4 */
inset 0 -12px rgb(40,40,40),
inset 0 -13px rgba(60,60,60,.8), /* Ridge 5 */
inset 0 -15px rgb(45,45,45),
inset 0 -16px rgba(60,60,60,.9), /* Ridge 6 */
inset 0 -18px rgb(50,50,50),
inset 0 -19px rgba(60,60,60,1), /* Ridge 7 */
inset 0 -21px rgb(50,50,50),
inset 0 -22px rgba(60,60,60,1), /* Ridge 8 */
inset 0 -24px rgb(50,50,50),
inset 0 -25px rgba(60,60,60,.9), /* Ridge 9 */
inset 0 -27px rgb(45,45,45),
inset 0 -28px rgba(60,60,60,.8), /* Ridge 10 */
inset 0 -30px rgb(40,40,40),
inset 0 -31px rgba(60,60,60,.7), /* Ridge 11 */
inset 0 -33px rgb(35,35,35),
inset 0 -34px rgba(60,60,60,.6), /* Ridge 12 */
inset 0 -36px rgb(30,30,30),
inset 0 -37px rgba(60,60,60,.5), /* Ridge 13 */
inset 0 -39px rgb(25,25,25),
0 0 0 2px #000;
z-index:1;
}
.flipper:after { right:0;left:auto; }
.flipper span:before {
content:"";
width:236px;
height:5px;
position:absolute;
left:7px;
top:50%;
margin-top:-3px;
background:#000;
box-shadow:0 0 0 1px #3b3e41;
}
.toggles {
width:484px;
height:180px;
margin:64px auto 32px;
}
.toggle {
width:80px;
height:80px;
background:#212325;
display:inline-block;
position:relative;
margin:13px 25px;
font-size:64px;
color:#787b7e;
text-align:center;
border-radius:50%;
box-shadow:0 -5px 5px rgba(255,255,255,.15), /* Highlight */
0 0 0 5px #1c1e1f, /* Inner shadow */
0 0 0 8px #000, /* Hole */
0 20px 20px 5px rgba(0,0,0,.5), /* Shadow */
0 5px 5px 8px rgba(40,45,47,1), /* Border highlight */
0 0 0 13px #1a1c1e, /* Border */
0 1px 1px 12px rgba(255,255,255,.5); /* Sharp highlight */
}
.toggle:first-child { margin-left:0; }
.toggle:last-child { margin-right:0; }
.toggle.on {
box-shadow:0 -5px 20px rgba(255,255,255,.1), /* Highlight */
0 0 0 5px #1c1e1f, /* Inner shadow */
0 0 0 8px #000, /* Hole */
0 5px 5px 8px rgba(40,45,47,1), /* Border highlight */
0 0 0 13px #1a1c1e, /* Border */
0 1px 1px 12px rgba(255,255,255,.5); /* Sharp highlight */
}
.toggle:after {
content:"";
height:10px;
width:10px;
background:#878787;
position:absolute;
left:50%;
top:50%;
margin:-5px;
border-radius:50%;
box-shadow:0 0 0 1px #27292b, /* Border */
0 1px 1px rgba(255,255,255,.5), /* Highlight */
0 23px 45px #fff, /* Button highlight */
14px 18px 45px #fff, /* Button highlight */
-14px 18px 45px #fff, /* Button highlight */
0 23px 30px rgba(255,255,255,.5); /* Button highlight */
}
.toggle.on:after {
background:#fce3af;
box-shadow:0 1px 1px rgba(255,255,255,.5), /* Highlight */
0 0 1px 1px #bb6119, /* Border */
0 0 15px #ffc000, /* Glow */
0 23px 45px #ffe6d2, /* Button highlight */
14px 18px 45px #ffe6d2, /* Button highlight */
-14px 18px 45px #ffe6d2; /* Button highlight */
}
.toggle span {
display:block;
margin-top:-92px;
}
.graph {
width:540px;
height:390px;
background:#181818;
position:relative;
margin:0 auto;
color:#e19646;
text-shadow:0 0 10px rgba(225,150,70,.5);
font-size:32px;
border-radius:7px;
box-shadow:
inset 0 1px 2px 1px rgba(255,255,255,.1), /* Shine */
inset 0 -4px 2px -3px rgba(255,255,255,.1), /* Bot. shine */
0 -1px 6px 4px #1b1d1f, /* Blurred border */
2px 2px 0 5px #1b1d1f, /* Border right */
-2px 2px 0 5px #1b1d1f, /* Border left */
0 0 0 7px #141516, /* Border shadow */
0 1px 0 7px rgba(255,255,255,.1);
overflow:hidden;
}
.graph:after {
content:"";
width:400px;
height:600px;
position:absolute;
left:-150px;
top:-125px;
background:rgba(255,255,255,.2);
background:linear-gradient(-25deg,
rgba(255,255,255,0) 25%,
rgba(255,255,255,.1) 100%);
-webkit-transform:rotate(25deg);
-ms-transform:rotate(25deg);
transform:rotate(25deg);
}
.graph h1 {
text-align:center;
padding:20px 0;
border-bottom:2px solid #27292d;
font-weight:100;
}
.days {
text-align:center;
margin-top:20px;
}
.days span {
display:inline-block;
text-align:center;
font-size:16px;
font-weight:900;
margin-left:50px;
position:relative;
}
.days span:first-child {
margin:0;
}
.days span:before {
content:attr(data-icon);
font-family: 'Artill_Weather';
font-size:64px;
font-weight:100;
speak: none;
-webkit-font-smoothing: antialiased;
position:absolute;
left:-16px;
top:32px;
}
.days span:after {
content:attr(data-degrees);
font-size:32px;
font-weight:100;
position:absolute;
left:-16px;
top:128px;
}
.days span[data-icon="1"]:before, .days span[data-icon="2"]:before {
top:40px;
}
.days span[data-icon="7"]:before {
top:36px;
}
.days span:last-child:before {
left:-10px;
}
nav {
height:80px;
width:100%;
position:absolute;
bottom:0;
box-shadow:0 -1px rgba(255,255,255,.1),
0 -5px #181818;
}
nav button {
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
width:118px;
height:59px;
background:#212121;
position:absolute;
left:50%;
bottom:0;
margin:0 -60px;
color:#81888b;
font-size:48px;
line-height:64px;
cursor:pointer;
border:1px solid #000;
border-bottom:none;
border-radius:50% 50% 0 0 / 100% 100% 0 0;
box-shadow:inset 0 25px 25px rgba(0,0,0,.1);
}
/* Weather font by Artill,
menu icon from Entypo by Daniel Bruce */
@font-face {
font-family: 'Artill_Weather';
src: url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAA4IAAsAAAAAIEgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAABCAAACqQAABsKR9D8b0ZGVE0AAAusAAAAGgAAABxmQKyOR0RFRgAAC8gAAAAdAAAAIAA3AARPUy8yAAAL6AAAAEwAAABgUbvdHmNtYXAAAAw0AAAAUwAAAVrqTRgxaGVhZAAADIgAAAAwAAAANv5WfxloaGVhAAAMuAAAAB4AAAAkBRz/62htdHgAAAzYAAAAKAAAACgQAgEebWF4cAAADQAAAAAGAAAABgAKUABuYW1lAAANCAAAAPMAAAHaB9kmW3Bvc3QAAA38AAAADAAAACAAAwAAeJzFWV1sVMcVnsX7c1nMgsleQ9BmDSkkDmoUxNK32FKlKtAH1Bj681C3KJVYiIhSGyUisiNFlbChuVXWbVoJk0iVarcNSkrVSFVMIlXCjtKqWUilUpZSWmEIDcJuIlrWXgfHp+c7Z+69u2vTug80fhjPnTt35vx93zkzGzHRqIlEIis+f+Cpx594YvfX9jz21L49B0xkiYmYhyuZJZV7Giprol5jg9cYzSaN+63dnuf/b0w8v38mXbkZy5jvrsgYszJjXm7KmLWZuw+uMg1YwTHNZsPTTz7+yObNm2t3qNvPmMhhs8rcZdLG5W9WmzUmZZJYImqWR48vjSS3NG5cvmHlldVvrBmb3p2q3Ix+kp5JJ1Ll6fcp8ttku0vG6Zgkmhk8RiaezxNNJ9u5OZHWMW34MUv0l75sQt/rTPkGXxunPKpj2vAjT396tEB0oa2Lt0gkHyb6uK2LeydcIupsDabvC3semaWDR+26sdEBh6icHSGzrC8bw+igjBJN5fMeluvWNbU3M3jUw6t9mFSQNw5FlncNExtpiYvRF2p2EXFkvbA3hdf+ovw9XcXo3/P5mB2t2cX/NAGLWe3Snj5b+Z8f305zN7ax0mbz0DkRhcz9bFxuXA+DJW4bi6eJZotnuNdaJrrVlyWT5C+NiL9yqGTXTPeM82x3dIDbXClJdA6WewAeKrZOeSIutx9Anps9l4k+TPcQTRaLRDcm+kQ8oo86HyDTgK8/HNnpsYynu4b5oz/BaBcxtZw9+XWi8x0T8DX77UppGd6c8WQ//uA9uO/+ZBsmTYoOLO9bfeumv8C+/Rhyp3suWd81TfRj834yKZYFrrSqrcAiotXKofOsz2dyW7jNtE5hw0ZPZPGgxiU1jSokTmD/975EdL3tAFzJyn/AZme52kceJXoy3ctSXBo6D2sUyKxt63q1hVfOpnvJNOf3klkDobOQpiGXc2zwmqFSjExk4hB8FOHethPSeBjsc+wA78azoiyJuQ+mXwfX3AMn3YeYZKO0ezpKlwud1sx/Hjxmv6fyaCGGvc4RzaWftYNzIzuxST+rYDLFYvxVMndDK4jPipT2SwTK8/4WMi/mtpJ5pWPCBSybiSosPjdvW9CiUbz58ORvNvRcjluohrBzOq5rozMTFvctRO+ylxC6boCNQh02qqAneMhbPMyIrvAy+2s8FqCkW0Dn6bOsp724mE2c6O/kpHaR+SUHqaUncYfImuCQ05BhTWAtUQijgf4tPkvJnxikUh4LWQxhEoxasoKF6AhIkM0sKh8QtrCCqbQhuYncSwcHvZACnMBjA7GQfixR1FirKwxhS2FKFOZvCM+HOjf5RBUb/YFs71muDTkqpKDbENWMb01QtbcQ0VkK9J0BonoF+n9utMD6F8FGoANhFiEak0PQbYK4m7BGLpezDcZ48gA+K4KGpi2VgJqwFEffy63lKNFfGSZ0hb9hfCft40XeimP+tI6Ze4EZaTLygsmAeSGnY/KtEgR/yy57FDD71US/AMG1LrXhcX2hkBEgjFcDQcEjMJJGTGfHOJYiTLXNVcmwfnWJh5rVFWbXLZrqVpcgDVefu1Jiw79xIu1Ww0J9bmOoO+xZmPnJjmGmrKA+l1XF5xWGhj7XLlIfzYg5EE9DaZkf8/H83nBWDUytZEfDmO92hFrt/gH4Qyl9mrCSdddLxvI/xyDnZNcSgFwd2BYCsxbkCuJkG/v+YutUAHK19JhWCAuBfK9wfEvq1pfIfI/jJ/KYJGTmdZQim0Ia9kDLPY5kA0k4MdsVS62FEleR1Nbb+Y7mMtQzMV0vZHSsxIL+K7c1gUXOS4quwwYEldEgj1ehTR4VbaVki+QOyWvsrXFOU1Il0DXofRVchVceoPFTH1EWOMh9UE0oijNg3roTaYsujG+zZYEAUMbEahzKTuo4KImJmHN1mG3GarONW+UchUFkVykZt9GBPxQs3GRPejLo2VfXoZrL5rRVC1vKz/eimtahaGwdGlRedYQovZrsMoDUvhXNFmTrS5JeJW8joCTARecKSE/iVRp59McYn6+13iT6XcdkXaYdq820NvosBfCc+OK3gKYe2nU2HGeZRFGW/KfEa/k9SLxxnxakktH6fBmvyKXYNtSWRc9i1XfEiMayBrS6AfuwGxgj3yHzfY7hyG7xeZXQunYbxvZibMJSn+gqdV0TSiRuPE+LVhSYAiP25ing4g8SvTcQvSgOtaS7oRXiIX0UybVW5LrQBi2ihtdcAxEk0X3U2cr7fQXdkfKYCxycIvoHoleaa5gp2MCjWVX4BpnVIJYM19eMLD5JbOSg82zxfAG25TI3mzpMEQbf9LALad6XjGxz4XqIeUY4whbM0KC6YPaNr0mOU5sWzB70LmHDgk7SRefSvY4tOP1aU2KAY2j1iXRCQ9bWhsIp6WfZjOM665DUvGKdAN5S4K6GR6TAlapUC1zxkF/g9i+iwOWcMK/A5Xrfw+BeKXDP2QIXpfC8AneB2jYblLaCfb+05cJcVBJtNJ+Nq7JsHDCoz6VKqL2MmGsdkwl9NW+Hh3CkEA03ItBVYiYwR84o9rQi55b3ED+0o+snRNsF358gaoTMYtmTfnRDJrxQgpOepCixFEDKwdriWE7dlcv5OcDB0ekWPClHa+EJQTeAZJaglhECAT51Z37hwO8syTNS2cOCOl3IQCSTKlmkEMTPwd/z5Mk6UuSQOZxsj+lmKo+QgePTj8ojy9bJg2WtPBthil90DYt9hpQElZIqmpPbffuopYZsspbw0Z3Lo759dhY66+TZvoA86UCe5kCeHisPPQNAH2H7rONUxXby3PVcSP4aUv6+rdu9N5mawq3GO6ji/YPN0eBg01zL4m/X3WpANzk2SYGitxrBeQkv8MhBdlAjdZ8bHgfq7y0seceV9QPynle0+YX6AnkN3CLLJfGIA2N1sY5AAUe6mt30wkDCQy4REpKY0PgVXHjn4R84cDxb5M1KlYThzQr9hiN07p+Fb0ohdeROMNUhWz7cWaZagEc+Paby74IEVXIXJDCpvwuCQWvugrjYkUOY1Is4iXlSqdbeBUEyvQuC/XiR3gXvgarS2oiktTH/HkjT2pn6tDYQpLXWMK31z09rb0KL14qn5ZLoEWhwGW4Y8C+JMLPmkuglCzG9INJS1l4QJaXUHf7fLojMi6gH2WQ1BR04IqSHWg6Yf6YLqMAnLyYSe28qZ7of8eGdthQ6F8opk9VMGWYXWez/mlOijH2VTBb79HNKvX2Gg+wyZO/n7lBOMT+Xu9rsiBuQ9p560r7NVZeegauvukLSHt/u6XPNvZF/Bg8u2x2aewf3OC+ke2+f06Z3V344fZaN2vT6ZxkgO84yVI7PMmq/GrXNDX5hx3acbZlNx/1xHjIp7pkm9JqCR3+s5d3ooqdWeNnFinDry9Gaua8/iPE/2kbn6th8cXkGf/qgbVQGGWMZUl668kX34I+nyz+LZ5MN+fxzjUuPNSYzZu1d+rtJrylHvg1QnrLUJgeWWXCGUIScZOSxokGVtOcliTs5fEmtN4vrJ407QEAOk/jlIuzpZIk6v0xzlvn9+p1P+zuDVnVnMHb9ztr77zvjWkx3tvNk56pla3cGyc0il1T84kymVO23KJ19MR25AQh0/jeUZlvaeJxjYGBgZACCk535hiD6XPS8dTAaAEUxBt4AAHicY2BkYGDgA2IJBhBgYmAEQk4gZgHzGAAErQA8AAAAeJxjYGbcwDiBgZWBg3EB4wEGBoZICM1ozCDPsJSBgYmBlZkBBhgFGBAgIM01hcGBQfcDA1PC/wcMVkwJDAoNQDVwBQpAyAgAab0L/nicY2BgYGaAYBkGRgYQCAHyGMF8FgYLIM3FwMHABIQMDLoM5h8Y/v8Hq9JlMISw/9/5f1GAEaoXChjZGFAFCAFOIGZiZmFlY+cgRdtgBgDn9Qt5AHicY2BkYGAAYt/PszLi+W2+MnAzNQBFGM5Fz1uHoP8/YGpgSgByORiYQKIAWd8MKHicY2BkYGBK+P+AwYqpgYHhbwOQBIqgAC4AgDwFCQAAAoAAAAAAAAACHwAfAX0AAAD6ACAB0wAgAMgAHwGxACACIAAgAoAAYAAAUAAACgAAeJyVjzFqwzAUhj8lTkpJydguoXgu2NguHhLokKE5QCjJGDwIx2BsUJyrdOl9epLeoBfor1RLl0IkxPv09D3pCbjjHYMfhjmPgUfc8BJ4zBMfgSM5X4EnzMws8JS5KWWa6FaZxaXK80h+EnjMG6+BIzmfgSfc8x14ysI8sMYx0NBqHthjqbQ/KjpYu6Fp28PeVsPRar9VuuYstfLHW1uf20qwoadTmY9OhiWmICVTXGn998ivkVOq+aVWoaqcZ13ad8Omd7WNizSLV/HfZpTIy2SZFFku96pf7C7pk3TftX/bd8rOulPTd3GeZtdd+AMzgU4qAHicY2BmwAsAAH0ABA==) format('woff'),
url(data:application/x-font-ttf;charset=utf-8;base64,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) format('truetype');
font-weight: normal;
font-style: normal;
}
.icon {
font-family: 'Artill_Weather';
speak: none;
-webkit-font-smoothing: antialiased;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment