make it flat!

This commit is contained in:
Jörg Thalheim 2013-09-19 09:01:52 +02:00
parent e2a8a50914
commit b257c8cdda
14 changed files with 182 additions and 98 deletions

View File

@ -8,6 +8,6 @@ gem 'rb-fsevent', require: false
gem "compass-holmes" gem "compass-holmes"
gem 'oily_png' gem 'oily_png'
gem "sass" gem "sass"
gem "slim", "~> 1.3.7" gem "slim"
gem "rake" gem "rake"
gem "susy" gem "susy"

View File

@ -1,14 +1,14 @@
GEM GEM
remote: http://rubygems.org/ remote: http://rubygems.org/
specs: specs:
activesupport (3.2.12) activesupport (3.2.14)
i18n (~> 0.6) i18n (~> 0.6, >= 0.6.4)
multi_json (~> 1.0) multi_json (~> 1.0)
chunky_png (1.2.8) chunky_png (1.2.8)
coffee-script (2.2.0) coffee-script (2.2.0)
coffee-script-source coffee-script-source
execjs execjs
coffee-script-source (1.6.2) coffee-script-source (1.6.3)
compass (0.12.2) compass (0.12.2)
chunky_png (~> 1.2) chunky_png (~> 1.2)
fssm (>= 0.2.7) fssm (>= 0.2.7)
@ -27,24 +27,24 @@ GEM
tilt tilt
hike (1.2.3) hike (1.2.3)
http_parser.rb (0.5.3) http_parser.rb (0.5.3)
i18n (0.6.4) i18n (0.6.5)
kramdown (1.0.2) kramdown (1.1.0)
listen (1.2.2) listen (1.2.3)
rb-fsevent (>= 0.9.3) rb-fsevent (>= 0.9.3)
rb-inotify (>= 0.9) rb-inotify (>= 0.9)
rb-kqueue (>= 0.2) rb-kqueue (>= 0.2)
middleman (3.1.2) middleman (3.1.5)
coffee-script (~> 2.2.0) coffee-script (~> 2.2.0)
compass (>= 0.12.2) compass (>= 0.12.2)
execjs (~> 1.4.0) execjs (~> 1.4.0)
haml (>= 3.1.6) haml (>= 3.1.6)
kramdown (~> 1.0.0) kramdown (~> 1.1.0)
middleman-core (= 3.1.2) middleman-core (= 3.1.5)
middleman-more (= 3.1.2) middleman-more (= 3.1.5)
middleman-sprockets (>= 3.1.2) middleman-sprockets (>= 3.1.2)
sass (>= 3.1.20) sass (>= 3.1.20)
uglifier (~> 2.1.0) uglifier (~> 2.1.0)
middleman-core (3.1.2) middleman-core (3.1.5)
activesupport (~> 3.2.6) activesupport (~> 3.2.6)
bundler (~> 1.1) bundler (~> 1.1)
i18n (~> 0.6.1) i18n (~> 0.6.1)
@ -58,14 +58,14 @@ GEM
middleman-core (>= 3.0.2) middleman-core (>= 3.0.2)
multi_json (~> 1.0) multi_json (~> 1.0)
rack-livereload rack-livereload
middleman-more (3.1.2) middleman-more (3.1.5)
middleman-sprockets (3.1.2) middleman-sprockets (3.1.4)
middleman-core (>= 3.0.14) middleman-core (>= 3.0.14)
middleman-more (>= 3.0.14) middleman-more (>= 3.0.14)
sprockets (~> 2.1) sprockets (~> 2.1)
sprockets-helpers (~> 1.0.0) sprockets-helpers (~> 1.0.0)
sprockets-sass (~> 1.0.0) sprockets-sass (~> 1.0.0)
multi_json (1.7.7) multi_json (1.8.0)
oily_png (1.1.0) oily_png (1.1.0)
chunky_png (~> 1.2.7) chunky_png (~> 1.2.7)
rack (1.5.2) rack (1.5.2)
@ -75,14 +75,14 @@ GEM
rack (>= 1.0) rack (>= 1.0)
rake (10.1.0) rake (10.1.0)
rb-fsevent (0.9.3) rb-fsevent (0.9.3)
rb-inotify (0.9.0) rb-inotify (0.9.2)
ffi (>= 0.5.0) ffi (>= 0.5.0)
rb-kqueue (0.2.0) rb-kqueue (0.2.0)
ffi (>= 0.5.0) ffi (>= 0.5.0)
sass (3.2.9) sass (3.2.10)
slim (1.3.9) slim (2.0.1)
temple (~> 0.6.3) temple (~> 0.6.6)
tilt (~> 1.3, >= 1.3.3) tilt (>= 1.3.3, < 2.1)
sprockets (2.10.0) sprockets (2.10.0)
hike (~> 1.2) hike (~> 1.2)
multi_json (~> 1.0) multi_json (~> 1.0)
@ -96,10 +96,10 @@ GEM
susy (1.0.9) susy (1.0.9)
compass (>= 0.12.2) compass (>= 0.12.2)
sass (>= 3.2.0) sass (>= 3.2.0)
temple (0.6.5) temple (0.6.6)
thor (0.18.1) thor (0.18.1)
tilt (1.3.7) tilt (1.3.7)
uglifier (2.1.1) uglifier (2.1.2)
execjs (>= 0.3.0) execjs (>= 0.3.0)
multi_json (~> 1.0, >= 1.0.2) multi_json (~> 1.0, >= 1.0.2)
@ -116,5 +116,5 @@ DEPENDENCIES
rb-fsevent rb-fsevent
rb-inotify rb-inotify
sass sass
slim (~> 1.3.7) slim
susy susy

