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

yet another attempt at fixing stuff

Browse Source
This commit is contained in:
phoenixbyrd
2020-08-17 21:06:01 -05:00
parent 733b1636e3
commit 9457eb4411
6 changed files with 124 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
about.html
View File

@@ -7,8 +7,8 @@
<!--CSS-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<title>Twister OS</title>
<style>p {text-align: justify;}</style>
</head>
<body>
@@ -16,14 +16,14 @@
<div class="container">
<nav class="navbar navbar-expand-lg navbar-dark">
<!-- Navbar brand -->
<img src="images/TwisterOSLogo.png" class="img-fluid img" width="40%">
<img src="images/TwisterOSLogo.png" class="img-fluid" width="40%">
<!-- Collapse button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#basicExampleNav"
aria-controls="basicExampleNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Collapsible content -->
<div class="collapse navbar-collapse " id="basicExampleNav">
<div class="collapse navbar-collapse" id="basicExampleNav">
<!-- Links -->
<ul class="navbar-nav mr-auto">
<li class="nav-item">
@@ -33,20 +33,19 @@
<a class="nav-link" href="downloads.html">DOWNLOADS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">ABOUT</a>
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link mobilehidden" href="faq.html">FAQ</a>
<a class="nav-link" href="faq.html">FAQ</a>
</li>
<!-- Collapsible content -->
</nav>
</div>
<!--/.Navbar-->
<!--Content-->
<div class="container">
<h3 class="about">About Twister OS <span><h6>A note from our founder</h6></span></h3>
<h3 class="about">About Twister OS <span><h6>A note from our founder</h6></span></h3>
<p>
Twister OS is the successor of Raspbian 95, Raspbian XP, Raspbian X, Raspbian X Nighthawk
@@ -83,15 +82,14 @@
the support on Discord and this official site.
</p>
<div align=right>Salvador.</div>
</div>
</div>
<!--/.Content-->
<!-- Footer -->
<footer>
<footer >
<p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu">Join us on Discord!</a></p>
</footer>
<!--/.Footer -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>

10
downloads.html
View File

@@ -33,7 +33,7 @@
<a class="nav-link" href="downloads.html">DOWNLOADS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">ABOUT</a>
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link mobilehidden" href="faq.html">FAQ</a>
@@ -285,15 +285,15 @@
</div>
</main>
<div class="container ver-info">
<p style="text-align: justify;">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 "twistver". When upgrading please patch in order. Patch 1.0 to 1.1 to 1.2 to 1.3 etc.</p>
<p>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 "twistver"</p>
</div>
<!--/.Content-->
<!-- Footer -->
<footer class="page-footer">
<div class="text-center py-3">
<footer >
<p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu">Join us on Discord!</a></p>
</div>
</footer>
<!--/.Footer -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>

16
faq.html
View File

@@ -34,8 +34,8 @@
<a class="nav-link" href="downloads.html">DOWNLOADS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link" href="faq.html">FAQ</a>
</li>
@@ -111,9 +111,7 @@
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading p-3 mb-3" role="tab" id="heading4">
<h3 class="panel-title">
@@ -139,8 +137,6 @@
</div>
</div>
</div>
</div>
</section>
@@ -148,10 +144,10 @@
<!--/.Content-->
<!-- Footer -->
<footer class="page-footer footer-faq">
<div class="text-center py-3">
<footer >
<p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu">Join us on Discord!</a></p>
</div>
</footer>
<!--/.Footer -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>

33
index.html
View File

@@ -11,9 +11,9 @@
<title>Twister OS</title>
</head>
<body>
<!--Navbar-->
<div class="container">
<nav class="navbar navbar-expand-lg navbar-dark">
<!-- Navbar brand -->
<img src="images/TwisterOSLogo.png" class="img-fluid" width="40%">
@@ -33,7 +33,7 @@
<a class="nav-link" href="downloads.html">DOWNLOADS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">ABOUT</a>
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link mobilehidden" href="faq.html">FAQ</a>
@@ -41,20 +41,18 @@
</ul>
<!-- Collapsible content -->
</nav>
</div>
<!--/.Navbar-->
<!--Content-->
<!--Mobile Only-->
<div class="mobileShow">
<img src="images/twisteros.png" class="img-fluid">
<div class="dltoday mobile">
<div class="center">Download Twister OS</div>
<div class="center">Available for Raspberry Pi 4</div>
<div class="center">Password is raspberry</div>
<div class="dltoday">
<div class="center mobile">Download Twister OS</div>
<div class="center mobile">Available for Raspberry Pi 4</div>
</div>
</div>
<main>
<!--Carousel-->
<div class="container center mobilehidden">
<div class="row">
@@ -113,31 +111,30 @@
</div>
<!--Partner Logo's-->
<div class="container mobilehidden landscape">
<div class="container mobilehidden">
<div class="row">
<div class="col-sm-4 logo center">
<a href="https://github.com/ptitSeb/box86" target="_blank"><img class="img-fluid" src="images/Box86Logo.png" alt="Box86 Logo" data-toggle="tooltip" data-placement="top" title="Get Box86 from Github and start playing some of your old favorites today!"></a>
<img src="images/Box86Logo.png" alt="Box86 Logo">
</div>
<div class="col-sm-4 logo center">
<a href="https://www.youtube.com/channel/UCgfQjdc5RceRlTGfuthBs7g" target="_blank"><img class="img-fluid" src="images/PiLabs.png" alt="Pi Labs Logo" data-toggle="tooltip" data-placement="top" title="Catch the latest Twister OS updates and more on Pi Labs Youtube channel!"></a>
<img src="images/PiLabs.png" alt="Pi Labs Logo">
</div>
<div class="col-sm-4 logo center">
<a href="https://github.com/Jack477/CommanderPi" target="_blank"><img class="img-fluid" src="images/CPiTitle.png" alt="Commander PI Logo" data-toggle="tooltip" data-placement="top" title="Take control of your Pi4 with Commander Pi! Available for download at Github!"></a>
<img src="images/CPiTitle.png" alt="Commander PI Logo">
</div>
</div>
</div>
<!--/.Content-->
</main>
<!-- Footer -->
<footer class="page-footer">
<div class="text-center py-3">
<footer >
<p>Twister OS 2020 | <a href="https://discord.gg/Fh8sjmu">Join us on Discord!</a></p>
</div>
</footer>
<!--/.Footer -->
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</body>
</html>
</html>

