Skip to content

Instantly share code, notes, and snippets.

@daneden

daneden/dabblet.css

Created June 17, 2012 20:06
Download ZIP

Revisions

  1. daneden revised this gist Oct 1, 2012. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -24,6 +24,7 @@ html {
    border-radius: 100%;
    top: -6px;
    left: 7px;
    box-shadow: 0 -2px 2px rgba(0,0,0,.05);
    }

    .cloud:after {
  2. daneden revised this gist Jun 17, 2012. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -12,7 +12,7 @@ html {
    height: 1em;
    border-radius: 3em;
    position: relative;
    box-shadow: 0 2px 2px rgba(0,0,0,.1), inset 0 -2px 2px rgba(0,100,160,.1);
    box-shadow: inset 0 -1px rgba(255,255,255,.6), 0 2px 2px rgba(0,0,0,.1), inset 0 -2px 2px rgba(0,100,160,.1);
    }

    .cloud:before, .cloud:after {
  3. daneden created this gist Jun 17, 2012.
    42 changes: 42 additions & 0 deletions dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,42 @@
    /* <i> Cloud */

    html {
    min-height: 100%;
    background: linear-gradient(#b4bcbf, #fff);
    }

    .cloud {
    display: inline-block;
    background-color: #fff;
    width: 3em;
    height: 1em;
    border-radius: 3em;
    position: relative;
    box-shadow: 0 2px 2px rgba(0,0,0,.1), inset 0 -2px 2px rgba(0,100,160,.1);
    }

    .cloud:before, .cloud:after {
    content:'';
    position: absolute;
    background-color: #fff;
    width: 14px;
    height: 14px;
    border-radius: 100%;
    top: -6px;
    left: 7px;
    }

    .cloud:after {
    width: 23px;
    height: 23px;
    left: auto;
    right: 7px;
    top: -10px
    }

    .cloud { /* This stuff is just for the demo */
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -.5em -1.5em;
    }
    1 change: 1 addition & 0 deletions dabblet.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    <i class=cloud></i>
    1 change: 1 addition & 0 deletions settings.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}