-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
129 lines (116 loc) · 3 KB
/
index.html
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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html>
<head>
<!-- <meta name="viewport" content="width=device-width, initial-scale=1"> -->
<link rel="stylesheet" href="style.css">
<title>DHC homepage</title>
<style>
body {
background-image: url('images/DHC-background-FINAL.png');
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
position: relative;
/* background: rgb(204, 204, 255);
background: radial-gradient(circle, rgba(204, 204, 255, 1) 0%, rgba(134, 94, 156, 1) 100%); */
}
#screen {
position: absolute;
top: 190px;
left: 945px;
width: 210px;
z-index: 1;
}
/* #project {
position: fixed;
top: 300px;
left: 1200px;
width: 140px;
z-index: 2;
} */
#poster {
position: fixed;
top: 170px;
left: 735px;
width: 48px;
z-index: 3;
}
#plant {
position: fixed;
top: 155px;
left: 1315px;
width: 180px;
z-index: 4;
}
#laptop {
position: fixed;
top: 330px;
left: 380px;
width: 130px;
z-index: 5;
}
#recycle {
position: fixed;
top: 500px;
left: 725px;
width: 100px;
z-index: 6;
}
/* Main site body */
.wrapper {
width: 940px;
margin: 0 auto;
position: relative; /* Ensure absolute positioned child elements are relative to this*/
}
/* Absolute positioned wrapper for the element you want to fix position */
.fixed-wrapper {
width: 220px;
position: absolute;
top: 0;
left: -240px; /* Move this out to the left of the site body, leaving a 20px gutter */
}
/* The element you want to fix the position of */
.fixed {
width: 220px;
position: fixed;
/* Do not set top / left! */
}
</style>
</head>
<body>
<p style="color:white; font-family:verdana;">
Welcome to the Barnard DHC
</p>
<div id="calculator" class="room">
<p><a href="footprint-calculator.html">
<img src="images/Plant.png" alt="plant with tall leaves and orange pot" id="plant">
</a></p>
</div>
<div>
<p><a href="images/DHC-values_Poster.png" class="room">
<img src="images/DHC-values_Poster-sm.png" alt="blob" id="poster">
</a></p>
</div>
<div>
<p><a href="project_gallery.html" class="room">
<img src="images/TV-Monitor.png" alt="tv screen" id="screen">
</a></p>
</div>
<div>
<p><a href="dh-toolkit.html" class="room">
<img src="images/computer.svg" alt="laptop" id="laptop">
</a></p>
</div>
<div>
<p><a href="footprint_narrative.html" class="room">
<img src="images/recycleBin-cropped.svg" alt="a green trecycling bin" id="recycle">
</a></p>
</div>
<!-- <div>
<p><a href="project_gallery.html" class="room">
<img src="images/poster.svg" alt="white poster on wooden stand" id="project">
</a></p>
</div> -->
<script src="script.js"></script>
</body>
</html>