elze.github.io/hackentines.html at master · elze/elze.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
<!--
  The <html> tag tells the Browser - this is an HTML page
  The <head> tag tells the Browser meta information about the page
  The <title> tag twlls the Browser the name of this page, and it's the text that shows up in the tab
  The <link rel="stylesheet" href="stylesheets/main.css"> tells the Browser where to find the CSS file
  The <link href="http://fonts.googleapis.com/... tag tells the Browser to go look in Google's font library for our fonts
-->
<html>
  <head>
    <title>Hackentine's Day!</title>
    <link rel="stylesheet" href="stylesheets/main.css">
    <link href="http://fonts.googleapis.com/css?family=Alfa+Slab+One|Permanent+Marker|Nova+Mono|Monoton|Press+Start+2P|Bowlby+One+SC|Cedarville+Cursive" rel="stylesheet" type="text/css">

  </head>
  <!--
    If you want to change the background of the entire page change "hearts-gray" to the stylename you want!
  -->
  <body class="love">
    <!--
      If you want to change the background of the card add a new style in addition to "hackentines-day-card-container"
    Example:
    <div class="hackentines-day-card-container hearts">
    -->
    <div class="hackentines-day-card-container">
      <!--
        This is a comment! It won't appear in the Browser.
        There are two divs on this page both with the class name "card"
        The first <div> is the front of the card
        The second <div> is the back of the card

        Note: Remember you can have more than one class name per tag!
        Just remember to put a space in between class names

        Example:
        <div class="hackentines-day-card-container pink cursive center">

        or:
        <p class="red sans-serif center">Happy Hackentine's Day!</p>
      -->
      <div class="card">
        <!--
          You can change the text inside the <h1> tags or add new HTML tags of your own!
        -->
        <h1 class="main-text"><span class="happy">Happy</span> <span class="valentines">Valentines</span> <span class="day">Day!</span> </h1>
        <img class="heart-picture" src="images/small-red-heart-with-transparent-background-md.png"/>
      </div>
      <div class="card hidden">
        <!--
          You can change the text inside the <p> tags or add new HTML tags of your own!
        -->

        <p class="second-text">Hope you have a tasty cupcake that you take a great big byte out of!</p>
        <p class=""></p>
        <img src="images/foxy.gif"/>
      </div>
    </div>
    <script src="javascripts/jquery.js"></script>
    <script src="javascripts/card-flip.js"></script>
<script type="text/javascript">
sc_project=2721969;
sc_invisible=0;
sc_security="5cfe5782";
</script>

<script type="text/javascript"
src="http://www.statcounter.com/counter/counter.js"></script><noscript><div
class="statcounter"><a title="site stats"
href="http://www.statcounter.com/free-web-stats/"
target="_blank"><img class="statcounter"
src="http://c29.statcounter.com/2721969/0/5cfe5782/0/"
alt="free hit counter" ></a></div></noscript>
<!-- End of StatCounter Code -->

  </body>
</html>