View File

@ -63,6 +63,9 @@ set :slim, :pretty => true
# Methods defined in the helpers block are available in templates # Methods defined in the helpers block are available in templates
helpers do helpers do
def active_nav(url)
" pure-menu-selected" if url == current_page.url
end
end end
# Change the CSS directory # Change the CSS directory

View File

@ -1,3 +1,4 @@
a name="about" a name="about"
p p
' &copy; Copyright 2013 | ' &copy; Copyright 2013 |
@ -5,7 +6,5 @@ p
' , ' ,
== link_to "Jörg Thalheim", "/joerg", title: "About Jörg" == link_to "Jörg Thalheim", "/joerg", title: "About Jörg"
p p
' using ' more infos
a href="http://ethanschoonover.com/solarized" title="color palette used on our website" target="_blank" solarized
', more infos
== link_to "here", "/humans.txt", :title => "About this website" == link_to "here", "/humans.txt", :title => "About this website"

View File

@ -1,10 +1,11 @@
nav nav.pure-menu.pure-menu-open.pure-menu-horizontal
#sitelink a#sitelink.pure-menu-heading href="/" title="Homepage"
a href="/" title="Homepage"
' H ' H
span B span B
ul ul
li li class=active_nav("/")
==link_to "Impressum", "/impressum.html", :class => "navlink", :title => "Impressum" ==link_to "Home", "/", title: "Home"
li li class=active_nav("/impressum.html")
==link_to "About", "#about", :class => "navlink", :title => "About" ==link_to "Impressum", "/impressum.html", title: "Impressum"
li class=active_nav("#about")
==link_to "About", "#about", title: "About"

View File

