srizan/archived-TwisterOS
1
0
Fork 0
mirror of https://github.com/SrIzan10/TwisterOS.git synced 2026-05-01 11:05:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Responsive Site Design

Browse Source
This commit is contained in:
phoenixbyrd
2020-11-01 17:12:29 -06:00
parent 1b0340ffa9
commit 69406549de
11 changed files with 730 additions and 634 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
TwisterOS_bak.tar.gz Normal file
View File

Binary file not shown.

126
about.html
View File

@@ -1,67 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<main class="about">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="center about">
<h3 class="">About Twister OS <span><h6 style="margin-top: -5px; margin-bottom: -20px;">A note from our founder</h6></span></h3>
<br>
<p>
Twister OS is the successor of Raspbian 95, Raspbian XP, Raspbian X, Raspbian X Nighthawk
and iRaspbian (The Last two being made by Grayduck) It was a personal project done by me, Salvador.
With the idea that the Raspian Pixel Desktop wasn't enough, I created Raspbian 95/XP. In terms of
productivity, XFCE was a much better desktop and adding some emulator would make make both worlds
(gaming and desktop) merged as one build. Twister OS is built on the official Raspbian Pi OS with
themes designed to appear like operating systems they are themed after, but they are no operating
systems by themselves. With that said, Software updates for Twister OS relies upon the Raspberry Pi
Foundation while internal changes to themes and included software are updated by us via patches.
</p>
<p>
The second and maybe most important part weren't the themes themselves (That Grayduck a friend I made
through this process and now copropietary of Pi Labs Youtube channel demonstrating all his assets doing
that part much better than I), but was Box86. Box86 is an emulator developed by ptitSeb that vanishes the
borders between ARM Linux and x86 Linux, being able to automatically execute (with some kind of success)
x86 Linux binaries and Wine x86 without any complex process like we suffer on other slow and painful
implimentations, like Exagear (not open sourced and abandoned) or Qemu with chroots and VM's.
</p>
<p>
Windows on ARM Operating System is another closed source non Linux way of running x86 software on
the Raspberry Pi 4. While it has a fast dynarec, it does everything through software and from my perspective
that's not a good approach, like it wasn't on Exagear. There is another thing, even with Microsoft getting
involved and making a driver for it, it would be limited to just the Raspberry Pi 4. Box86 and Linux can run
anywhere, especially with open source MESA drivers, it's not limited to just the Raspberry Pi 4. Box86 can run
on the Odroid N2, C4, any RK3399 and many other single board computers.
</p>
<p>
With the idea of being able to execute x86 software with a fast dynarec plus GPU acceleration opens the
future of cheap ARM linux handhelds or laptops that would be able to run x86 Linux and Windows software (with
Box86 and Wine x86). I would like to thank ptitSeb for his continuing development of Box86 and all the MESA
driver developers to keep working on GPU's that are really constrained on capabilities and giving them features that
weren't meant for them, especially on Panfrost. Grayduck, the artist behind Twister OS, and Phoenixbyrd to
the support on Discord and this official site.
</p>
<div align=right style="margin-top: 50px; margin-bottom: -25px;">Salvador.</div>
</div>
<div></div>
<div class="blurb center">
<h3 class="">About Twister OS <span><h6 style="margin-top: -1px; margin-bottom: -10px;">A note from our founder</h6></span></h3>
<br>
<p>
Twister OS is the successor of Raspbian 95, Raspbian XP, Raspbian X, Raspbian X Nighthawk
and iRaspbian (The Last two being made by Grayduck) It was a personal project done by me, Salvador.
With the idea that the Raspian Pixel Desktop wasn't enough, I created Raspbian 95/XP. In terms of
productivity, XFCE was a much better desktop and adding some emulator would make make both worlds
(gaming and desktop) merged as one build. Twister OS is built on the official Raspbian Pi OS with
themes designed to appear like operating systems they are themed after, but they are no operating
systems by themselves. With that said, Software updates for Twister OS relies upon the Raspberry Pi
Foundation while internal changes to themes and included software are updated by us via patches.
</p>
<p>
The second and maybe most important part weren't the themes themselves (That Grayduck a friend I made
through this process and now copropietary of Pi Labs Youtube channel demonstrating all his assets doing
that part much better than I), but was Box86. Box86 is an emulator developed by ptitSeb that vanishes the
borders between ARM Linux and x86 Linux, being able to automatically execute (with some kind of success)
x86 Linux binaries and Wine x86 without any complex process like we suffer on other slow and painful
implimentations, like Exagear (not open sourced and abandoned) or Qemu with chroots and VM's.
</p>
<p>
Windows on ARM Operating System is another closed source non Linux way of running x86 software on
the Raspberry Pi 4. While it has a fast dynarec, it does everything through software and from my perspective
that's not a good approach, like it wasn't on Exagear. There is another thing, even with Microsoft getting
involved and making a driver for it, it would be limited to just the Raspberry Pi 4. Box86 and Linux can run
anywhere, especially with open source MESA drivers, it's not limited to just the Raspberry Pi 4. Box86 can run
on the Odroid N2, C4, any RK3399 and many other single board computers.
</p>
<p>
With the idea of being able to execute x86 software with a fast dynarec plus GPU acceleration opens the
future of cheap ARM linux handhelds or laptops that would be able to run x86 Linux and Windows software (with
Box86 and Wine x86). I would like to thank ptitSeb for his continuing development of Box86 and all the MESA
driver developers to keep working on GPU's that are really constrained on capabilities and giving them features that
weren't meant for them, especially on Panfrost. Grayduck, the artist behind Twister OS, and Phoenixbyrd to
the support on Discord and this official site.
</p>
<div align=right style="margin-top: 25px; ">Salvador.</div>
<footer><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<div class="center" style="align-items: center;">
<ul class="sites">
<li><a href="https://www.youtube.com/channel/UCgfQjdc5RceRlTGfuthBs7g"><img src="images/PiLabs.png" width="200px"></a></li>
<li><a href="https://github.com/ptitSeb/box86"><img src="images/Box86Logo.png" width="200px"></a></li>
<li><a href="https://github.com/Jack477/CommanderPi"><img src="images/CPiTitle.png" width="300px"></a></li>
</ul>
</div>
</div>
<div></div>
<footer style="margin-top: 75px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
</body>
</html>

