Skip to content

Instantly share code, notes, and snippets.

View machal's full-sized avatar

Martin Michálek machal

View GitHub Profile
@machal
machal / dabblet.css
Created March 15, 2012 10:49
Dabblet: CSS - multiple box-shadows
/**
* Dabblet: CSS - multiple box-shadows
*/
.box {
box-shadow: -5px -5px rgb(128,128,128), -10px -10px rgb(0,0,0), -15px -15px 10px rgba(0,0,0,.25);
width: 200px;
padding: 1em;
margin: 5em;
background: white;
@machal
machal / dabblet.css
Created April 12, 2012 17:27
IE9 SVG, needs conditional override of 'filter' to 'none'
.nav {
color: #fff;
display: inline-block;
border-radius: 10px;
background: rgb(30,87,153); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFlNTc5OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3ZGI5ZTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(125,185,232,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color
@machal
machal / dabblet.css
Created April 12, 2012 19:55
Dabblet: CSS3 navigation / modular CSS example
/*
* Dabblet: CSS3 navigation / modular CSS example
* Author: twitter.com/machal
*/
/* Module: universal ribbon */
.ribbon {
font-family: Arial, sans-serif;
color: #fff;
@machal
machal / dabblet.css
Created May 13, 2012 21:53
Dabblet: CSS3 badges
/**
* Dabblet: CSS3 badges
*/
.badge {
box-sizing: border-box;
display: inline-block;
text-align: center;
text-decoration: none;
padding-top: 1.75em;
@machal
machal / dabblet.css
Created May 14, 2012 05:34
Dabblet: CSS3 badges
/**
* Dabblet: CSS3 badges
*/
.badge {
font-size: 15px;
box-sizing: border-box;
display: inline-block;
text-align: center;
text-decoration: none;
@machal
machal / dabblet.css
Created May 14, 2012 07:16
Dabblet: Pure CSS3 badges
/**
* Dabblet: Pure CSS3 badges
* Author: Martin Michálek, machal77@gmail.com, @machal
* Used here: http://kratce.vzhurudolu.cz/
*/
.badge {
box-sizing: border-box;
display: inline-block;
float: left;
@machal
machal / dabblet.css
Created May 16, 2012 06:32
Dabblet: CSS3 radial gradients shapes test
/**
* Dabblet: CSS3 radial gradients shapes test
*/
.shape {
width: 100px;
height: 100px;
background: radial-gradient(top left, orange 0%, red 100%);
}
@machal
machal / dabblet.css
Created May 16, 2012 06:46
Dabblet: Anatomie CSS3 placky - komentovany kod s prefixy
/**
* Dabblet: Anatomie CSS3 placky - komentovany kod s prefixy
* Autor: Martin Michálek, machal77@gmail.com, @machal
*/
.badge {
/* Zacneme ctvercovym blokem s textem uvnitr */
display: inline-block;
text-align: center;
text-decoration: none;
@machal
machal / dabblet.css
Created May 21, 2012 08:34
Dabblet: iOS Safari table border problem
/**
* Dabblet: iOS Safari table border problem
*/
table {
border-spacing: 0 3px;
}
td {
padding: 10px;
@machal
machal / dabblet.css
Created June 14, 2012 11:44
Dabblet: CSS button done i 10seconds
/*
* Dabblet: CSS button done i 10seconds
* thanks to CSSHat and this PSD file: http://365psd.com/day/56/
* Workman: @machal
*/
.test {
color: #fff;
font: 15px/30px sans-serif;
text-align: center;