Skip to content

Instantly share code, notes, and snippets.

View wlippold's full-sized avatar

Wayne Lippold wlippold

View GitHub Profile
<!DOCTYPE html>
<html>
<head><title>HTML Attribute Exercises</title></head>
<body>
<h1>HTML Attribute Exercises</h1>
<ol>
<!-- 1. Add a tooltip to the paragraph below with the text "About HSArtsTech.org".
@wlippold
wlippold / dabblet and gist
Last active December 11, 2016 03:33 — forked from anonymous/dabblet.css
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;
@wlippold
wlippold / 3d-css-typography.markdown
Last active December 15, 2016 13:42
3D CSS Typography 🔥

3D CSS Typography 🔥

Renders best in Chrome.

This technique does work in Firefox, but text stroke is not supported.

A Pen by Wayne Lippold on CodePen.

License.

@wlippold
wlippold / index.html
Last active December 15, 2016 18:15
Webfont Demo
<div class="quote">
<span class="line1">If you haven’t</span>
<span class="line2">surprised</span>
<span class="line3">yourself yet,</span>
<span class="line4">you haven’t done</span>
<span class="line5">enough</span>
<span class="line6">sketching</span>
<cite>—Josh Collinsworth</cite>
</div>
@wlippold
wlippold / Testing
Created December 15, 2016 18:17
Testing
dfg
@wlippold
wlippold / index.html
Last active December 22, 2016 12:20
Music Player
<html>
<head>
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Quicksand:300,400'>
<style>
body {
font-size: 16px;
background: #ecf0f1;
font-family: 'Quicksand', sans-serif;
}
@wlippold
wlippold / index.html
Created December 22, 2016 12:25
Yellow_Submarine
<html>
<head>
<link rel='stylesheet' type='text/css' href='http://fonts.googleapis.com/css?family=Quicksand:300,400'>
<style>
body {
font-size: 16px;
background: #ecf0f1;
font-family: 'Quicksand', sans-serif;
}
@wlippold
wlippold / index.html
Created December 22, 2016 13:03
Music Player
<!-- Ui inspired from this : https://dribbble.com/shots/1044569-Music-Player-Concept -->
<script type="text/javascript" src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script>
"use strict";
$(document).ready(function() {
var songs = [{
"title": "Misses",
"artist": "Girls in Hawaii",
"cover": "http://bloo.ovh/music-player/img/Girls in Hawaii.jpeg",
"num": "0",
@wlippold
wlippold / css-drop-shadow.markdown
Last active January 4, 2017 12:57
CSS Drop Shadow