Skip to content

Instantly share code, notes, and snippets.

/index.html

Created January 20, 2017 21:59
Show Gist options
  • Save anonymous/47be77ebdee5aad8e9badbe0af9efb31 to your computer and use it in GitHub Desktop.
Save anonymous/47be77ebdee5aad8e9badbe0af9efb31 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @invalid-email-address Anonymous created this gist Jan 20, 2017.
    18 changes: 18 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,18 @@

    <div class='line-through'>
    <h1>Branchy</h1>
    </div>

    <a href='#'>About</a>
    <a href='#'>Contribute</a>
    <a href='#'>Archives</a>

    <div class='line-through' style='margin-top:10em;'>
    <h2>Study Shows: Connecting Lines Improve Readability</h2>
    </div>

    <p>I could write lorem ipsum in here. But I won't do that. Instead, I'll tell you all about how much I'd like to make some more Jekyll themes, like this one.
    <br><br>
    Oh yes. Baskerville is a lovely typeface. Look at this ampersand! <em style='font-size:6em;padding-left:30px;letter-spacing:-2px;'>j<span style='font-size:.61em;'>&amp;</span>se shawl</em>
    </p>

    7 changes: 7 additions & 0 deletions kesje.markdown
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    kEsJe
    -----


    A [Pen](http://codepen.io/jshawl/pen/kEsJe) by [Jesse Shawl](http://codepen.io/jshawl) on [CodePen](http://codepen.io/).

    [License](http://codepen.io/jshawl/pen/kEsJe/license).
    1 change: 1 addition & 0 deletions scripts
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    85 changes: 85 additions & 0 deletions style.scss
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,85 @@
    @import "compass/css3";

    @import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);

    @import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,200italic);


    body{
    margin-top:5em;
    font-family:'Montserrat';
    background:#333;
    }
    .line-through{
    height:1px;
    width:100%;
    background:#DDD;
    }
    .line-through h1, .line-through h2{
    display:inline-block;
    border:1px solid #DDD;
    padding:10px;
    margin-top:-.9em;
    border-radius:5px;
    position:absolute;
    background:#333;
    margin-left:1em;
    }

    h1{
    font-weight:700;
    color:#fff;
    font-size:3em;
    }

    h2{
    color:#fff;
    margin-left:2em !important;
    font-weight:400;
    }

    a{
    border:1px solid #CCC;
    color:#fff;
    float:right;
    padding:.5em;
    border-radius:5px;
    margin-top:1em;
    margin-right:.9em;
    position:relative;
    text-decoration:none;
    &:before{
    content:'';
    display:block;
    height:1em;
    width:1px;
    position:absolute;
    background:#ccc;
    top:-1.1em;
    left:48%;
    }
    }

    p{
    border:1px solid #fff;
    padding:10px;
    width:650px;
    color:#fff;
    margin-top:3em;
    border-radius:5px;
    margin-left:5em;
    font-family:'Baskerville';
    font-size:1.5em;
    position:relative;
    }

    p:before{
    content:'';
    display:block;
    position:absolute;
    width:1px;
    height:45px;
    background:#CCC;
    top:-45px;
    left:30px;
    }