websites/dennogumi.org-archive
Archived
1
0
Fork 0
Code Releases Activity

update css

Browse source
This commit is contained in:
Moritz »mo.« Sauer 2015-01-12 22:46:49 +01:00
parent 54411d7f9b
commit 25dab72954
7 changed files with 96 additions and 72 deletions

5
_includes/list-posts.html
View file

@ -31,8 +31,7 @@ This loop works like this:
{% for post in site.posts limit:include.entries offset:include.offset %}
<li><a href="{{ site.url }}{{ post.url }}">{% if post.subheadline %}{{ post.subheadline }} &middot; {% endif %}<strong>{{ post.title }}</strong></a></li>
{% endfor %}
<li class="text-right"><a href="{{ site.url }}/archiv/"><strong>Mehr ›</strong></a></li>
<li class="text-right"><a href="{{ site.url }}/blog/archive/"><strong>{{ site.data.language.more }}</strong></a></li>
{% elsif category %}
@ -40,7 +39,7 @@ This loop works like this:
{% for post in site.categories.[category] limit:include.entries offset:include.offset %}
<li><a href="{{ site.url }}{{ post.url }}">{% if post.subheadline %}{{ post.subheadline }} &middot; {% endif %}<strong>{{ post.title }}</strong></a></li>
{% endfor %}
<li class="text-right"><a href="{{ site.url }}/archiv/"><strong>Mehr ›</strong></a></li>
<li class="text-right"><a href="{{ site.url }}/blog/archive/"><strong>{{ site.data.language.more }}</strong></a></li>
{% elsif tag %}

117
_posts/design/2014-09-13-grid.md
View file

@ -1,8 +1,9 @@
---
layout: page-fullwidth
title: "Grid & Colors"
subheadline: "Multi-Device Layouts in Color"
title: "Grid & Colors"
description: "Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. To optimize the size of your images, you find the correct dimensions beneath. Further below you find the <a href='#color-scheme-and-colors-codes'>colorscheme and colors</a> used for <em>Feeling Responsive</em> and their color codes."
breadcrumb: true
categories:
- design
image:
@ -11,9 +12,29 @@ image:
---
*Feeling Responsive* is built on Foundation. And of course, we make use of the wonderful grid system and so can you. Find out more about [constructing beautiful layouts][1] in the foundation documentation.
## Large Displays
<div class="show-for-small">
<div class="row">
<div class="small-12 columns">
<h3>Small Grid</h3>
</div><!-- /.small-12.columns -->
</div>
<div class="row">
<div class="small-6 columns">
<img src="http://placehold.it/470x264/6b6351/e1dcd7&amp;text=2+Columns">
</div>
<div class="small-6 columns">
<img src="http://placehold.it/470x264/e05a10/e1e75e&amp;text=2+Columns">
</div>
</div>
</div>
### Two Columns
<div class="show-for-large-up">
<div class="row">
<div class="small-12 columns">
<h2>Large Displays</h2>
<h3>Large Displays Two Columns</h3>
</div><!-- /.small-12.columns -->
</div>
<div class="row">
<div class="large-6 columns">
@ -24,7 +45,15 @@ image:
</div>
</div>
### Three Columns
<div class="row">
<div class="small-12 columns">
<h3>Large Displays Three Columns</h3>
</div><!-- /.small-12.columns -->
</div>
<div class="row">
<div class="large-4 columns">
@ -38,9 +67,11 @@ image:
</div>
</div>
### Four Columns
<div class="row">
<div class="small-12 columns">
<h3>Large Displays Four Columns</h3>
</div><!-- /.small-12.columns -->
</div>
<div class="row">
<div class="large-3 columns">
@ -56,57 +87,51 @@ image:
<img src="http://placehold.it/220x141/00792c/acca57&amp;text=Width+220+Pixel">
</div>
</div>
</div><!-- /.hide-for-small -->
## Color Scheme and Colors Codes
{: .t90 }
<p class="teaser" markdown="1">
*Feeling Responsive* uses strong colors in combination with grey colors.
</p>
### Colours
<div class="row t90">
<div class="small-12 columns">
<h2>Color Scheme and Colors Codes</h2>
<p class="teaser"><em>Feeling Responsive</em> uses strong colors in combination with grey colors.</p>
<h3>Colours</h3>
</div><!-- /.small-12.columns -->
</div>
<div class="row">
<div class="large-2 columns b30" style="background: #45B29D; height: 166px;"></div>
<div class="large-2 columns b30" style="background: #334D5C; height: 166px;"></div>
<div class="large-2 columns b30" style="background: #A1D044; height: 166px;"></div>
<div class="large-2 columns b30" style="background: #EFC94C; height: 166px;"></div>
<div class="large-2 columns b30" style="background: #E27A3F; height: 166px;"></div>
<div class="large-2 columns b30" style="background: #DF4949; height: 166px;"></div>
<div class="small-2 columns"><div style="background: #45B29D; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #334D5C; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #A1D044; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #EFC94C; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #E27A3F; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #DF4949; height: 137px;"></div></div>
</div>
### Grey Scale
<h3>Grey Scale</h3>
<div class="row">
<div class="large-3 columns b30" style="background: #E4E4E4; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #D7D7D7; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #CBCBCB; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #BEBEBE; height: 220px;"></div>
<div class="small-2 columns"><div style="background: #E4E4E4; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #D7D7D7; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #CBCBCB; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #BEBEBE; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #A4A4A4; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #979797; height: 137px;"></div></div>
</div>
<div class="row">
<div class="large-3 columns b30" style="background: #A4A4A4; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #979797; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #8B8B8B; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #7E7E7E; height: 220px;"></div>
<div class="row t30">
<div class="small-2 columns"><div style="background: #8B8B8B; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #7E7E7E; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #646464; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #575757; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #4B4B4B; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #3E3E3E; height: 137px;"></div></div>
</div>
<div class="row">
<div class="large-3 columns b30" style="background: #646464; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #575757; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #4B4B4B; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #3E3E3E; height: 220px;"></div>
</div>
<div class="row">
<div class="large-3 columns b30" style="background: #313131; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #242424; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #171717; height: 220px;"></div>
<div class="large-3 columns b30" style="background: #0B0B0B; height: 220px;"></div>
<div class="row t30">
<div class="small-2 columns"><div style="background: #313131; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #242424; height: 137px;"></div></div>
<div class="small-2 columns"><div style="background: #171717; height: 137px;"></div></div>
<div class="small-2 columns end"><div style="background: #0B0B0B; height: 137px;"></div></div>
</div>

40
assets/css/styles-responsive.css
View file

@ -326,9 +326,9 @@ select {
margin-left: 0;
list-style: none;
border-style: solid;
border-width: 0px;
background-color: white;
border-color: #e6e6e6;
border-width: 0;
background-color: #e4e4e4;
border-color: #e4e4e4;
border-radius: 0;
}
/* line 122, ../bower_components/foundation/scss/foundation/components/_breadcrumbs.scss */
@ -4896,8 +4896,8 @@ table tr td {
/* line 112, ../bower_components/foundation/scss/foundation/components/_top-bar.scss */
meta.foundation-mq-topbar {
font-family: "/only screen and (min-width: 810px)/";
width: 810px;
font-family: "/only screen and (min-width: 1200px)/";
width: 1200px;
}
/* Wrapped around .top-bar to contain to grid width */
@ -5382,7 +5382,7 @@ meta.foundation-mq-topbar {
display: block;
}
@media only screen and (min-width: 810px) {
@media only screen and (min-width: 1200px) {
/* line 455, ../bower_components/foundation/scss/foundation/components/_top-bar.scss */
.top-bar {
background: white;
@ -7447,72 +7447,72 @@ CSS-Classes to add margin at the top or bottom
*/
/* line 161, ../scss/_5_layout_theme-fr.scss */
.t15 {
margin-top: 15px;
margin-top: 15px !important;
}
/* line 162, ../scss/_5_layout_theme-fr.scss */
.t20 {
margin-top: 20px;
margin-top: 20px !important;
}
/* line 163, ../scss/_5_layout_theme-fr.scss */
.t30 {
margin-top: 30px;
margin-top: 30px !important;
}
/* line 164, ../scss/_5_layout_theme-fr.scss */
.t50 {
margin-top: 50px;
margin-top: 50px !important;
}
/* line 165, ../scss/_5_layout_theme-fr.scss */
.t60 {
margin-top: 60px;
margin-top: 60px !important;
}
/* line 166, ../scss/_5_layout_theme-fr.scss */
.t90 {
margin-top: 90px;
margin-top: 90px !important;
}
/* line 168, ../scss/_5_layout_theme-fr.scss */
.b15 {
margin-bottom: 15px;
margin-bottom: 15px !important;
}
/* line 169, ../scss/_5_layout_theme-fr.scss */
.b20 {
margin-bottom: 20px;
margin-bottom: 20px !important;
}
/* line 170, ../scss/_5_layout_theme-fr.scss */
.b30 {
margin-bottom: 30px;
margin-bottom: 30px !important;
}
/* line 171, ../scss/_5_layout_theme-fr.scss */
.b60 {
margin-bottom: 60px;
margin-bottom: 60px !important;
}
/* line 173, ../scss/_5_layout_theme-fr.scss */
.pl20 {
padding-left: 20px;
padding-left: 20px !important;
}
/* line 175, ../scss/_5_layout_theme-fr.scss */
.pr5 {
padding-right: 5px;
padding-right: 5px !important;
}
/* line 176, ../scss/_5_layout_theme-fr.scss */
.pr10 {
padding-right: 10px;
padding-right: 10px !important;
}
/* line 177, ../scss/_5_layout_theme-fr.scss */
.pr20 {
padding-right: 20px;
padding-right: 20px !important;
}
/* line 1, ../scss/_6_additional_theme-fr.scss */

2
assets/css/styles-responsive.min.css vendored
View file

File diff suppressed because one or more lines are too long

1
blog/index.html
View file

@ -2,7 +2,6 @@
layout: blog
title: "Blog"
description: "This is the Feeling Responsive Blog Template."
breadcrumb: true
image:
header: "unsplash_6_bus_header.jpg"
thumb: "unsplash_6_bus_thumb.jpg"

1
pages/roadmap.md
View file

@ -11,6 +11,7 @@ permalink: "/roadmap/"
## ToDo
* Produce an introduction video to showcase *Feeling Responsive*
* Rework `list-entries.html` › english translation and links
* [Submit *Feeling Responsive* to jekyllthemes.org](http://jekyllthemes.org/)
* Optimize HTML and use Schema.org-Attributes › <http://schema.org/Article>
* Convert Foundation Sass to use native Jekyll Sass support

2
pages/search.md
View file

@ -7,5 +7,5 @@ permalink: "/search/"
{% include google_search.html %}
<form onsubmit="google_search()" >
<input type="text" id="google-search" placeholder="Search">
<input type="text" id="google-search" placeholder="Enter search term and hit enter">
</form>