-
Notifications
You must be signed in to change notification settings - Fork 22
/
Copy pathoffline.html
84 lines (78 loc) · 6.24 KB
/
offline.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
<!DOCTYPE html>
<html style="font-size: 16px;">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<meta name="description" content="">
<title>yell0wsuit's HTML5 games collection</title>
<link rel="stylesheet" href="css/nicepage.css" media="screen">
<meta name="generator" content="Nicepage 2.19.0, nicepage.com">
<style class="u-style">
kbd {background-color: #eee;border-radius: 4px;border: thin solid #e5e5e5;color: #333;display: inline-block;font-weight: 700;line-height: 1;padding: 2px 4px;white-space: nowrap;}
code {background-color: #ddf4ff; color: #0969da; font-weight:700}
.u-section-2 {background-image: none}
.u-section-2 .u-sheet-1 {min-height: 2809px}
.u-section-2 .u-text-1 {font-variation-settings: 'wght' 600; font-size: 40px; margin: 57px auto 0}
.u-section-2 .u-text-2 {font-variation-settings: 'wght' 500; width: 793px; font-style: italic; margin: 20px auto 0}
.u-section-2 .u-list-1 {min-height: 618px; grid-template-columns: repeat(2, calc(((100% - 1140px) / 2) + 555px)); grid-template-rows: repeat(2, auto); width: 1140px; grid-gap: 30px; margin: 20px 0 0}
.u-section-2 .u-list-item-1 {background-image: none; border-radius: 8px; border-color: #e5e5e5; border-width: thin; border-style: solid; box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);}
.u-section-2 .u-container-layout-1 {padding: 30px 30px 30px 30px}
.u-section-2 .u-group-1 {width: 270px; min-height: 249px; background-size: auto; margin: -249px 0 0 auto}
.u-section-2 .u-container-layout-2 {padding: 0 25px}
.u-section-2 .u-text-3 {font-variation-settings: 'wght' 500; margin: 20px 0 0}
.u-section-2 .u-text-4 {font-style: italic; margin: 20px 0 0 auto}
.u-section-2 .u-text-5 {font-variation-settings: 'wght' 600; color: #006700; margin: 5px 0 0}
.u-section-2 .u-btn-1 {font-variation-settings: 'wght' 600; text-transform: uppercase; background-image: none; margin: 20px 0 0;}
@media (max-width: 1199px){ .u-section-2 .u-sheet-1 {min-height: 2150px}
.u-section-2 .u-list-1 {min-height: 510px; grid-template-columns: repeat(2, calc(((100% - 940px) / 2) + 455px)); width: 940px}
@media (max-width: 991px){ .u-section-2 .u-text-2 {width: 720px}
.u-section-2 .u-list-1 {grid-template-columns: 100%; width: 720px}
.u-section-2 .u-group-1 {width: 377px}
.u-section-2 .u-container-layout-2 {padding-top: 0; padding-bottom: 0}
@media (max-width: 767px){ .u-section-2 .u-text-2 {width: 540px}
.u-section-2 .u-list-1 {width: 540px}
.u-section-2 .u-group-1 {width: 265px}
.u-section-2 .u-container-layout-2 {padding-left: 30px; padding-right: 30px}
@media (max-width: 575px){ .u-section-2 .u-sheet-1 {min-height: 1800px}
.u-section-2 .u-text-1 {font-size: 2.25rem}
.u-section-2 .u-text-2 {margin-left: 0; margin-right: 0; width: 340px}
.u-section-2 .u-list-1 {min-height: 1590px; height: auto; margin-right: initial; margin-left: initial; width: auto}
.u-section-2 .u-container-layout-1 {padding-left: 20px; padding-right: 20px}
.u-section-2 .u-image-1 {height: auto; margin-right: initial; margin-left: initial; width: 280px}
.u-section-2 .u-group-1 {min-height: 177px; margin-top: 0; margin-right: initial; margin-left: initial; width: auto}
.u-section-2 .u-container-layout-2 {padding-top: 30px; padding-left: 0; padding-right: 0}
.u-section-2 .u-text-3 {margin-top: 0}
.u-section-2 .u-text-4 {margin-right: auto; margin-left: 0}
.u-section-2 .u-btn-1 {margin-right: auto}
</style>
<meta property="og:title" content="yell0wsuit's HTML5 games collection">
<meta name="theme-color" content="#f05510">
<link rel="canonical" href="">
<meta property="og:url" content="">
</head>
<body class="u-body">
<section class="u-clearfix u-grey-10 u-section-2" id="sec-922b">
<div class="u-clearfix u-sheet u-valign-middle">
<p class="u-text u-text-3">The guide below is for Windows (Windows 10 or 11 is recommended). Other PC operating systems may have different ways of installing Python.</p>
<div class="u-expanded-width-xs u-list u-list-1">
<div class="u-container-style u-list-item u-repeater-item u-white u-list-item-1">
<div class="u-container-layout u-similar-container u-valign-top-lg u-valign-top-md u-valign-top-sm u-valign-top-xl u-container-layout-1">
<p class="u-text u-text-3">In order to run the games offline (if they don't require an active Internet connection), you need to create a local server.</p>
<p class="u-text u-text-3">1. <a href="https://www.ics.uci.edu/~pattis/common/handouts/pythoneclipsejava/python.html" target="_blank">Follow this guide to install Python</a>. Remember to choose "Add Python to PATH".</p>
<p class="u-text u-text-3">2. Open command prompt by clicking the Start button (or pressing the <kbd>Windows key</kbd> + <kbd>R</kbd>), then type <code><i>cmd</i></code>.<br />(Or install <a href="https://www.microsoft.com/en-us/p/windows-terminal/9n0dx20hk701" target="_blank">Windows Terminal</a> from Microsoft Store and search it in the Start menu on Windows 10/11.)</p><br/>
<img alt="" class="u-image-1" src="https://i.imgur.com/ITiQEcD.png">
<p class="u-text u-text-3">3. Visit <a href="https://archive.org/details/yell0wsuit-html5-games">this link</a> to download.</p>
<p class="u-text u-text-3">4. Extract the ZIP file to your favorite location, and copy/remember that location for the next step.</p>
<p class="u-text u-text-3">5. Back to command prompt. If the location is in the same drive as what's shown on the screen (C:\ for example), just type <code><i>cd [your location here]</i></code>. Otherwise, you need to type an extra command, <code><i>[drive name here without "\"]</i></code>. Example:</p><br/>
<img alt="" class="u-image-1" src="https://i.imgur.com/ZNYOB7Q.png">
<p class="u-text u-text-3">6. Enter <code><i>python -m http.server</i></code>. Wait until it shows <code>Serving HTTP on :: port 8000 (http://[::]:8000/) ...</code> (the port number may vary).</p>
<p class="u-text u-text-3">7. Visit <a href="http://localhost:8000">http://localhost:8000</a> (default) on your browser. It should be working now.</p>
</div>
</div>
</div>
<p class="u-text u-text-default u-text-3"><a href="index.html">Back to homepage</a></p>
<p class="u-text u-text-default u-text-1"></p>
</div>
</section>
</body>
</html>