look mom, i'm breaking the page!

This commit is contained in:
Timm 2015-04-18 19:16:06 +02:00
parent bff03a2c52
commit 5b5cc046ad
26 changed files with 102 additions and 91 deletions

View File

@ -6,24 +6,24 @@
<meta name="description" content="{{ site.description }}"> <meta name="description" content="{{ site.description }}">
<meta name="viewport" content="width=device-width initial-scale=1" /> <meta name="viewport" content="width=device-width initial-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}"> <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
<script src="{{ "/bootstrap/js/jquery-2.1.1.min.js" | prepend: site.baseurl }}" type="text/javascript"></script> <script src="{{ "/bootstrap/js/jquery-2.1.1.min.js" | prepend: site.baseurl }}" type="text/javascript"></script>
<script src="{{ "/bootstrap/js/bootstrap.js" | prepend: site.baseurl }}" type="text/javascript"></script> <script src="{{ "/bootstrap/js/bootstrap.js" | prepend: site.baseurl }}" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="{{ "/bootstrap/css/bootstrap.css" | prepend: site.baseurl }}"> <link rel="stylesheet" type="text/css" href="{{ "/bootstrap/css/bootstrap.css" | prepend: site.baseurl }}">
<link rel="stylesheet" type="text/css" href="{{ "/css/style.css" | prepend: site.baseurl }}">
<link href="{{ "/css/font-awesome.min.css" | prepend: site.baseurl }}" rel="stylesheet"> <link href="{{ "/css/font-awesome.min.css" | prepend: site.baseurl }}" rel="stylesheet">
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
<link rel="alternate" type="application/rss+xml" href="feed.xml"> <link rel="alternate" type="application/rss+xml" href="feed.xml">
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" sizes="57x57" href="/favicon/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" sizes="60x60" href="/favicon/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" sizes="72x72" href="/favicon/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png"> <link rel="apple-touch-icon" sizes="76x76" href="/favicon/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon" sizes="114x114" href="/favicon/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" sizes="120x120" href="/favicon/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png"> <link rel="apple-touch-icon" sizes="144x144" href="/favicon/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png"> <link rel="apple-touch-icon" sizes="152x152" href="/favicon/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png"> <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon-180x180.png">
<link rel="manifest" href="/android-chrome-manifest.json"> <link rel="manifest" href="/favicon/android-chrome-manifest.json">
<meta name="msapplication-TileColor" content="#000000"> <meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="/mstile-144x144.png"> <meta name="msapplication-TileImage" content="/mstile-144x144.png">
<meta name="theme-color" content="#ffffff"> <meta name="theme-color" content="#ffffff">

View File

@ -8,7 +8,7 @@
<canvas id="demo-canvas" style="position:absolute;width:100%;"></canvas> <canvas id="demo-canvas" style="position:absolute;width:100%;"></canvas>
<div class="row row-centered"> <div class="row row-centered">
<div class="col-centered"> <div class="col-centered">
<img src="{{ "/images/logo.svg" | prepend: site.baseurl }}" alt="Chaospott Logo" style="width:300px;" /> <img src="{{ "/images/logo.svg" | prepend: site.baseurl }}" alt="Chaospott Logo" />
</div> </div>
</div> </div>
</div> </div>

View File

@ -7,52 +7,70 @@
* { * {
background-color:transparent; background-color:transparent;
font-family: 'Share Tech', sans-serif; font-family: $base-font-family;
} }
body, .jumbotron { body, .jumbotron {
background-color:#d2d4bc; background-color:$background-color;
}
.jumbotron h1 {
font-size:26px;
font-weight:bold;
margin-top:50px;
}
.navbar {
/* background-color:#350505; */
background-color:#d2d4bc;
border:none;
}
ul.navbar-nav li a {
color:#800032 !important;
}
.btn-default {
border:0;
background-color:transparent;
color:#800032;
}
a {
color:#800032;
}
a:visited {
color:#800032;
}
.row {
padding:50px 0;
} }
.jumbotron { .jumbotron {
margin:0; margin:0;
padding:0; padding:0;
h1 {
font-size:26px;
font-weight:bold;
margin-top:50px;
}
&>hr {
background-color:#333;
height:1px;
border: 3px #333 solid;
width:300px;
}
} }
.navbar {
background-color:$background-color;
border:none;
.divider-vertical {
height: 20px;
margin: 14px 9px;
border-right: 1px solid $nav-link-color;
border-left: 1px solid $nav-link-color;
}
}
ul.navbar-nav li a {
color:$nav-link-color !important;
}
.btn-default {
border:0;
background-color:transparent;
color: $nav-link-color;
}
a {
color:$nav-link-color;
&:visited {
color:$nav-link-color;
}
}
.row {
padding:50px 0;
&-centered {
text-align: center;
margin: 0;
}
}
#large-header { #large-header {
background-color:#222; background-color:#222;
@ -60,17 +78,14 @@ a:visited {
margin:0; margin:0;
padding:0; padding:0;
margin-bottom:30px; margin-bottom:30px;
img {
position:relative;
top:30px;
width: 300px;
}
} }
#large-header img {
position:relative;
top:30px;
}
.row-centered {
text-align:center;
margin:0;
}
.col-centered { .col-centered {
display:inline-block; display:inline-block;
float:none; float:none;
@ -79,14 +94,7 @@ a:visited {
} }
ul.nav>li>a { ul.nav>li>a {
color:#800032; color:$nav-link-color;
}
.jumbotron>hr {
background-color:#333;
height:1px;
border: 3px #333 solid;
width:300px;
} }
.post-content img { .post-content img {
@ -113,31 +121,29 @@ ul.nav>li>a {
border-color:transparent; border-color:transparent;
} }
.navbar .divider-vertical {
height: 20px;
margin: 14px 9px;
border-right: 1px solid #800032;
border-left: 1px solid #800032;
}
.navbar-inverse .divider-vertical { .navbar-inverse .divider-vertical {
border-right-color: #222222; border-right-color: #222222;
border-left-color: #111111; border-left-color: #111111;
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.navbar-collapse .nav > .divider-vertical { #large-header {
display: none;
}
.navbar-collapse .nav > .divider-vertical {
display: none; display: none;
} }
} }
rect.bordered { rect.bordered {
stroke: #D2D4BC; stroke: $background-color;
stroke-width:1px; stroke-width:1px;
} }
#posts div div p img { #posts div div p img {
max-width: 123px; max-width: 123px;
float:left; float:left;
margin-right: 5px; margin-right: 5px;
} }

