forked from simondevyoutube/Quick_3D_RPG
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
134 lines (134 loc) · 6.76 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
130
131
132
133
134
<!DOCTYPE html>
<html>
<head>
<title>The Legend of SimonDev</title>
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" type="text/css" href="base.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=IM+Fell+English&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=IM+Fell+French+Canon+SC&display=swap" rel="stylesheet">
</head>
<body>
<script src="./src/main.js" type="module">
</script>
<div class="container" id="container">
<div class="ui">
<div class="quest-journal-layout">
<div class="quest-journal" id="quest-journal">
</div>
</div>
</div>
<div class="ui">
<div class="quest-ui-layout">
<div class="quest-ui" id="quest-ui">
<div class="quest-text-title" id="quest-text-title"></div>
<div class="quest-text" id="quest-text"></div>
</div>
</div>
</div>
<div class="ui">
<div class="icon-ui">
<div class="icon-bar" id="icon-bar">
<div class="icon-bar-item" id="icon-bar-stats" style="background-image: url('./resources/icons/ui/skills.png');"></div>
<div class="icon-bar-item" id="icon-bar-inventory" style="background-image: url('./resources/icons/ui/backpack.png');"></div>
<div class="icon-bar-item" id="icon-bar-quests" style="background-image: url('./resources/icons/ui/tied-scroll.png');"></div>
</div>
</div>
</div>
<div class="ui">
<div class="stats" id="stats">
<div class="stats-inner">
<div class="stats-title">Statistics</div>
<div class="stats-row">
<div class="stats-tooltip">Strength
<div class="stats-tooltiptext">How strong you are, affects how much damage you do. So blah blah if you're doing stuff then its stronger or whatever, the damage is up. This is text to show the tooltip.</div>
</div>
<div id="stats-strength">0</div>
</div>
<div class="stats-row">
<div class="stats-tooltip">Wisdomness
<div class="stats-tooltiptext">Wisdom is the guage of something to do with wisdom in the game because wisdom is important and wisdom is wise to wisdoming.</div>
</div>
<div id="stats-wisdomness">0</div>
</div>
<div class="stats-row">
<div class="stats-tooltip">Benchpress
<div class="stats-tooltiptext">Gotta have a good bench to be a warrior or something.</div>
</div>
<div id="stats-benchpress">0</div>
</div>
<div class="stats-row">
<div class="stats-tooltip">Curl
<div class="stats-tooltiptext">The ultimate expression of strength, this affects literally everything in your life.</div>
</div>
<div id="stats-curl">0</div>
</div>
<div class="stats-row">
<div class="stats-tooltip">XP
<div class="stats-tooltiptext">How much xp you've accumulated by killing things for xp. Get enough and you'll gain a level or something.</div>
</div>
<div id="stats-experience">0</div>
</div>
</div>
</div>
</div>
<div class="ui">
<div class="health-ui">
<div class="health-bar" id="health-bar"></div>
</div>
</div>
<div class="ui">
<div class="inventory" id="inventory">
<div class="inventory-inner">
<div class="inventory-title">Inventory</div>
<div class="inventory-row">
<div class="inventory-column">
<div class="inventory-item" id="inventory-equip-1" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-2" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-3" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-4" draggable="true"></div>
</div>
<div class="inventory-character"></div>
<div class="inventory-column">
<div class="inventory-item" id="inventory-equip-5" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-6" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-7" draggable="true"></div>
<div class="inventory-item" id="inventory-equip-8" draggable="true"></div>
</div>
</div>
<div class="inventory-row">
<div class="inventory-item" id="inventory-1" draggable="true"></div>
<div class="inventory-item" id="inventory-2" draggable="true"></div>
<div class="inventory-item" id="inventory-3" draggable="true"></div>
<div class="inventory-item" id="inventory-4" draggable="true"></div>
<div class="inventory-item" id="inventory-5" draggable="true"></div>
<div class="inventory-item" id="inventory-6" draggable="true"></div>
<div class="inventory-item" id="inventory-7" draggable="true"></div>
<div class="inventory-item" id="inventory-8" draggable="true"></div>
</div>
<div class="inventory-row">
<div class="inventory-item" id="inventory-9" draggable="true"></div>
<div class="inventory-item" id="inventory-10" draggable="true"></div>
<div class="inventory-item" id="inventory-11" draggable="true"></div>
<div class="inventory-item" id="inventory-12" draggable="true"></div>
<div class="inventory-item" id="inventory-13" draggable="true"></div>
<div class="inventory-item" id="inventory-14" draggable="true"></div>
<div class="inventory-item" id="inventory-15" draggable="true"></div>
<div class="inventory-item" id="inventory-16" draggable="true"></div>
</div>
<div class="inventory-row">
<div class="inventory-item" id="inventory-17" draggable="true"></div>
<div class="inventory-item" id="inventory-18" draggable="true"></div>
<div class="inventory-item" id="inventory-19" draggable="true"></div>
<div class="inventory-item" id="inventory-20" draggable="true"></div>
<div class="inventory-item" id="inventory-21" draggable="true"></div>
<div class="inventory-item" id="inventory-22" draggable="true"></div>
<div class="inventory-item" id="inventory-23" draggable="true"></div>
<div class="inventory-item" id="inventory-24" draggable="true"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>