powergamingon.github.io/template.html at main · greycatsec/powergamingon.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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Powergaming: On</title>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Questrial&display=swap" rel="stylesheet">
    <link href="style.css" rel="stylesheet" type="text/css" media="all">

  </head>

<body>

  <!-- HEADER - INCLUDE IN ALL PAGES
    perhaps someday I figure out how to use javascript and this will be replaced with a simpler template.
    in the meantime include this and (optionally I guess) the footer below in all pages -->
  <div class="headerwrapper">

    <div class="header">
      <h1 class="title">Powergaming: On</h1>
    </div>

    <div class="nav">
    <ul>
      <li><a href="https://powergamingon.github.io/">Home</a></li>
      <li><a href="https://powergamingon.github.io/restrospectives.html">Gamemaster's Retrospectives</a></li>
      <li><a href="https://powergamingon.github.io/players.html">Player Contributions</a></li>
      <li><a href="https://powergamingon.github.io/credits.html">Credits</a></li>
    </ul>
    </div>
  </div>
  <!-- END HEADER -->

  <div class="mainwrapper">

  <!-- You can make "content boxes" like this:

  <div class="box">
    <h3 class="subheaders">Header Here</h3>
    <div class="content">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nec ante at ante semper tempus nec vel nisl. Sed aliquet velit porttitor ullamcorper interdum. Integer ac lacus et odio volutpat sagittis non et elit. Nunc rutrum viverra justo, eu eleifend elit. Vestibulum molestie, diam vel ornare placerat, lectus ante imperdiet nisi, et efficitur velit elit tempus felis. Suspendisse nibh tellus, volutpat ac elit vel, dignissim viverra leo. Pellentesque eu molestie diam.</p>
    </div>
  </div>
   -->

  <!-- FOOTER -->
  <div class="box">
  <div class="content">
  <p style="text-align:center">
    <img src="dragon-vibe-green.gif"
    alt="Five green dragons seen from different angles, undulating gently.">
  </p>
  </div>
  </div>
  <!-- END FOOTER -->

</body>

</html>