Skip to content

Instantly share code, notes, and snippets.

@nicbell

nicbell/index.html

Created May 14, 2014 09:25
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save nicbell/f17043113be2bb8c8c97 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save nicbell/f17043113be2bb8c8c97 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. nicbell created this gist May 14, 2014.
    13 changes: 13 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,13 @@
    <svg style="display: none; height: 100px; width: 100%" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
    <defs id="FooDefs">
    <linearGradient id="MyFirstGradient" x1="0" y1="0" x2="0" y2="50" gradientUnits="userSpaceOnUse">
    <stop id="stop1" style="stop-color:#1acf86;" offset="0" />
    <stop id="stop2" style="stop-color:#ff0051;" offset="0.25" />
    <stop id="stop3" style="stop-color:#1da1c9;"offset="0.625" />
    <stop id="stop4" style="stop-color:#e45f25;" offset="1" />
    </linearGradient>
    </defs>
    <text x="0" y="50%" id="text" style="font-size:72px;fill:url(#MyFirstGradient);"></text>
    </svg>

    <h1>Just like MS Word</h1>
    7 changes: 7 additions & 0 deletions jGcbq.markdown
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    jGcbq
    -----


    A [Pen](http://codepen.io/nicbell/pen/jGcbq) by [Nic Bell](http://codepen.io/nicbell) on [CodePen](http://codepen.io/).

    [License](http://codepen.io/nicbell/pen/jGcbq/license).
    8 changes: 8 additions & 0 deletions script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,8 @@
    var title = document.querySelector('h1'),
    svgTemplate = document.querySelector('svg');

    svgTemplate.style.display = 'block';
    svgTemplate.querySelector('#text').textContent = title.innerHTML;

    title.innerHTML = '';
    title.appendChild(svgTemplate);