11
shell.html
View File

@@ -26,16 +26,13 @@
<!-- Links -->
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">HOME</a>
<a class="nav-link" href="#">HOME</a>
</li>
<li class="nav-item">
<a class="nav-link" href="downloads.html">DOWNLOADS</a>
<a class="nav-link" href="#">DOWNLOADS</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link" href="faq.html">FAQ</a>
<a class="nav-link" href="#">FAQ</a>
</li>
<!-- Collapsible content -->
</nav>
@@ -43,7 +40,7 @@
<!--/.Navbar-->
<!--Content-->
<!--/.Content-->
<!-- Footer -->

189
style.css
View File

@@ -1,97 +1,94 @@
/* Target Mobile */
@media screen and (max-width: 600px) {
.mobilehidden {
visibility: hidden;
clear: both;
display: none;
}
nav > img {
width: 80% !important;
margin-bottom: 20px;
margin-right: unset !important;
}
}
.mobileShow {display: none;}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
.mobilehidden {
visibility: hidden;
clear: both;
display: none;
}
nav > img {
width: 50% !important;
margin-bottom: 20px;
margin-right: 10% !important;
}
.mobileShow {
display: inline;
}
.mobile {
margin-top: 10%;
margin-bottom: -30%;
}
.mobileshow, img {
display: block;
margin-left: auto !important;
margin-right: auto !important;
margin-top: 5% !important;
width: 90% !important;
margin-bottom: 5% !important;
}
.howpi {
margin-bottom: 5% !important;
}
button {
margin-left: unset !important;
width: 100% !important;
}
.btn.current {
margin-left: 30%;
margin-bottom: 20px;
}
.navbar-toggler {
width: unset !important;
}
.ver-info {
width: 100% !important;
margin-top: 50px !important;
}
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){
.mobileShow {
display: inline;
}
.mobileshow, img {
display: block;
margin-left: auto !important;
margin-right: auto !important;
margin-top: 5% !important;
width: 90% !important;
margin-bottom: 10% !important;
}
.mobile {
margin-left: 20% !important;
width: 100% !important;
}
/* Target Landscap Mode */
.howpi {
margin-top: -15% !important;
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
nav > img {
width: 60% !important;
margin-left: 5% !important;
margin-right: 1% !important;
}
/* Styles */
}
nav > img {
width: 50% !important;
margin-bottom: 20px;
margin-right: 10% !important;
margin-left: 10% !important;
}
@media screen and (max-width: 600px) {
.btn.current {
margin-left: 30%;
margin-bottom: 20px;
}
.landscape {
margin-right: 20%;
}
}
.navbar-toggler {
width: unset !important;
}
@media screen and (min-width: 2560px) {
.center { /* Properly Display Carousel on ultrawide monitor */
h3 {
display: block;
margin-left: auto;
margin-right: auto;
width: 80% !important;
margin-top: 2%;
width: 100%;
}
.center, img {
margin-left: 7%;
h4 {
display: block;
margin-left: auto;
margin-right: auto;
width: 100%;
}
.ver-info {
width: 100% !important;
margin-top: 50px !important;
}
button {
margin-left: unset !important;
width: 100% !important;
}
li .nav-item {
font-size: 50px;
}
}
/***************************************************************************/
@@ -99,27 +96,15 @@
/* CSS - All Pages*/
html, body {
height: 100% !important;
background-color: #2D2C8A !important;
color: antiquewhite !important;
line-height: 1.8 !important;
}
nav {
width: 90%;
margin: auto;
}
ul li {
}
nav img {
float: left;
width: 25%;
margin-right: 50%;
nav > img {
margin-right: 35%;
margin-left: -5%;
}
a {
@@ -129,16 +114,6 @@ a {
text-decoration: none !important;
}
a:hover {
opacity: 0.8;
}
main {
width: 90%;
margin: auto;
margin-top: 50px;
}
footer p{
display: block;
position: fixed;
@@ -151,6 +126,7 @@ footer p{
background-color: #2D2C8B;
}
/* CSS - Index Page */
.center { /* Properly Display Carousel on the Page */
@@ -292,18 +268,19 @@ h2 {
margin-top: 9.5%;
}
/* CSS - About Page */
/* About CSS */
.about {
font-family: Arial, Verdana;
font-weight: 600;
color: antiquewhite;
text-transform: uppercase;
display: block;
width: 100%;
margin-bottom: 50px;
margin-top: 50px;
}
div p {
text-align: justify;
}