@ -17,7 +17,7 @@
/* SITE */ /* SITE */
Last update: 2012/08/10 Last update: 2012/08/10
Standards: HTML5, CSS3 Standards: HTML5, CSS3
Colors: solarized (http://ethanschoonover.com/solarized) Css Framework: pure (http://purecss.io)
Fonts: Lobster, Cabin Fonts: Lobster, Cabin
Software: middleman, sass, slim Software: middleman, sass, slim
IDE: vim IDE: vim

View File

@ -9,7 +9,7 @@
| 01097 Dresden | 01097 Dresden
br/ br/
h2 Kontakt: h2 Kontakt:
table summary="How to contact us" table.pure-table summary="How to contact us"
tr tr
td td
p Telefon: p Telefon:

View File

@ -1,3 +1,4 @@
.hero
h1#pagetitle Higgs-Boson h1#pagetitle Higgs-Boson
h2#pagesubtitle h2#pagesubtitle
' by Albert ' by Albert

View File

@ -2,7 +2,8 @@ h1 Our Jabber-Server
h2 Connection information h2 Connection information
p Open for registration! p Open for registration!
table summary="Connection information"
table.pure-table.pure-table-bordered summary="Connection information"
tr tr
td Server Address: td Server Address:
td higgsboson.tk td higgsboson.tk

View File

@ -1,8 +1,9 @@
--- ---
head_profile: http://gmpg.org/xfn/11 head_profile: http://gmpg.org/xfn/11
--- ---
h1 Jörg Thalheim / Mic92 h1.hero Jörg Thalheim / Mic92
div.span3 .pure-g-r
.pure-u-1-3
h2 Contact h2 Contact
dl.icons dl.icons
dt Email: dt Email:
@ -17,8 +18,7 @@ div.span3
dt IRC: dt IRC:
dd.icon-comment-alt dd.icon-comment-alt
a rel="me" href="irc://irc.freenode.net/" Mic92 a rel="me" href="irc://irc.freenode.net/" Mic92
.pure-u-1-3
div.span3
h2 Content h2 Content
dl.icons dl.icons
dt Microblogging: dt Microblogging:
@ -32,8 +32,7 @@ div.span3
dt Social: dt Social:
dd.icon-google-plus dd.icon-google-plus
a rel="me" href="https://plus.google.com/107837103594826869647" jthalheim@gmail.com a rel="me" href="https://plus.google.com/107837103594826869647" jthalheim@gmail.com
.pure-u-1-3
div.span3_omega
h2 Rest h2 Rest
dl.icons dl.icons
dt Github Achievements: dt Github Achievements:

View File

@ -32,9 +32,9 @@ html.no-js.light lang="en"
meta property="twitter:description" content="Website of Jörg Thalheim & Albert Schulz" meta property="twitter:description" content="Website of Jörg Thalheim & Albert Schulz"
meta name="twitter:image" content="http://higgsboson.tk/images/logo.png" meta name="twitter:image" content="http://higgsboson.tk/images/logo.png"
== stylesheet_link_tag "site.css" == stylesheet_link_tag "pure-min.css"
link href='//fonts.googleapis.com/css?family=Vollkorn' rel='stylesheet' type='text/css' == stylesheet_link_tag "site2.css"
link href='//fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css' link href='http://fonts.googleapis.com/css?family=Maven+Pro' rel='stylesheet' type='text/css'
/![if IE 7] /![if IE 7]
link type="text/css" rel="stylesheet" media="screen" href="/stylesheets/fontawesome-ie7.css" link type="text/css" rel="stylesheet" media="screen" href="/stylesheets/fontawesome-ie7.css"
== yield_content :head == yield_content :head
@ -43,14 +43,11 @@ html.no-js.light lang="en"
// for optimal performance, create your own custom Modernizr build: www.modernizr.com/download/ // for optimal performance, create your own custom Modernizr build: www.modernizr.com/download/
== javascript_include_tag "modernizr.custom.54013.js" == javascript_include_tag "modernizr.custom.54013.js"
body body
.container .pure-g-r.content
header header.pure-u
== partial "navbar" == partial "navbar"
#main #main.pure-u-1
== yield == yield
footer footer.pure-u-1
== partial "footer" == partial "footer"
== partial "piwik" == partial "piwik"
/![if lt IE 7 ]
<script defer src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
<script defer>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>

View File

@ -2,7 +2,7 @@
== javascript_include_tag "html5-qrcode.js" == javascript_include_tag "html5-qrcode.js"
h1 h1
| QRCode Generator Example | QRCode Generator Example
form#QRform name="QRform" form#QRform.pure-form name="QRform"
textarea cols="50" name="textField" onclick="this.focus();this.select();" onkeyup="updateQRCode(this.value)" rows="8" I love QR Codes. Type in here and watch the QR code below update. textarea cols="50" name="textField" onclick="this.focus();this.select();" onkeyup="updateQRCode(this.value)" rows="8" I love QR Codes. Type in here and watch the QR code below update.
// This is where our QRCode will appear in. // This is where our QRCode will appear in.
#qrcode #qrcode

11
source/stylesheets/pure-min.css vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,72 @@
$fontAwesomePath: "../fonts";
@import "fontawesome";
#sitelink {
font-size: 1em;
letter-spacing: -0.11em;
&:hover {
text-decoration: none;
}
line-height: 1em;
span {
vertical-align: -0.2em;
line-height: 1em;
}
}
body,
.pure-g [class *= "pure-u"],
.pure-g-r [class *= "pure-u"] {
/* Set you're content font stack here: */
font-family: "Maven Pro", sans-serif;
}
.icons {
dd {
display:block;clear:both;
}
}
.content {
margin: 0px auto 50px;
padding: 0px 2em;
max-width: 800px;
}
.overview {
margin: 0px auto 50px;
max-width: 250px;
}
.hero {
min-height: 80px;
margin: 0px;
color: rgb(51, 51, 51);
padding: 1em 2em;
text-align: center;
border-bottom: 1px solid rgb(238, 238, 238);
background: none repeat scroll 0% 0% rgb(255, 255, 255);
}
.hero h1 {
margin: 0.2em 0px;
font-size: 3em;
font-weight: 300;
}
.hero h2 {
font-weight: 300;
margin: 0px;
color: rgb(204, 204, 204);
}
a {color: rgb(59, 139, 186);text-decoration: none;}
footer {
font-size: 87.5%;
border-top: 1px solid rgb(238, 238, 238);
padding: 0.5em 1.1429em;
background: none repeat scroll 0% 0% rgb(250, 250, 250);
line-height: 1.6em;
}