Skip to content

Instantly share code, notes, and snippets.

@ajduke
Forked from anonymous/index.html
Last active February 12, 2016 17:41
Show Gist options
  • Select an option

  • Save ajduke/bcb5659b38a45b11d88d to your computer and use it in GitHub Desktop.

Select an option

Save ajduke/bcb5659b38a45b11d88d to your computer and use it in GitHub Desktop.

Revisions

  1. ajduke revised this gist Feb 12, 2016. No changes.
  2. @invalid-email-address Anonymous created this gist Feb 12, 2016.
    81 changes: 81 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,81 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>JS Bin</title>
    <style id="jsbin-css">
    ul {
    box-shadow: 1px 1px 3px #555;
    margin:50px auto;
    padding: 0px;
    width: 120px;
    transition: all .2s ease-in, transform 1.8s ease-in-out;
    text-align: center;
    }

    ul:hover {
    box-shadow: 2px 4px 3px #555;
    cursor: pointer;
    background: lightblue;
    color: brown;
    transform: rotate(360deg) scale(1.2);

    }
    li {
    box-sizing: border-box;
    width: 100%;
    list-style: none;
    padding: 10px 10px;
    background:#fff;
    background: transparent;

    }

    li:not(:last-child){
    border-bottom: 1px solid #111;
    }
    </style>
    </head>
    <body>

    <ul>
    <li>First</li>
    <li>Second</li>
    <li>Last</li>
    </ul>



    <script id="jsbin-source-css" type="text/css">ul {
    box-shadow: 1px 1px 3px #555;
    margin:50px auto;
    padding: 0px;
    width: 120px;
    transition: all .2s ease-in, transform 1.8s ease-in-out;
    text-align: center;
    }

    ul:hover {
    box-shadow: 2px 4px 3px #555;
    cursor: pointer;
    background: lightblue;
    color: brown;
    transform: rotate(360deg) scale(1.2);

    }
    li {
    box-sizing: border-box;
    width: 100%;
    list-style: none;
    padding: 10px 10px;
    background:#fff;
    background: transparent;

    }

    li:not(:last-child){
    border-bottom: 1px solid #111;
    }</script>
    </body>
    </html>
    30 changes: 30 additions & 0 deletions jsbin.wijeni.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,30 @@
    ul {
    box-shadow: 1px 1px 3px #555;
    margin:50px auto;
    padding: 0px;
    width: 120px;
    transition: all .2s ease-in, transform 1.8s ease-in-out;
    text-align: center;
    }

    ul:hover {
    box-shadow: 2px 4px 3px #555;
    cursor: pointer;
    background: lightblue;
    color: brown;
    transform: rotate(360deg) scale(1.2);

    }
    li {
    box-sizing: border-box;
    width: 100%;
    list-style: none;
    padding: 10px 10px;
    background:#fff;
    background: transparent;

    }

    li:not(:last-child){
    border-bottom: 1px solid #111;
    }