View File

@ -6,7 +6,7 @@
// Our variables // Our variables
$base-font-family: Helvetica, Arial, sans-serif; $base-font-family: 'Share Tech', sans-serif;
$base-font-size: 16px; $base-font-size: 16px;
$small-font-size: $base-font-size * 0.875; $small-font-size: $base-font-size * 0.875;
$base-line-height: 1.5; $base-line-height: 1.5;
@ -14,7 +14,7 @@ $base-line-height: 1.5;
$spacing-unit: 30px; $spacing-unit: 30px;
$text-color: #111; $text-color: #111;
$background-color: #fdfdfd; $background-color: #d2d4bc;
$brand-color: #2a7ae2; $brand-color: #2a7ae2;
$grey-color: #828282; $grey-color: #828282;
@ -24,6 +24,8 @@ $grey-color-dark: darken($grey-color, 25%);
$on-palm: 600px; $on-palm: 600px;
$on-laptop: 800px; $on-laptop: 800px;
$nav-link-color: #800032;
// Using media queries with like this: // Using media queries with like this:
@ -45,5 +47,8 @@ $on-laptop: 800px;
@import @import
"base", "base",
"layout", "layout",
"syntax-highlighting" "syntax-highlighting",
"chaospott"
; ;

View File

Before

Width:  |  Height:  |  Size: 6.2 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

View File

Before

Width:  |  Height:  |  Size: 8.8 KiB

After

Width:  |  Height:  |  Size: 8.8 KiB

View File

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

View File

@ -2,37 +2,37 @@
"name": "Chsospott", "name": "Chsospott",
"icons": [ "icons": [
{ {
"src": "\/android-chrome-36x36.png", "src": "\/favicon\/android-chrome-36x36.png",
"sizes": "36x36", "sizes": "36x36",
"type": "image\/png", "type": "image\/png",
"density": "0.75" "density": "0.75"
}, },
{ {
"src": "\/android-chrome-48x48.png", "src": "\/favicon\/android-chrome-48x48.png",
"sizes": "48x48", "sizes": "48x48",
"type": "image\/png", "type": "image\/png",
"density": "1.0" "density": "1.0"
}, },
{ {
"src": "\/android-chrome-72x72.png", "src": "\/favicon\/android-chrome-72x72.png",
"sizes": "72x72", "sizes": "72x72",
"type": "image\/png", "type": "image\/png",
"density": "1.5" "density": "1.5"
}, },
{ {
"src": "\/android-chrome-96x96.png", "src": "\/favicon\/android-chrome-96x96.png",
"sizes": "96x96", "sizes": "96x96",
"type": "image\/png", "type": "image\/png",
"density": "2.0" "density": "2.0"
}, },
{ {
"src": "\/android-chrome-144x144.png", "src": "\/favicon\/android-chrome-144x144.png",
"sizes": "144x144", "sizes": "144x144",
"type": "image\/png", "type": "image\/png",
"density": "3.0" "density": "3.0"
}, },
{ {
"src": "\/android-chrome-192x192.png", "src": "\/favicon\/android-chrome-192x192.png",
"sizes": "192x192", "sizes": "192x192",
"type": "image\/png", "type": "image\/png",
"density": "4.0" "density": "4.0"

View File

Before

Width:  |  Height:  |  Size: 4.7 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

View File

Before

Width:  |  Height:  |  Size: 5.0 KiB

After

Width:  |  Height:  |  Size: 5.0 KiB

View File

Before

Width:  |  Height:  |  Size: 6.2 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

View File

Before

Width:  |  Height:  |  Size: 6.6 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

View File

Before

Width:  |  Height:  |  Size: 8.1 KiB

After

Width:  |  Height:  |  Size: 8.1 KiB

View File

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

Before

Width:  |  Height:  |  Size: 3.0 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 8.5 KiB

View File

Before

Width:  |  Height:  |  Size: 4.7 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

View File

Before

Width:  |  Height:  |  Size: 6.0 KiB

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

Before

Width:  |  Height:  |  Size: 6.4 KiB

After

Width:  |  Height:  |  Size: 6.4 KiB

View File

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 4.0 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB