Skip to content

Instantly share code, notes, and snippets.

@steinsag
steinsag / VIM: create UTF8 file
Last active December 11, 2015 02:48
Short sequence of vim commands to create an UTF8 file.
:set nobomb
:set fileencoding=utf-8
:w index.html
@steinsag
steinsag / index.css
Last active December 11, 2015 02:58
A basic HTML5 page.
nav h1, footer h1 {
display: none;
}
@steinsag
steinsag / reset.html5.css
Created January 15, 2013 20:46
Reset for HTML5 elements
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
@steinsag
steinsag / base.html
Last active December 11, 2015 03:59
Basic site structure incorporating responsive.gs requirements
<body>
<div id="page_wrap" class="container">
<header>...</header>
<section id="content_wrap">
<section id="article_listing">
<article>...</article>
<article>...</article>
</section>
@steinsag
steinsag / base.responsive.html
Created January 15, 2013 21:18
Base structure of a HTML5 page including responsive.gs classes to define rows and columns.
<body>
<div id="page_wrap" class="container row">
<header class="row">...</header>
<section id="content_wrap" class="row">
<section id="article_listing" class="col span_8">
<article class="row">...</article>
<article class="row">...</article>
</section>
@steinsag
steinsag / index.css
Created January 15, 2013 21:22
Define page width, show horizontal navigation, and hide some headlines.
.container {
max-width: 980px;
}
nav h1, footer h1 {
display: none;
}
nav ul li, footer ul li {
display: inline;
@steinsag
steinsag / media_query.css
Created January 16, 2013 22:41
Simple media query to add a background image only on a certain minimum page width.
@media ( min-width : 768px ) {
#page_wrap hgroup {
background: #fff url('images/skyline.jpg') no-repeat right bottom;
min-height: 118px;
}
}
@steinsag
steinsag / grid-outbreak.html
Created January 18, 2013 20:14
While using a grid system, it is not possible to position elements outside the grid. However, one is not forced to use the grid for the whole page. You can have multiple grids on a single page.
<body>
<header>
<hgroup class="container">
...
</hgroup>
<nav class="row">
<ul class="container">
<li><a href="/about">Über mich</a></li>
<li>...</li>
@steinsag
steinsag / gradient.css
Created January 18, 2013 20:23
Some simple CSS to define a background gradient.
header nav {
position: relative;
border-top: 1px solid #73BBCF;
border-bottom: 1px solid #73BBCF;
}
header nav {
padding: 12px 0;
font-weight: bold;
font-size: 0.875em;
@steinsag
steinsag / darktable.c
Created May 17, 2013 21:23
Just a small snippet of Darktable's code to create a button for the preferences dialog.
g->description = GTK_ENTRY(gtk_entry_new());
gtk_box_pack_start(box, GTK_WIDGET(g->description), FALSE, FALSE, 0);
g_object_set(G_OBJECT(g->description), "tooltip-text", _("description or further information"), (char *)NULL);