3
carousel.css
View File

@@ -3,7 +3,8 @@
position:relative;
width:800px;
margin:0 auto;
margin-top: 50px;
margin-top: 25px;
margin-bottom: -20px;
}
.carousel-item{
position:absolute;

62
download.html
View File

@@ -1,42 +1,46 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="DownloadPOS">
<main class="download">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="TwisterOS">
<img class="center" src="images/TwisterOSLogo-Large-New3.png">
<br>
<a href="twisteros.html"><p>For Raspberry Pi</p></a>
<div class="left">
<div class="center twister">
<div class="box">
<img src="./images/TwisterOSLogo-Large-New3.png" />
<a href="twisteros.html"><p>For Raspberry Pi 4</p></a>
</div>
</div>
</div>
<div class="TwisterUI">
<img class="center" src="images/TwisterSpinsLogo-Large.png">
<br>
<a href="twisterui.html"><p>For Additional Hardware</p></a>
</div>
<div class="right">
<div class="center twister">
<div class="box extrapad">
<img src="./images/TwisterSpinsLogo-Large.png" />
<a href="twisterui.html"><p>For Additional Hardware</p></a>
</div>
</div>
</div>
<footer><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<footer style="margin-top: 275px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
</body>
</html>

161
faq.html
View File

@@ -1,107 +1,92 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<main class="faq">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="center" style="margin-bottom: 100px;">
<div></div>
<div>
<div class="faqheader">Frequently Asked Questions</div>
<div class="questions center">
<h3>What is the password?</h3>
<p>The default password is raspberry</p>
<p>Please change your password by opening terminal and entering <span class="code">passwd</span></p>
<p>Please also change your root password. <span class="code">sudo passwd</span></p>
<div class="faqHeader" style="text-align: center; margin-bottom: 75px; margin-top: 100px; font-size: 24px; font-weight: bold;">Frequently Asked Questions</div>
<h3>Will This Run On My Pi 3B+</h3>
<p>While Twister OS will install on the 3B+ it is not recomended. Twister OS was designed and built around the Pi4 and you may experience issues installing on the 3B+.</p>
<h3>Is Twister OS a 64-bit OS?</h3>
<p>Twister OS is a 32-bit OS.</p>
<h4 >
<a href="#">What is the password?</a>
</h4>
<p>The default password is raspberry</p>
<p>Please change your password by opening terminal and entering <span class="code">passwd</span></p>
<p>Please also change your root password. <span class="code">sudo passwd</span></p>
<h3>How do I patch Twister OS?</h3>
<ul class="faq-small">
<li>Download the patch you need</li>
<li>Open File Manager and navigate to Downloads</li>
<li>Right click on the patch zip file and choose extract here</li>
<li>Open the patch folder that was just created</li>
<li>Now right click a blank spot inside the folder and choose open terminal here</li>
<li>Once terminal opens type ./ followed by the .sh file name inside the current directory</li>
<li>Quick trick, you can type the first character and hit the tab key to autocomplete the filename.</li>
<li>Hit the ENTER key to begin the patch process</li>
<li>When upgrading please patch in order. Patch 1.0 to 1.1 to 1.2 to 1.3 etc.</li>
</ul>
<h4>
<a href="#">Will This Run On My Pi 3B+</a>
</h4>
<p>While Twister OS will install on the 3B+ it is not recomended. Twister OS was designed and built around the Pi4 and you may experience issues installing on the 3B+.</p>
<h4>
<a href="#">Is Twister OS a 64-bit OS?</a>
</h4>
<p>Twister OS is a 32-bit OS.</p>
<h3>Where is Play on Linux?</h3>
<p>playonlinux was removed due to too many complaints that not a lot was working with it. You can reinstall with sudo apt install playonlinux && sudo apt remove wine You need to remove wine because playonlinux will install the arm version which will conflict with x86 version of wine.</p>
<h3>Where can I download wine?</h3>
<p>Download Wine <a class="here" href="https://twisteros.com/wine.tgz"><button>HERE</button></a></p>
<p>To use, extract wine.tgz and run the wine binary from wine/bin</p>
<p>For example, if extracted to home directory you would run this in terminal</p>
<span class="code">~/wine/bin/wine path/to/your/game.exe</span>
<h4 >
<a href="#">How do I patch Twister OS?</a>
</h4>
<ul class="faq-small">
<li>Download the patch you need</li>
<li>Open File Manager and navigate to Downloads</li>
<li>Right click on the patch zip file and choose extract here</li>
<li>Open the patch folder that was just created</li>
<li>Now right click a blank spot inside the folder and choose open terminal here</li>
<li>Once terminal opens type ./ followed by the .sh file name inside the current directory</li>
<li>Quick trick, you can type the first character and hit the tab key to autocomplete the filename.</li>
<li>Hit the ENTER key to begin the patch process</li>
<li>When upgrading please patch in order. Patch 1.0 to 1.1 to 1.2 to 1.3 etc.</li>
</ul>
<h3>Why is Steam not starting for me?</h3>
<p>If Steam doesn't start for you, please update Box86 from the "Games" menu and try again. Please also note that Steam is experimental, and may have issues from time-to-time</p>
<h3>Bluetooth audio is not working!</h3>
<p>We are aware of this issue and are looking for a workaround. If you are experiencing issues with bluetooth audio then it is currently advised to leave audio settings alone for the time being.</p>
<h4>
<a href="#">Where is Play on Linux?</a>
</h4>
<p>playonlinux was removed due to too many complaints that not a lot was working with it. You can reinstall with sudo apt install playonlinux && sudo apt remove wine You need to remove wine because playonlinux will install the arm version which will conflict with x86 version of wine.</p>
<h4>
<a href="#">Where can I download wine?</a>
</h4>
<p>Download Wine <a class="here" style="font-weight: bold;" href="https://twisteros.com/wine.tgz">HERE</a></p>
<p>To use, extract wine.tgz and run the wine binary from wine/bin</p>
<p>For example, if extracted to home directory you would run this in terminal</p>
<span class="code">~/wine/bin/wine path/to/your/game.exe</span>
<h3>How do I reset my theme?</h3>
<p>Open terminal and enter</p> <span class="code">/usr/share/ThemeSwitcher/Backup/./restore-original-config.sh</span>
<p>This will reset your theme back to default settings.</p>
<h4>
<a href="#">Why is Steam not starting for me?</a>
</h4>
<p>If Steam doesn't start for you, please update Box86 from the "Games" menu and try again. Please also note that Steam is experimental, and may have issues from time-to-time</p>
<h4>
<a href="#">Bluetooth audio is not working!</a>
</h4>
<p>We are aware of this issue and are looking for a workaround. If you are experiencing issues with bluetooth audio then it is currently advised to leave audio settings alone for the time being.</p>
<h3>I created a new user but the themes will not display!</h3>
<p>Twister OS themes are hardcoded to the user pi and will not work under other user profiles.</p>
<h4>
<a href="#">How do I reset my theme?</a>
</h4>
<p>Open terminal and enter <span class="code">/usr/share/ThemeSwitcher/Backup/./restore-original-config.sh</span></p>
<p>This will reset your theme back to default settings.</p>
<h4>
<a href="#">Some icons on my panel/taskbar are missing!</a>
</h4>
<p>Open terminal and enter <span class="code">./.panel-restart</span></p>
<p>This will refresh your panel/taskbar and should show missing items again. If this does not help then please request further help on discord.</p>
<h4>
<a href="#">Why does retropie ask me to log in?</a>
</h4>
<p>You must have disabled auto-login
If that's the case, you'll just need to hit "enter" when taken to the console prompt. It'll tell you "invalid login" or something to that effect
Then, when prompted, enter "pi" as the username, and "raspberry" as the password (or whatever you've changed the pi account password to)
Press Ctrl+Alt+F7 to return to the desktop, and then you'll be able to launch RetroPie by just double-clicking on the icon</p>
<h3>Some icons on my panel/taskbar are missing!</h3>
<p>Open terminal and enter <span class="code">./.panel-restart</span></p>
<p>This will refresh your panel/taskbar and should show missing items again. If this does not help then please request further help on discord.</p>
<h3>Why does retropie ask me to log in?</h3>
<p>You must have disabled auto-login
If that's the case, you'll just need to hit "enter" when taken to the console prompt. It'll tell you "invalid login" or something to that effect
Then, when prompted, enter "pi" as the username, and "raspberry" as the password (or whatever you've changed the pi account password to)
Press Ctrl+Alt+F7 to return to the desktop, and then you'll be able to launch RetroPie by just double-clicking on the icon</p>
</div>
</div>
</div>
<div></div>
<footer><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<footer style="margin-top: 50px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
</body>
</html>

155
index.html
View File

@@ -1,87 +1,98 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<link rel="stylesheet" href="./carousel.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="carousel-wrapper">
<span id="item-1"></span>
<span id="item-2"></span>
<span id="item-3"></span>
<span id="item-4"></span>
<span id="item-5"></span>
<span id="item-6"></span>
<span id="item-7"></span>
<span id="item-8"></span>
<div class="carousel-item item-1">
<a class="arrow arrow-prev" href="#item-8"></a>
<a class="arrow arrow-next" href="#item-2"></a>
</div>
<div class="carousel-item item-2">
<a class="arrow arrow-prev" href="#item-1"></a>
<a class="arrow arrow-next" href="#item-3"></a>
</div>
<div class="carousel-item item-3">
<a class="arrow arrow-prev" href="#item-2"></a>
<a class="arrow arrow-next" href="#item-4"></a>
<main class="index">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<div class="carousel-item item-4">
<a class="arrow arrow-prev" href="#item-3"></a>
<a class="arrow arrow-next" href="#item-5"></a>
</div>
<div></div>
<div class="carousel">
<div class="carousel-wrapper">
<span id="item-1"></span>
<span id="item-2"></span>
<span id="item-3"></span>
<span id="item-4"></span>
<span id="item-5"></span>
<span id="item-6"></span>
<span id="item-7"></span>
<span id="item-8"></span>
<div class="carousel-item item-5">
<a class="arrow arrow-prev" href="#item-4"></a>
<a class="arrow arrow-next" href="#item-6"></a>
</div>
<div class="carousel-item item-1">
<a class="arrow arrow-prev" href="#item-8"></a>
<a class="arrow arrow-next" href="#item-2"></a>
</div>
<div class="carousel-item item-2">
<a class="arrow arrow-prev" href="#item-1"></a>
<a class="arrow arrow-next" href="#item-3"></a>
</div>
<div class="carousel-item item-3">
<a class="arrow arrow-prev" href="#item-2"></a>
<a class="arrow arrow-next" href="#item-4"></a>
</div>
<div class="carousel-item item-6">
<a class="arrow arrow-prev" href="#item-5"></a>
<a class="arrow arrow-next" href="#item-7"></a>
</div>
<div class="carousel-item item-4">
<a class="arrow arrow-prev" href="#item-3"></a>
<a class="arrow arrow-next" href="#item-5"></a>
</div>
<div class="carousel-item item-7">
<a class="arrow arrow-prev" href="#item-6"></a>
<a class="arrow arrow-next" href="#item-8"></a>
</div>
<div class="carousel-item item-5">
<a class="arrow arrow-prev" href="#item-4"></a>
<a class="arrow arrow-next" href="#item-6"></a>
</div>
<div class="carousel-item item-8">
<a class="arrow arrow-prev" href="#item-7"></a>
<a class="arrow arrow-next" href="#item-1"></a>
</div>
</div>
<div class="carousel-item item-6">
<a class="arrow arrow-prev" href="#item-5"></a>
<a class="arrow arrow-next" href="#item-7"></a>
</div>
<img src="images/HowDoYouPi.png" style="width: 700px;" class="center">
<br>
<div class="center">
<ul class="links">
<li><a href="https://github.com/ptitSeb/box86"><img src="images/Box86Logo.png" width="200px"></a></li>
<li><a href="https://www.youtube.com/channel/UCgfQjdc5RceRlTGfuthBs7g"><img src="images/PiLabs.png" width="200px"></a></li>
<li><a href="https://github.com/Jack477/CommanderPi"><img src="images/CPiTitle.png" width="300px"></a></li>
</ul>
</div>
<footer><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<div class="carousel-item item-7">
<a class="arrow arrow-prev" href="#item-6"></a>
<a class="arrow arrow-next" href="#item-8"></a>
</div>
<div class="carousel-item item-8">
<a class="arrow arrow-prev" href="#item-7"></a>
<a class="arrow arrow-next" href="#item-1"></a>
</div>
</div>
</div>
<div></div>
<div></div>
<div class="howpi">
<img class="center" src="./images/HowDoYouPi.png" width="700vw" />
</div>
<div></div>
<div></div>
<div class="advert">
<p>Twister OS for Raspberry Pi 4 &amp; Twister UI for Additional Hardware</p>
<p>Enjoy the same experience on all supported devices.</p>
</div>
<div></div>
<footer style="margin-top: 38px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
</body>
</html>

25
shell.html
View File

@@ -1,25 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<script src="https://kit.fontawesome.com/913306d3d3.js" crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Twister OS</title>
</head>
<body>
<nav class="nav_background">
<div class="logo"><img src="images/TwisterOSLogo-Large-New3.png"></div>
<div class="menu">
<a href="index.html">HOME</a>
<a href="downloads.html">DOWNLOAD</a>
<a href="about.html">ABOUT</a>
<a href="faq.html">FAQ</a>
<a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a>
</div>
</nav>
<br>
<main>
</main>
<footer><p>Twister OS 2020 | <a href="#" target="_blank">Join our Discord!</a></p><p style="font-size: smaller; margin-top: -10px;">Site by: James Gundlach <a href="https://github.com/phoenixbyrd" style="color: antiquewhite; margin-left: 2px; margin-right: 2px;"><i class="fab fa-github"></i></a> | Email: <a href="mailto: james.gundlach79@gmail.com" style="font-size: small;">james.gundlach79@gmail.com</a></p></footer>
</body>
</html>

347
style.css Normal file
View File

@@ -0,0 +1,347 @@
/** All Pages **/
body, html {
background-color: #2D2C8A;
color: antiquewhite;
font-family: sans-serif;
}
.nav {
grid-area: nav;
top: 0;
width: 95%;
margin-left: auto;
margin-right: auto;
}
.nav img {
width: 25vw;
}
nav ul {
list-style: none;
float: right;
}
nav li {
display: inline;
margin-right: 20px;
font-weight: bold;
font-size: 20px;
color: #FACF46;
cursor: pointer;
margin-top: 50px;
}
nav li:hover {
opacity: 0.8;
}
a {
color: #FACF46;
text-decoration: none;
font-size: 20px;
font-weight: bold;
}
.center {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 50px;
width: 100%;
}
.code {
background-color: #332929;
opacity: .9;
width: auto;
text-align: center;
padding: 5px 10px;
border-radius: 5px;
color: whitesmoke;
line-height: 1.5em;
box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.2), 0 5px 10px 0 rgba(0, 0, 0, 0.19);
}
button {
border-radius: 5px;
background-color: #FACF46;
border-style: none;
padding: 5px 10px;
font-size: 20px;
font-weight: bold;
color: #2D2C8A;
margin-right: 20px;
cursor: pointer;
box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.2), 0 5px 10px 0 rgba(0, 0, 0, 0.19);
}
button:hover {
opacity: 0.8;
}
footer {
grid-area: footer;
position: relative;
bottom: 0;
margin: auto;
width: 100%;
text-align: center;
}
footer a {
font-weight: bold;
font-size: 18px;
}
footer a:hover {
opacity: 0.8;
}
/** Index Page **/
.index {
height: 100vh;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
"nav nav nav"
". carousel ."
". howpi ."
". advert ."
"footer footer footer";
}
.howpi img {
width: 40vw;
}
.advert {
color: #FACF46;
font-size: 18px;
font-weight: bold;
text-align: center;
}
/** Download Page **/
.download {
height: 100vh;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
grid-template-areas:
"nav nav"
"left right"
"footer footer";
}
.left {
grid-area: left;
text-align: center;
}
.right {
grid-area: right;
text-align: center;
}
.twister {
color: #FACF46;
font-size: 18px;
font-weight: bold;
}
.twister img {
width: 25vw;
}
.twister p {
cursor: pointer;
}
.twister p:hover {
opacity: 0.8;
}
.box {
border-style: solid;
border-color: #8789d9;
padding: 20px;
margin-left: 50px;
margin-right: 50px;
}
.extrapad {
padding: 22px !important;
}
/** Twister OS Download Page **/
.twisteros {
height: 100vh;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"nav nav"
"left right"
"footer footer";
}
.current-release {
width: 25%;
margin-left: 75px;
}
.current-links {
float: right;
margin-right: 50px;
margin-top: -50px;
}
.PatchLink {
list-style: none;
display: inline-block;
width: 100%;
margin-left: 50px;
}
.PatchLink li {
float: left;
margin-left: 50px;
margin-right: 125px;
margin-top: 10px;
}
.ChangelogLink {
color: #FACF46;
cursor: pointer;
font-weight: bold;
}
.btn {
margin-top: -2px;
}
.resize {
width: 30%;
margin-top: 50px;
}
.popup {
z-index: 9;
position: fixed;
top:50%;
left:50%;
transform:translate(-50%, -50%);
display:none;
background:darkslategrey;
color:antiquewhite;
padding:20px;
border-radius: 5px;
box-shadow: 0 5px 5px 5px rgba(0, 0, 0, 0.2), 0 5px 10px 0 rgba(0, 0, 0, 0.19);
line-height: 1.8em;
}
.close {
color: darkslategrey;
font-weight: bold;
text-align: center;
background-color: #FACF46;
width: 100px;
padding: 5px;
border-radius: 5px;
margin: auto;
}
/** Twister UI Download Page **/
.twisterui {
height: 100vh;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
grid-template-areas:
"nav nav"
"left right"
"footer footer";
}
/** About Page **/
.about {
height: 100vh;
display: grid;
grid-template-rows: 1fr 1fr 1fr;
grid-template-areas:
"nav nav"
"blurb blurb"
"footer footer";
}
.blurb {
width: 60%;
line-height: 1.5em;
text-align: justify;
}
ul {
list-style: none;
}
ul li {
display: inline;
margin-left: 25px;
margin-right: 25px;
}
.sites {
margin-left: auto;
margin-right: auto;
width: 80%;
}
/** FAQ Page **/
.faq {
height: 100vh;
display: grid;
grid-template-rows: 1fr 1fr 1fr;
grid-template-areas:
"nav nav"
"questions questions"
"footer footer";
}
.faqheader {
text-align: center;
margin-bottom: 75px;
margin-top: 50px;
font-size: 24px;
font-weight: bold;
}
.questions {
width: 60%;
text-align: justify;
}
h3 {
color: #FACF46;
font-weight: bold;
}

250
styles.css
View File

@@ -1,250 +0,0 @@
body, html {
background-color: #2D2C8A;
color: antiquewhite;
font-family: sans-serif;
}
nav {
width: 100%;
margin: auto;
}
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
.centerUI {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
a {
color: #FACF46;
text-decoration: none;
}
nav img {
margin-right: 48%;
margin-left: 1%;
}
nav ul {
list-style: none;
display: inline-block;
}
nav li {
float: left;
margin-left: 20px;
font-weight: bold;
font-size: 20px;
}
nav li:hover {
opacity: 0.8;
}
.links {
list-style: none;
display: inline-block;
margin-bottom: 50px;
}
.links li {
float: left;
margin-left: 25px;
margin-right: 25px;
margin-top: 10px;
margin-bottom: 10px;
}
footer {
position: relative;
bottom: 0;
margin: auto;
width: 100%;
text-align: center;
background-color: #2D2C8A;
}
footer a {
font-weight: bold;
font-size: 18px;
}
.about {
line-height: 1.8em;
text-align: justify;
margin-top: 75px;
margin-bottom: 50px;
width: 60%;
}
.code {
background-color: #332929;
opacity: .8;
width: auto;
text-align: center;
padding: 5px;
border-radius: 5px;
color: antiquewhite;
}
button {
border-radius: 5px;
background-color: #FACF46;
border-style: none;
padding: 10px;
font-size: 15px;
font-weight: bold;
color: #2D2C8A;
margin-right: 20px;
cursor: pointer;
}
.current-release {
width: 25%;
margin-left: 75px;
}
.current-links {
float: right;
margin-right: 50px;
margin-top: -50px;
}
.PatchLink {
list-style: none;
display: inline-block;
width: 100%;
margin-left: 50px;
}
.PatchLink li {
float: left;
margin-left: 75px;
margin-right: 100px;
margin-top: 10px;
}
.ChangelogLink {
color: #FACF46;
cursor: pointer;
font-weight: bold;
margin-top: -15px;
}
button:hover {
opacity: 0.8;
}
.popup {
z-index: 9;
position: fixed;
top:50%;
left:50%;
transform:translate(-50%, -50%);
display:none;
background:darkslategrey;
color:antiquewhite;
padding:20px;
border-radius: 5px;
box-shadow: 0 5px 5px 5px rgba(0, 0, 0, 0.2), 0 5px 10px 0 rgba(0, 0, 0, 0.19);
line-height: 1.8em;
}
.close {
color: darkslategrey;
font-weight: bold;
text-align: center;
background-color: #FACF46;
width: 100px;
padding: 5px;
border-radius: 5px;
margin: auto;
}
.resize {
width: 30%;
margin-top: 50px;
}
.here:hover {
opacity: 0.8;
cursor: pointer;
}
.downloads {
overflow: hidden;
margin-top: 200px;
margin-bottom: 250px;
}
.DownloadsUI {
list-style: none;
margin-bottom: 50px;
}
.DownloadsUI li {
float: left;
margin-bottom: 50px;
}
.DownloadPOS {
margin: 250px 200px 390px 300px;
}
.TwisterOS {
border-style: solid;
border-color: #8789d9;
padding: 20px;
display: inline;
float: left;
margin: auto;
margin-right: 50px;
overflow: hidden;
width: 40%;
list-style: none;
}
.TwisterUI {
border-style: solid;
border-color: #8789d9;
padding: 22px;
margin: auto;
margin-left: 50px;
overflow: hidden;
width: 40%;
list-style: none;
}
.TwisterOS p {
text-align: center;
font-weight: bold;
font-size: 20px;
}
.TwisterUI p {
text-align: center;
font-weight: bold;
font-size: 20px;
}
.TwisterOS p:hover {
opacity: 0.8;
}
.TwisterUI p:hover {
opacity: 0.8;
}

45
twisteros.html
View File

@@ -1,28 +1,30 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<main class="downloads">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<img class="center resize" src="images/TwisterOSLogo-Large-New3.png">
<div></div>
<div>
<img class="center resize" src="images/TwisterOSLogo-Large-New3.png">
<div class="center" style="width: 60% !important; margin-top: 100px;">
<div class="current-release">
@@ -41,7 +43,7 @@
<div style="width: 60%; margin: auto;" class="center">
<p class="center" style="line-height: 1.5em; width: 80%;">To determine which version of Twister OS you're currently using, check the README file on the Desktop. For version 1.5.2 and newer, simply open a terminal and type <span class="code">twistver</span></p>
<p style="text-align: center; text-decoration: underline;">Please patch in order, do not skip patches.</p>
<h4 class="center">To download Twister OS updater copy the following into terminal.</h4>
<h4 style="text-align: center;">To download Twister OS updater copy the following into terminal.</h4>
<span class="code center" style="width: 60%;">wget https://raw.githubusercontent.com/FlameKat53/Twister-OS-Patcher/master/install.sh && chmod +x ./install.sh && ./install.sh && rm install.sh</span>
</div>
<br><br>
@@ -343,8 +345,11 @@
<br>
</div>
</div>
<div></div>
<footer><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<footer style="margin-top: 50px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$('.btn').click(function(){

190
twisterui.html
View File

@@ -1,112 +1,118 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="carousel.css">
<link rel="icon" href="favicon.png">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie-edge" />
<link rel="stylesheet" href="./style.css" />
<title>Twister OS</title>
</head>
<body>
<div class="container">
<nav>
<img src="images/TwisterOSLogo-Large-New3.png" style="width: 400px;">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<main class="downloads">
<div class="nav">
<nav>
<img src="./images/TwisterOSLogo-Large-New3.png" />
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="download.html">DOWNLOADS</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="https://checkout.square.site/merchant/ML5E5KGWRH8ME/checkout/GLDTDH4U5ZXZY5WJCCVEWIK7">DONATE</a></li>
</ul>
</nav>
</div>
<img class="center resize" src="images/TwisterUILogo-Large.png">
<div></div>
<div>
<img class="center resize" src="images/TwisterUILogo-Large.png">
<div class="center" style="width: 60% !important; margin-top: 100px;">
<div class="current-release">
<h1 style="width: 100%;">Current Release</h1>
<h3>Twister UI 1.0.3</h3>
</div>
<div class="current-links">
<a href="https://archive.org/download/twister-uiv-1-0-3-install/TwisterUIv1-0-3Install.run"><button>DOWNLOAD</button></a>
<a href="https://archive.org/download/twister-uiv-1-0-3-install/twister-uiv-1-0-3-install_archive.torrent"><button>TORRENT</button></a>
</div>
<br><br>
</div>
<div class="center" style="width: 60%; margin-top: 100px;">
<div class="current-release">
<h1 style="width: 100%;">Current Release</h1>
<h3>Twister UI 1.0.3</h3>
</div>
<div class="center">
<p style="width: 60%; text-align: center; margin-left: 175px; margin-top: 50px;">Twister UI is a user interface add-on for Linux Mint and Xubuntu. It includes themes, applications, and configurations to match the user experience found in Twister OS on the Raspberry Pi.</p>
<br>
<p style="text-align: center; font-weight: bold;">To install Twister UI:</p><br><br>
<ol style="width: 100%;">
<li>Download and install the 64-bit version of either <a href="https://linuxmint.com/download.php">Linux Mint Xfce</a> or <a href="https://xubuntu.org/download">Xubuntu</a></li>
<br>
<li>Download and run the Twister UI installer</li>
<br>
<li>When using Linux Mint Xfce, you will need to make changes to the following settings after the Twister UI installation has been completed:
<br>
<ul>
<br>
<li>In “Application Menu -> Settings -> Desktop,” under the “Icons” tab, uncheck “Use custom font size”</li>
<br>
<li>In “Application Menu -> Settings -> Window Manager Tweaks,” under the “Compositor” tab, uncheck “Show shadows under dock windows”</li>
</ul>
</li>
</ol>
</div>
<div class="current-links">
<a href="https://archive.org/download/twister-uiv-1-0-3-install/TwisterUIv1-0-3Install.run"><button>DOWNLOAD</button></a>
<a href="https://archive.org/download/twister-uiv-1-0-3-install/twister-uiv-1-0-3-install_archive.torrent"><button>TORRENT</button></a>
</div>
<br><br>
<p style="text-align: center; ">Twister UI is a user interface add-on for Linux Mint and Xubuntu. It includes themes, applications, and configurations to match the user experience found in Twister OS on the Raspberry Pi.</p>
<br>
<p style="text-align: center; font-weight: bold;">To install Twister UI:</p>
<p style="text-align: center; font-weight: bold;">Please first backup your system proir to installing!</p>
<ol class="center">
<li>Download and install the 64-bit version of either <a href="https://linuxmint.com/download.php">Linux Mint Xfce</a> or <a href="https://xubuntu.org/download">Xubuntu</a></li>
<br>
<li>Download and run the Twister UI installer</li>
<br>
<li>When using Linux Mint Xfce, you will need to make changes to the following settings after the Twister UI installation has been completed:
<br>
<ul>
<br>
<li>In “Application Menu -> Settings -> Desktop,” under the “Icons” tab, uncheck “Use custom font size”</li>
<br>
<li>In “Application Menu -> Settings -> Window Manager Tweaks,” under the “Compositor” tab, uncheck “Show shadows under dock windows”</li>
</ul>
</li>
</ol>
<p style="margin-top: 75px; margin-bottom: 50px; font-weight: bold; font-size: 20px; text-align: center;">PATCHES</p>
<p style="margin-top: 75px; margin-bottom: 50px; font-weight: bold; font-size: 20px; text-align: center;">PATCHES</p>
<div class="center" style="width: 60%; margin-bottom: 50px;">
<p style="text-align: center; text-decoration: underline;">Please patch in order, do not skip patches.</p>
<h4 style="text-align: center;">To download Twister UI updater copy the following into terminal.</h4>
<span class="code center" style="">wget https://raw.githubusercontent.com/FlameKat53/Twister-UI-Patcher/main/install.sh && chmod +x ./install.sh && ./install.sh && rm install.sh</span>
</div>
<div class="center" style="width: 60%; margin-bottom: 50px;">
<p style="text-align: center; text-decoration: underline;">Please patch in order, do not skip patches.</p>
<h4 style="text-align: center;">To download Twister UI updater copy the following into terminal.</h4>
<span class="code center" style="width: 60%;">wget https://raw.githubusercontent.com/FlameKat53/Twister-UI-Patcher/main/install.sh && chmod +x ./install.sh && ./install.sh && rm install.sh</span>
</div>
<div style="margin-left: 75px;">
<ul class="PatchLink">
<li>Version 1.0.3</li>
<li>
<div class="ChangelogLink">
<div class="popup" id="popup103">
<p class="center">Version 1.0.3 patch notes:</p><br>
Moved Twister UI wallpaper to more standard location<br>
Fixed an issue where login sound would not play correctly on certain hardware<br>
Updated calculator icon for Raspbian X/Nighthawk themes<br>
Added support for additional display types in ThemeTwister to correctly change wallpaper<br><br>
<p class="close">close</p>
</div>
<p class="btn" data-popup="popup103">Changelog</p>
</div>
</li>
<li><a href="Patches/TwisterUIv1-0-3Patch.run"><button>DOWNLOAD</button></a></li>
</ul>
<div class="center" style="width: 50%;">
<ul class="PatchLink">
<li>Version 1.0.3</li>
<li>
<div class="ChangelogLink">
<div class="popup" id="popup103">
<p class="center">Version 1.0.3 patch notes:</p><br>
Moved Twister UI wallpaper to more standard location<br>
Fixed an issue where login sound would not play correctly on certain hardware<br>
Updated calculator icon for Raspbian X/Nighthawk themes<br>
Added support for additional display types in ThemeTwister to correctly change wallpaper<br><br>
<p class="close">close</p>
</div>
<p class="btn" data-popup="popup103">Changelog</p>
</div>
</li>
<li><a href="Patches/TwisterUIv1-0-3Patch.run"><button>DOWNLOAD</button></a></li>
</ul>
<br>
<br>
<ul class="PatchLink">
<li>Version 1.0.2</li>
<li>
<div class="ChangelogLink">
<div class="popup" id="popup102">
<p class="center">Version 1.0.2 patch notes:</p><br>
Fixed an issue where the Calendar and Contacts apps would not launch from Plank<br>
Removed non-functional Dynamic Wallpaper shortcut<br><br>
<p class="close">close</p>
</div>
<p class="btn" data-popup="popup102">Changelog</p>
</div>
</li>
<li><a href="Patches/TwisterUIv1-0-2Patch.run"><button>DOWNLOAD</button></a></li>
</ul>
<ul class="PatchLink">
<li>Version 1.0.2</li>
<li>
<div class="ChangelogLink">
<div class="popup" id="popup102">
<p class="center">Version 1.0.2 patch notes:</p><br>
Fixed an issue where the Calendar and Contacts apps would not launch from Plank<br>
Removed non-functional Dynamic Wallpaper shortcut<br><br>
<p class="close">close</p>
</div>
<p class="btn" data-popup="popup102">Changelog</p>
</div>
</li>
<li><a href="Patches/TwisterUIv1-0-2Patch.run"><button>DOWNLOAD</button></a></li>
</ul>
<br>
</div>
<br>
</div>
<footer style="margin-top: 100px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
<footer style="margin-top: 50px;"><p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu" target="_blank">Join our Discord!</a></p></footer>
</main>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$('.btn').click(function(){