diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..dbe9c82 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.vscode/ \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..4e6e50c --- /dev/null +++ b/.prettierrc @@ -0,0 +1,4 @@ +{ + "printWidth": 110, + "tabWidth": 4 +} \ No newline at end of file diff --git a/404.html b/404.html deleted file mode 100644 index fc602aa..0000000 --- a/404.html +++ /dev/null @@ -1,58 +0,0 @@ - - - - - - - - - - 404 - AmogOS - - - - Our sussy bakas could not locate the requested page... Back to home in 5... -

404 404 404 404 404 404 404 404 404 404 404 404 404 404 040 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 420 404 404 404 404 404 404 404 404 404 404 404 040 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 690 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404 404

- - - diff --git a/LICENSE b/LICENSE index 6db91f0..6c4f812 100644 --- a/LICENSE +++ b/LICENSE @@ -1,32 +1,32 @@ -THE "Sussy Baka" LICENSE, VERSION 1 - -Copyright (c) 2021 Michael Zheng, Fengzi, and Moon1789. All rights reserved. - -Redistribution and use in binary form, with or without modification, are permitted provided that the following conditions are met: - - 1. Redistribution must reproduce the above copyright notice, this list of conditions and the following disclaimer - in the documentation and/or other materials provided with the distribution. - - 2. All advertising materials mentioning this website must display credits to either the Github page https://github.com/Amog-OS/AmogOS or website https://www.AmogOS.studio. - - 3. Neither the name of the copyright holder(s) nor the names of its contributors may be used to endorse or promote products derived - from this software without specific prior written permission. - - 4. Redistributions binary form shall be used for good, not evil. The definitions of "Good" and "Evil" are at the - sole discretion of the licensor. - - 5. Redistribution of any code must be free to download and use and cannot be sold in any way unless given written consent by the copyright holders. - - 6. All code used from this website must have explicit attribution to the original repository it was taken from. - -THIS SOFTWARE IS PROVIDED BY COPYRIGHT HOLDER "AS IS" AND ANY EXPRESS -OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED -WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL COPYRIGHT HOLDER BE LIABLE FOR -ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL -DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE -GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, -WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE -OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN - IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. +THE "Sussy Baka" LICENSE, VERSION 1 + +Copyright (c) 2021 Michael Zheng, Fengzi, and Moon1789. All rights reserved. + +Redistribution and use in binary form, with or without modification, are permitted provided that the following conditions are met: + + 1. Redistribution must reproduce the above copyright notice, this list of conditions and the following disclaimer + in the documentation and/or other materials provided with the distribution. + + 2. All advertising materials mentioning this website must display credits to either the Github page https://github.com/Amog-OS/AmogOS or website https://amog-os.github.io + + 3. Neither the name of the copyright holder(s) nor the names of its contributors may be used to endorse or promote products derived + from this software without specific prior written permission. + + 4. Redistributions binary form shall be used for good, not evil. The definitions of "Good" and "Evil" are at the + sole discretion of the licensor. + + 5. Redistribution of any code must be free to download and use and cannot be sold in any way unless given written consent by the copyright holders. + + 6. All code used from this website must have explicit attribution to the original repository it was taken from. + +THIS SOFTWARE IS PROVIDED BY COPYRIGHT HOLDER "AS IS" AND ANY EXPRESS +OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED +WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE +ARE DISCLAIMED. IN NO EVENT SHALL COPYRIGHT HOLDER BE LIABLE FOR +ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL +DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE +GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS +INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, +WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE +OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN + IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. diff --git a/README.md b/README.md index 8be6feb..ae2653b 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,14 @@ -# Official website for AmogOS - -## Credit -Originally made by Fengzi! `Disclaimer: Fengzi is not responsible for any changes beyond the original template.` - -Current maintenance mainly by Nooz - -(POWERRRR by Moon1789) - -### **Website link: https://amog-os.github.io/** +# Official website for AmogOS Toppat + +## Credit + +Original website for AmogOS 1 made by Fengzi! +`Disclaimer: Fengzi is not responsible for any changes beyond the original template.` + +New website for AmogOS 2 made by BeauTheBeau and Zaka + +Current maintenance mainly by Nooz + +(POWERRRR by Moon1789) + +### **Website link: [https://amog-os.github.io/](https://amog-os.github.io)** diff --git a/about.html b/about.html deleted file mode 100644 index e28b010..0000000 --- a/about.html +++ /dev/null @@ -1,96 +0,0 @@ - - - - - - - - - - - - - - - - - - About - AmogOS - - - -
-
- -
-
-

About AmogOS

-

Watch me explain why this OS is not an impostor.

-

Project Info

-

AmogOS, a custom riced meme OS inspired by a Reddit post. Initially made for the Raspberry Pi, based on RPi OS (RPi versions) and Debian (x86_64 versions).

-
-

Features:

-

Up-to-date features list is on our GitHub Readme page. (pwease wead it i spent lots of time puttting important info into it UwU)

-
-

Credits

-

Our Team

-

Moon Website

-

Founder, UI Developer

-

NoozAbooz Website

-

Main Developer, OS Packager

-

Peekatchoo

-

Original / Main Artist

-
-

Fengzi Website

-

Website Developer

-
-

Thanks to JoJo Autoboy, Fengzi, Dan2wik, Doc, Phene and Helena (/ussr/share) for helping us UwU.

-
-

Special Thanks

-

Among Us

-

The origin of the universe.

-

Jostro OS

-

Partner project of AmogOS. (and our original home!)

-

SomeOrdinaryGamers Youtube

-

Made a video that covered AmogOS and sent this to the moon.

-

TechHut Youtube

-

Also did a live stream / video cover of AmogOS.

-

Bringus Studios Youtube

-

-

All the open source projects included in this OS

-

Thank you!

-




-
- -
- - diff --git a/article.css b/article.css deleted file mode 100644 index 52e8067..0000000 --- a/article.css +++ /dev/null @@ -1,54 +0,0 @@ -#text-area{ - position: absolute; - top: 20vh; - padding-left: 18%; - padding-right: 18%; - font-family: sans-serif; -} -h1{ - font-family: "Poppins"; - margin-bottom: 3.75vh; - font-size: 36px; -} -h2{ - margin-bottom: 6vh; - font-size: 24px; -} -h3{ - margin-bottom: 7.5vh; - font-size: 18px; -} -p{ - margin-bottom: 3.75vh; - font-size: 18px; -} -span{ - background-color: #555555; -} -.notes{ - font-size: 16px; - font-style: italic; -} -#text-area a{ - color: #669999; - font-weight: 600; -} -#text-area a:hover{ - color: #66ddcc; -} -@media screen and (max-width: 620px) { - #text-area{ - top: 16vh; - } - h1{ - margin-bottom: 5.3vh; - font-size: 30px; - } - #description{ - display: none; - } - p{ - margin-bottom: 4vh; - font-size: 16px; - } -} \ No newline at end of file diff --git a/common.css b/common.css deleted file mode 100644 index c23d67f..0000000 --- a/common.css +++ /dev/null @@ -1,115 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap'); -*{ - margin: 0; -} -body{ - width: 100%; - background-color: #202225; - font-family: "Poppins"; - color: #ffffff; - /*overflow-x: hidden;*/ -} -a{ - text-decoration: none; - color: #ffffff; -} -a:hover{ - color: #66ddcc; -} -#wallpaper{ - position: fixed; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - background-size: cover; - background-repeat: no-repeat; - background-position: center center; -} -#main-container{ - width: 100vw; -} -header{ - position: fixed; - top: 0; - left: 0; - width: 100vw; - padding-left: 12%; - padding-right: 12%; - box-sizing: border-box; - background-color: transparent; - z-index: 2; -} -#bar{ - list-style: none; - text-align: right; -} -#nav-logo{ - transition: 0.3s ease; - margin-left: calc(6vh*-1); - margin-top: -6%; - width: 18vw; - height: 12vh; - background-image: url("icons/sus.png"); - background-size: contain; - background-repeat: no-repeat; - transform: scaleY(-1); - display: inline-block; -} -#nav-logo:hover{ - margin-top: 0; -} -#bar li:first-child{ - float: left; - padding: 0; -} -#bar li { - padding-top: calc(6vh - 18px); - display: inline-block; - padding-left: 3%; - font-size: 18px; -} -.now{ - color: #66ddcc; -} -#copyright{ - position: fixed; - bottom: 0; - margin: 0; - padding-bottom: 12px; - width: 100%; - box-sizing: border-box; - text-align: center; - font-size: 12px; - color: #eeeeee; - background-color: transparent; - z-index: 1; -} -::selection{ - background-color: transparent; - color: #66ddcc; -} -::-webkit-scrollbar { - display: none; -} -@media screen and (max-width: 850px) { - #bar li{ - padding-left: 2%; - font-size: 14px; - } - header, #copyright{ - background-color: rgba(32, 34, 37, 0.5); - } -} -@media screen and (max-width: 620px) { - #wallpaper{ - background-image: none; - } - /* #nav-logo{ - margin-top: 0; - } */ - #bar li{ - padding-left: 1%; - font-size: 12px; - } -} \ No newline at end of file diff --git a/credits.html b/credits.html new file mode 100644 index 0000000..131a7bc --- /dev/null +++ b/credits.html @@ -0,0 +1,154 @@ + + + + AmogOS Toppat | Now even more Sussy + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

What and who is AmogOS?

+

+ See the people and the story behind this + sussy wussy operating system +

+
+ +
+
+

What is AmogOS

+

+ This was mostly inspired by + this reddit post. AmogOS is a meme OS based on the hit game Among Us, in the same vein as Hannah Montana + Linux, but it's also developed and made to be a lightweight operating system. AmogOS is + also less bloated than some other distributions (cough cough + Ubuntu). Chad AmogOS vs bloated mainstream distro, as YouTuber TechHut put it. Don't take + this too seriously :p\n + - Nooz, Lead Dev +

+
+ +
+

Who is AmogOS

+
+
+ +

buddyjojo

+
OS developer
+

+ "creator of jostroOS, worli, some phone stuff, a bunch of random + stuff and the amogos overlord" +

+ +
+ +
+ +

Nooz

+
OS developer
+

No description provided

+ +
+ +
+ +

Fengzi

+
OS developer
+

"Hoi! Fengzi here/"

+ +
+ +
+ +

Beau

+
(Best) website developer
+ +

"Super cool front end developer"

+ +
+ +
+ +

Zaka

+
Website developer
+

"So, how's life, comrade?"

+ +
+
+ +

Full list of contributors

+ +
+ +
+
+
+ + diff --git a/css/buttons.css b/css/buttons.css new file mode 100644 index 0000000..a2810da --- /dev/null +++ b/css/buttons.css @@ -0,0 +1,149 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* Updated button styles */ +.buttons { + display: flex; + flex-direction: row; + gap: 1em; +} + +.input-row { + display: flex; + flex-direction: row; + gap: 0.2em; + align-items: center; + + :nth-child(odd), + :nth-child(even) { + flex: 1; + } + + :first-child { + border-radius: 1em 0.2em 0.2em 1em; + } + + :last-child { + border-radius: 0.2em 1em 1em 0.2em; + } + + :not(:first-child):not(:last-child) { + border-radius: 0.2em; + } +} + +input { + padding: 0.6em 1em; + border-radius: 1em; + font-size: 16px; + font-family: "Poppins", sans-serif; + font-weight: 500; + text-align: center; + border: 2px solid transparent; + transition: 0.3s; + background-color: var(--amog-green-transparent); + color: #000; + + &:hover, + &:focus { + background-color: transparent; + border: solid 2px var(--amog-green); + color: var(--amog-green); + + box-shadow: 0 0 0 1px var(--amog-green-transparent), 0 2px 4px var(--amog-green-transparent), + 0 4px 8px var(--amog-green-transparent), 0 8px 16px var(--amog-green-transparent), + 0 16px 32px var(--amog-green-transparent), 0 32px 64px var(--amog-green-transparent); + } +} + +button, +.button { + padding: 0.6em 1em; + border-radius: 1em; + font-size: 16px; + font-family: "Poppins", sans-serif; + font-weight: 500; + cursor: pointer; + text-align: center; + border: 2px solid transparent; + transition: 0.3s; +} + +.btn-prim, +.primary { + background-color: var(--amog-green); + color: #000; + + &:hover, + &:focus { + background-color: var(--amog-green-transparent); + border: solid 2px var(--amog-green); + color: var(--amog-green); + + box-shadow: 0 0 0 1px var(--amog-green-transparent), 0 2px 4px var(--amog-green-transparent), + 0 4px 8px var(--amog-green-transparent), 0 8px 16px var(--amog-green-transparent), + 0 16px 32px var(--amog-green-transparent), 0 32px 64px var(--amog-green-transparent); + } +} + +.btn-sec, +.secondary { + background-color: var(--amog-blue-transparent); + border: solid 2px var(--amog-blue); + color: var(--amog-blue); + + &:hover, + &:focus { + background-color: var(--amog-blue); + color: #000; + + box-shadow: 0 0 0 1px var(--amog-blue-transparent), 0 2px 4px var(--amog-blue-transparent), + 0 4px 8px var(--amog-blue-transparent), 0 8px 16px var(--amog-blue-transparent), + 0 16px 32px var(--amog-blue-transparent), 0 32px 64px var(--amog-blue-transparent); + } +} + +.btn-third, +.third { + background-color: var(--amog-black-transparent); + border: solid 2px var(--amog-black-plus); + color: #fff; + + &:hover, + &:focus { + background-color: var(--amog-black-plus); + + box-shadow: 0 0 0 1px var(--amog-kinda-black-transparent), + 0 2px 4px var(--amog-kinda-black-transparent), 0 4px 8px var(--amog-kinda-black-transparent), + 0 8px 16px var(--amog-kinda-black-transparent), 0 16px 32px var(--amog-kinda-black-transparent), + 0 32px 64px var(--amog-kinda-black-transparent); + } +} + +button, +.button, +a { + outline: 2px solid transparent; +} + +a { + color: var(--amog-green); + text-decoration: none; + font-weight: 900; + + &:focus, + &:focus-within { + outline: 2px solid var(--amog-highlight); + } +} + +a:hover, +a:focus, +a:active, +span { + color: var(--amog-blue); +} diff --git a/css/cascade-sus-sheets.css b/css/cascade-sus-sheets.css new file mode 100644 index 0000000..df28bbe --- /dev/null +++ b/css/cascade-sus-sheets.css @@ -0,0 +1,80 @@ +/* +haccing skill #2: view webpage's css files +*/ + +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* Base styles */ +@import "https://www.nerdfonts.com/assets/css/webfont.css"; + +/* Imports */ +@import url("variables.css"); /* Contains variables, predefined colors, etc... */ +@import url("buttons.css"); /* Contains .buttons, a, etc. */ +@import url("layout.css"); /* Contains body, main, section, hr, header, footer */ +@import url("navbar.css"); /* Contains nav, #menu, .overlay */ +@import url("contributors.css"); /* Contains .cool-boy, .boys */ +@import url("features.css"); /* Contains styles for features */ +@import url("sussify.css"); /* Contains specific styles for the downloads page */ +@import url("media-queries.css"); /* why each sussy display has a different size oh my lord */ +/* NOTE: keep media-queries.css as the LAST import, otherwise styles override themselves due to +CSS' cascade nature. */ + +/* Base styles */ +* { + transition: all 500ms cubic-bezier(0.6, 0, 0, 1); + scroll-behavior: smooth; + margin: 0; + padding: 0; + box-sizing: border-box; +} + +/* Misc */ +code { + font-family: "Fira Code", monospace; + background-color: var(--amog-black-transparent); + border-radius: 4px; + padding: 0.1em 0.5em; + border: solid 2px var(--amog-green-transparent); +} + +.download-list { + text-align: left; + display: flex; + flex-direction: column; +} + +.support { + width: calc(90% - 10px); + border-radius: 10px; + padding: 10px; + border: solid 4px var(--amog-green-transparent); +} + +#story .content { + width: calc(90% - 10px); + padding: 10px; + font-size: 20px; +} + +.animation { + opacity: 0; +} + +.scroll-animation { + opacity: 1; +} + +::-moz-selection { + background-color: #66ddcc10; + color: #66ddcc; +} + +::selection { + background-color: #66ddcc10; + color: #66ddcc; +} diff --git a/css/contributors.css b/css/contributors.css new file mode 100644 index 0000000..b5d7f3c --- /dev/null +++ b/css/contributors.css @@ -0,0 +1,121 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* contributors page */ +.boys { + width: 90%; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(256px, 1fr)); + gap: 10px; +} + +.cool-boy { + position: relative; + flex: 1; + display: flex; + flex-direction: column; + gap: 10px; + align-items: flex-start; + justify-content: flex-start; + text-align: left; + padding: 1em; + border-radius: 10px; + border: solid 2px var(--amog-green-transparent); + background-color: var(--amog-black-transparent); + overflow: hidden; + aspect-ratio: 1/1; + -webkit-animation: cool-boy-in 250ms cubic-bezier(0.6, 0, 0, 1); + animation: cool-boy-in 250ms cubic-bezier(0.6, 0, 0, 1); + + &.not1x1 { + aspect-ratio: unset; + } + + & a { + color: #fff; + font-size: 1.5em; + + &:hover { + color: var(--amog-blue); + } + } + + & .role { + background-color: var(--amog-green); + padding: 2px 10px; + border-radius: 6em; + font-size: 12px; + font-weight: 500; + color: var(--amog-black); + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + } + + & img { + top: 50%; + left: 50%; + transform: translate(-50%, -50%) scale(1.2); + filter: brightness(0.5) blur(4px) grayscale(1); + width: 100%; + position: absolute; + z-index: -1; + object-fit: cover; + } + + & .links { + display: flex; + flex-direction: row; + gap: 1em; + align-items: center; + justify-content: flex-start; + text-align: left; + } + + &:hover, + &:focus, + &:focus-within { + border: solid 2px var(--amog-green); + + & img { + filter: brightness(0.5) blur(2px) grayscale(0); + transform: translate(-50%, -50%) scale(1); + } + } +} + +@-webkit-keyframes cool-boy-in { + 0% { + opacity: 0; + transform: scale(1); + } + + 50% { + opacity: 1; + transform: scale(1.1); + } + + 100% { + transform: scale(1); + } +} + +@keyframes cool-boy-in { + 0% { + opacity: 0; + transform: scale(1); + } + + 50% { + opacity: 1; + transform: scale(1.1); + } + + 100% { + transform: scale(1); + } +} diff --git a/css/features.css b/css/features.css new file mode 100644 index 0000000..1553074 --- /dev/null +++ b/css/features.css @@ -0,0 +1,40 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* features of amog os, so cool */ +.feature { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + width: 90%; + gap: 20px; + background-color: var(--amog-black); + border-radius: 20px; + overflow: hidden; + + &:nth-child(odd) .lbl { + align-items: flex-end; + justify-content: flex-end; + text-align: right; + } +} + +.feature img { + width: 40%; +} + +.feature .lbl { + width: 60%; + display: flex; + flex-direction: column; + gap: 20px; + + align-items: flex-start; + justify-content: flex-start; + text-align: left; +} diff --git a/css/layout.css b/css/layout.css new file mode 100644 index 0000000..4bce48a --- /dev/null +++ b/css/layout.css @@ -0,0 +1,217 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* Misc. */ +body { + background-color: var(--amog-kinda-black); + color: #fff; + font-family: "Poppins", sans-serif; + display: flex; + flex-direction: column; + gap: 20px; + align-items: center; + justify-content: center; + overflow-x: hidden; +} + +main { + display: flex; + flex-direction: column; + gap: 20px; + align-items: center; + justify-content: center; + text-align: center; +} + +section { + text-align: center; + display: flex; + align-items: center; + justify-content: center; + gap: 20px; + flex-direction: column; + + width: 100vw; + max-width: 1280px; +} + +hr { + width: 90%; + height: 2px; + border: none; + border-radius: 10px; + background-image: linear-gradient(to bottom right, var(--amog-blue), var(--amog-green)); +} + +/* Header */ +header { + width: 100vw; + height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 20px; + background-image: url(../img/sus-on-moon.jpg); + background-position: 100% 50%; + background-size: cover; + box-shadow: 0 0 20px 0 #000; + text-align: center; + transition: unset; +} + +header h1 { + font-size: 70px; +} + +header h1 span { + font-size: 70px; + background-image: linear-gradient(to bottom right, var(--amog-green), var(--amog-blue)); + white-space: nowrap; + background-clip: text; + color: transparent; + -webkit-background-clip: text; +} + +.container { + position: relative; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +#toppat { + position: relative; + z-index: 2; + + & img { + width: 64px; + position: absolute; + top: -30px; + right: 50%; + z-index: -1; + transition: all 500ms cubic-bezier(0.6, 0, 0, 1); + } +} + +/* Footer */ +footer { + background: linear-gradient(to bottom right, var(--amog-blue-transparent), var(--amog-green-transparent)), + url("../img/airship.png"); + background-size: cover; + background-repeat: no-repeat; + background-position: 50% 50%; + border-radius: 2em; + padding: 0.5em; + width: calc(100vw - 4em); + max-width: 1200px; + margin: 2em; + + display: grid; + grid-template-areas: + "logo logo empty" + "text links social"; + gap: 0.25em; + + .footer__text { + -ms-grid-row: 3; + -ms-grid-column: 1; + grid-row: 3; + grid-column: 1; + -ms-grid-row: 3; + -ms-grid-column: 1; + grid-area: text; + font-size: 1rem; + font-weight: 500; + margin: 0; + } + + .logo { + -ms-grid-row: 1; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-row: 1; + grid-column: 1; + -ms-grid-row: 1; + -ms-grid-column: 1; + -ms-grid-column-span: 3; + grid-area: logo; + + & img { + background-color: var(--amog-black-less-transparent); + -webkit-backdrop-filter: blur(10px) brightness(75%); + backdrop-filter: blur(10px) brightness(75%); + padding: 0.5em 1em; + border-radius: 2em; + width: 100%; + max-width: 13em; + object-fit: cover; + position: relative; + top: 0; + left: 0; + } + } +} + +.footer__subsection { + background-color: var(--amog-black-less-transparent); + -webkit-backdrop-filter: blur(10px) brightness(75%); + backdrop-filter: blur(10px) brightness(75%); + display: flex; + flex-direction: column; + align-items: flex-start; + padding: 1em; + border-radius: 2em; + overflow: visible; + + &:nth-child(2) { + border-radius: 2em 0.5em 0.5em 2em; + } + + &:nth-child(3) { + border-radius: 0.5em; + } + + &:nth-child(4) { + border-radius: 0.5em 2em 2em 0.5em; + } +} + +.footer__links { + -ms-grid-row: 3; + -ms-grid-column: 3; + grid-row: 3; + grid-column: 3; + -ms-grid-row: 3; + -ms-grid-column: 3; + grid-area: links; +} + +/*since when CSS is like this?*/ + +.footer__link { + width: auto; + font-weight: 700; + color: var(--amog-green); + transition: all 0.25s cubic-bezier(0.6, 0, 0, 1); + + &:hover, + &:focus { + color: var(--amog-blue); + } +} + +.footer__social { + -ms-grid-row: 3; + -ms-grid-column: 5; + grid-row: 3; + grid-column: 3; + -ms-grid-row: 3; + -ms-grid-column: 5; + grid-area: social; +} diff --git a/css/media-queries.css b/css/media-queries.css new file mode 100644 index 0000000..b975e1b --- /dev/null +++ b/css/media-queries.css @@ -0,0 +1,142 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +@media prefers-reduced-motion { + * { + /*noinspection CssUnknownProperty*/ + transition: none !important; + scroll-behavior: auto !important; + } +} + +@media (max-width: 900px) { + footer { + grid-template-areas: + "logo" + "text" + "links" + "social"; + grid-template-columns: 1fr; + + .footer__subsection { + &:nth-child(2) { + border-radius: 2em 2em 0.5em 0.5em; + } + + &:nth-child(3) { + border-radius: 0.5em; + } + + &:nth-child(4) { + border-radius: 0.5em 0.5em 2em 2em; + } + } + } + + nav { + :not(:first-child) { + display: none; + } + + #menu { + position: fixed; + z-index: 100; + aspect-ratio: 1/1; + + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + float: right; + text-align: right; + } + + &.responsive { + & a { + display: block; + float: none; + text-align: left; + } + + & .overlay { + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + z-index: 1; + background-color: var(--amog-black-transparent); + -webkit-backdrop-filter: blur(8px); + backdrop-filter: blur(8px); + } + } + } + + header { + height: 60vh; + gap: 10px; + } + + button { + padding: 10px 30px; + border-radius: 15px; + } + + header h1, + header h1 span { + font-size: 40px; + } + + .buttons { + flex-direction: column; + gap: 10px; + + & .button, + & button { + flex: 1; + width: 100%; + } + } + + .feature { + flex-direction: column !important; + border-radius: 20px; + + & img, + & .lbl { + width: 100%; + } + + & .lbl { + justify-content: center; + justify-items: center; + align-items: center; + + & h1, + & p { + text-align: center; + width: 100%; + } + } + } + + /* by far not the best CSS, but it's sus and yet it somehow works */ + .alignCorrectlyIdiots { + flex-direction: column; + } + + .sussy-art-container, + .sussy-wussy-art { + margin-top: 20px; + position: static; + width: 100%; + height: auto; + object-fit: scale-down; + z-index: auto; + } +} diff --git a/css/navbar.css b/css/navbar.css new file mode 100644 index 0000000..6014764 --- /dev/null +++ b/css/navbar.css @@ -0,0 +1,61 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +nav { + position: fixed; + height: auto; + z-index: 69420; /* a. */ + padding: 4px; + + background-color: var(--amog-black-less-transparent); + -webkit-backdrop-filter: blur(8px) brightness(75%) saturate(150%) contrast(75%); + backdrop-filter: blur(8px) brightness(75%) saturate(150%) contrast(75%); + width: 100vw; + transition: top 0.3s; + + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 10px; + padding: 10px; + + & a { + font-weight: 400; + display: flex; + gap: 0.5em; + justify-content: center; + align-items: center; + + float: left; + color: #f2f2f2; + text-align: center; + padding: 0.5em 1em; + text-decoration: none; + overflow: hidden; + border-radius: 0.5em; + + &:first-child { + background: linear-gradient(to right, var(--amog-blue), var(--amog-green)); + color: black; + font-weight: 700; + } + + &:hover { + background-color: var(--amog-black-less-transparent); + } + } + + & #menu { + top: 6px; + right: 6px; + width: 36px; + float: right; + aspect-ratio: 1/1; + display: none; + } +} diff --git a/css/sussify.css b/css/sussify.css new file mode 100644 index 0000000..9431a85 --- /dev/null +++ b/css/sussify.css @@ -0,0 +1,40 @@ +/* +* Prefixed by https://autoprefixer.github.io +* PostCSS: v8.4.14, +* Autoprefixer: v10.4.7 +* Browsers: last 3 version,not dead,not op_mini all +*/ + +/* sussify, AKA making your pc sus, AKA downloads page */ + +/* +i admit this is not the best way to make the art fit, but well... +"if it works, don't touch it" - some wise developer, perchance. +*/ + +/* by far not the best CSS, but it's sus and yet it somehow works */ + +.alignCorrectlyIdiots { + display: flex; + flex-direction: row; + align-items: flex-start; + justify-content: flex-start; + text-align: left; + flex: 1; + max-width: 90%; + min-height: 450px; +} +.alignCorrectlyIdiots .idiot-container ul { + list-style-type: none; +} + +.alignCorrectlyIdiots .idiot-container ul li { + word-wrap: break-word; +} + +.sussy-art-container, +.sussy-wussy-art { + height: 400px; + right: 5%; + z-index: -1; +} diff --git a/css/variables.css b/css/variables.css new file mode 100644 index 0000000..2d950d7 --- /dev/null +++ b/css/variables.css @@ -0,0 +1,16 @@ +:root { + --amog-green: rgb(102, 221, 204); + --amog-green-transparent: rgba(102, 221, 204, 0.2); + --amog-blue: rgb(114, 137, 218); + --amog-blue-transparent: rgba(114, 137, 218, 0.2); + --amog-kinda-black: rgb(7, 10, 14); + --amog-kinda-black-transparent: rgba(7, 10, 14, 0.2); + --amog-black: rgb(13, 17, 23); + --amog-black-transparent: rgba(13, 17, 23, 0.2); + --amog-black-less-transparent: rgba(13, 17, 23, 0.5); + --amog-black-plus: rgb(22, 27, 34); /*i really like dark palettes*/ + + /* For accessibility - outline */ + --amog-highlight: rgb(255, 154, 0); + --amog-highlight-transparent: rgba(255, 0, 0, 0.2); +} diff --git a/donate.html b/donate.html deleted file mode 100644 index b842547..0000000 --- a/donate.html +++ /dev/null @@ -1,73 +0,0 @@ - - - - - - - - - - - - - - - - - - Donate - AmogOS - - - -
-
- -
-
-

Donate

-

Become a true sussy baka.

-

AmogOS is pretty much a joke project, but there are actual people that work on it.

-

If you liked the project, feel free to donate to support the team, or not.

-

You can donate with OpenCollective, which supports many popular payment methods. It also supports crypto in case you sit on a pile of NFTs... (they're bad)

- -


-
- -
- - diff --git a/download.html b/download.html new file mode 100644 index 0000000..0856f50 --- /dev/null +++ b/download.html @@ -0,0 +1,201 @@ + + + + + + + + Get AmogOS Toppat | Now even more Sussy + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Download AmogOS Toppat

+

Make your PC even sus

+
+
+
+
+

Downloads

+ +

+ More editions / flavors are Work In Progress.
+ The RPI edition reached EOL (End Of Life) and won't get further releases. + +

+
+
+
+
+ +
+

How to install:

+

Follow these steps to ensure you make your PC sus!

+
    +
  • You'll need an 8GB USB or more.
  • +
  • + STEP 1: Download a flashing software like Rufus (x64) or RPI + Imager (RPI) +
  • +
  • + STEP 2: Download your AmogOS file and flash it using your + program +
  • +
  • + STEP 2.1: Those using the VM file for x64 should boot the + vmdk in VirtualBox if possible +
  • +
  • + STEP 4: Boot your PC from the USB if you are on PC (either + using the bootloader or changing the boot order from the BIOS (putting the USB + first)) +
  • +
  • + STEP 5: A live version of AmogOS will boot, so you can try it + out and if you like it, you'll have there the final steps to make your PC sus +
  • +
  • STEP 6: Your PC is now sus. Enjoy.
  • +
+
+
+ AmogOS art + +

+ AmogOS-chan by + + xyriiel . No r34 yet (for now?!?!). +

+
+
+
+

Having trouble?

+ +
+
+ + diff --git a/downloads.html b/downloads.html deleted file mode 100644 index ca5385f..0000000 --- a/downloads.html +++ /dev/null @@ -1,140 +0,0 @@ - - - - - - - - - - - - - - - - - Downloads - AmogOS - - - -
-
- -

Choose your version.

-

Warning: By downloading AmogOS, you have severely increased the chance of being infected by the deadly AMOGID-16 virus.

-

Find out how to recover from it or head back.

-
-
-
-

x86_64 Version

-

v1.5.0

- x64 version Baka -

Username: amogos

-

Password: amogos

-
- - - -
-
-

RPI Version

-

v1.7.1

- RPI version Sussy -

Username: pi

-

Password: raspberry

-
- - -
-

w
We dont have an AmogOS-chan right now. So enjoy this.

-
-


-
- -
-
- -
- - - - diff --git a/startpage/AmongUs-Regular.ttf b/fonts/AmongUs-Regular.ttf similarity index 100% rename from startpage/AmongUs-Regular.ttf rename to fonts/AmongUs-Regular.ttf diff --git a/help.html b/help.html new file mode 100644 index 0000000..2e15c07 --- /dev/null +++ b/help.html @@ -0,0 +1,106 @@ + + + + AmogOS Toppat | Now even more Sussy + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

Need help?
We got ya' covered

+

Nothing will stop your PC from becoming a sussy baka

+
+
+
+
+

Support articles

+
+

Issue: AmogOS refuses to display anything

+

+ If the OS refuses to display anything, you may need to install AMD/NVIDIA GPU drivers + if you have one. Install it by SSHing into the OS with ssh amogos@AmogOS.local on a + linux computer on the same network at the AmogOS PC, then doing the following for AMD + GPUS sudo apt purge -y xserver-xorg-video-nouveau libdrm-nouveau2 && sudo apt install + -y firmware-amd-graphics libgl1-mesa-dri libglx-mesa0 mesa-vulkan-drivers + xserver-xorg-video-all (nouveau drivers for NVIDIA graphic cards are installed by + default) +

+
+
+

Issue: Non-straight display resolution

+

+ If the screen resolution looks wonky, click the "Display Settings" shortcut on the + desktop and change resolutions until you find one that works for you. Also note that + if the dock looks like it's positioning is broken, run plank --preferences in the + terminal and change the position to "Bottom". You can also set the alignment to + "Center" and manually change the spacing with the slider. +

+
+
+ +
+ +
+

Didn't find what you were looking for? Ask us!

+ Discord +
+ +
+ +

+ ⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⣤⣤⣤⣤⣤⣶⣦⣤⣄⡀⠀⠀⠀⠀⠀⠀⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣿⡿⠛⠉⠙⠛⠛⠛⠛⠻⢿⣿⣷⣤⡀⠀⠀⠀⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⠀⣼⣿⠋⠀⠀⠀⠀⠀⠀⠀⢀⣀⣀⠈⢻⣿⣿⡄⠀⠀⠀⠀ + ⠀⠀⠀⠀⠀⠀⠀⣸⣿⡏⠀⠀⠀⣠⣶⣾⣿⣿⣿⠿⠿⠿⢿⣿⣿⣿⣄⠀⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⣿⣿⠁⠀⠀⢰⣿⣿⣯⠁⠀⠀⠀⠀⠀⠀⠀⠈⠙⢿⣷⡄⠀ ⠀⠀⣀⣤⣴⣶⣶⣿⡟⠀⠀⠀⢸⣿⣿⣿⣆⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣷⠀ + ⠀⢰⣿⡟⠋⠉⣹⣿⡇⠀⠀⠀⠘⣿⣿⣿⣿⣷⣦⣤⣤⣤⣶⣶⣶⣶⣿⣿⣿⠀ ⠀⢸⣿⡇⠀⠀⣿⣿⡇⠀⠀⠀⠀⠹⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⣿⡿⠃⠀ ⠀⣸⣿⡇⠀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠉⠻⠿⣿⣿⣿⣿⡿⠿⠿⠛⢻⣿⡇⠀⠀ + ⠀⣿⣿⠁⠀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⣧⠀⠀ ⠀⣿⣿⠀⠀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⣿⠀⠀ ⠀⣿⣿⠀⠀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⣿⠀⠀ + ⠀⢿⣿⡆⠀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢸⣿⡇⠀⠀ ⠀⠸⣿⣧⡀⠀⣿⣿⡇⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣿⣿⠃⠀⠀ ⠀⠀⠛⢿⣿⣿⣿⣿⣇⠀⠀⠀⠀⠀⣰⣿⣿⣷⣶⣶⣶⣶⠶⠀⢠⣿⣿⠀⠀⠀ + ⠀⠀⠀⠀⠀⠀⠀⣿⣿⠀⠀⠀⠀⠀⣿⣿⡇⠀⣽⣿⡏⠁⠀⠀⢸⣿⡇⠀⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⣿⣿⠀⠀⠀⠀⠀⣿⣿⡇⠀⢹⣿⡆⠀⠀⠀⣸⣿⠇⠀⠀⠀ ⠀⠀⠀⠀⠀⠀⠀⢿⣿⣦⣄⣀⣠⣴⣿⣿⠁⠀⠈⠻⣿⣿⣿⣿⡿⠏⠀⠀⠀⠀ + ⠀⠀⠀⠀⠀⠀⠀⠈⠛⠻⠿⠿⠿⠿⠋⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀ +

+
+ + diff --git a/icons/Santa_hat.png b/icons/Santa_hat.png deleted file mode 100644 index 728c9e4..0000000 Binary files a/icons/Santa_hat.png and /dev/null differ diff --git a/icons/anime.png b/icons/anime.png deleted file mode 100644 index e0e4026..0000000 Binary files a/icons/anime.png and /dev/null differ diff --git a/icons/bg-1080p.jpg b/icons/bg-1080p.jpg deleted file mode 100644 index 4b2a1d4..0000000 Binary files a/icons/bg-1080p.jpg and /dev/null differ diff --git a/icons/bg-720p-progressive-christmas.jpg b/icons/bg-720p-progressive-christmas.jpg deleted file mode 100644 index aafa669..0000000 Binary files a/icons/bg-720p-progressive-christmas.jpg and /dev/null differ diff --git a/icons/bg-720p-progressive.jpg b/icons/bg-720p-progressive.jpg deleted file mode 100644 index a702bd9..0000000 Binary files a/icons/bg-720p-progressive.jpg and /dev/null differ diff --git a/icons/bg.png b/icons/bg.png deleted file mode 100644 index d82539f..0000000 Binary files a/icons/bg.png and /dev/null differ diff --git a/icons/download/RPI_direct.png b/icons/download/RPI_direct.png deleted file mode 100644 index 630b32f..0000000 Binary files a/icons/download/RPI_direct.png and /dev/null differ diff --git a/icons/download/RPI_torrent.png b/icons/download/RPI_torrent.png deleted file mode 100644 index 580d2db..0000000 Binary files a/icons/download/RPI_torrent.png and /dev/null differ diff --git a/icons/download/x64_direct.png b/icons/download/x64_direct.png deleted file mode 100644 index 67f60d1..0000000 Binary files a/icons/download/x64_direct.png and /dev/null differ diff --git a/icons/download/x64_torrent.png b/icons/download/x64_torrent.png deleted file mode 100644 index 805ee39..0000000 Binary files a/icons/download/x64_torrent.png and /dev/null differ diff --git a/icons/fongzoi.png b/icons/fongzoi.png deleted file mode 100644 index b70d306..0000000 Binary files a/icons/fongzoi.png and /dev/null differ diff --git a/icons/sus-christmas.ico b/icons/sus-christmas.ico deleted file mode 100644 index 28f1ce6..0000000 Binary files a/icons/sus-christmas.ico and /dev/null differ diff --git a/icons/sus-christmas.png b/icons/sus-christmas.png deleted file mode 100644 index 4ef075b..0000000 Binary files a/icons/sus-christmas.png and /dev/null differ diff --git a/icons/sus.ico b/icons/sus.ico deleted file mode 100644 index 12458a7..0000000 Binary files a/icons/sus.ico and /dev/null differ diff --git a/icons/webp/RPI_direct.webp b/icons/webp/RPI_direct.webp deleted file mode 100644 index 6822d40..0000000 Binary files a/icons/webp/RPI_direct.webp and /dev/null differ diff --git a/icons/webp/RPI_torrent.webp b/icons/webp/RPI_torrent.webp deleted file mode 100644 index 5700f07..0000000 Binary files a/icons/webp/RPI_torrent.webp and /dev/null differ diff --git a/icons/webp/bg.webp b/icons/webp/bg.webp deleted file mode 100644 index 2260001..0000000 Binary files a/icons/webp/bg.webp and /dev/null differ diff --git a/icons/webp/sus.webp b/icons/webp/sus.webp deleted file mode 100644 index bda40eb..0000000 Binary files a/icons/webp/sus.webp and /dev/null differ diff --git a/icons/webp/x64_direct.webp b/icons/webp/x64_direct.webp deleted file mode 100644 index 0db59bc..0000000 Binary files a/icons/webp/x64_direct.webp and /dev/null differ diff --git a/icons/webp/x64_torrent.webp b/icons/webp/x64_torrent.webp deleted file mode 100644 index a4968a9..0000000 Binary files a/icons/webp/x64_torrent.webp and /dev/null differ diff --git a/img/airship.png b/img/airship.png new file mode 100644 index 0000000..68e71b3 Binary files /dev/null and b/img/airship.png differ diff --git a/img/amogos-logo.png b/img/amogos-logo.png new file mode 100644 index 0000000..5763b9a Binary files /dev/null and b/img/amogos-logo.png differ diff --git a/img/amogos.png b/img/amogos.png new file mode 100644 index 0000000..de88c22 Binary files /dev/null and b/img/amogos.png differ diff --git a/img/banner.png b/img/banner.png new file mode 100644 index 0000000..aa50ecb Binary files /dev/null and b/img/banner.png differ diff --git a/img/features/Xfce.png b/img/features/Xfce.png new file mode 100644 index 0000000..1d7907c Binary files /dev/null and b/img/features/Xfce.png differ diff --git a/img/features/neofetch.png b/img/features/neofetch.png new file mode 100644 index 0000000..1f79bb0 Binary files /dev/null and b/img/features/neofetch.png differ diff --git a/img/features/wallpapers.png b/img/features/wallpapers.png new file mode 100644 index 0000000..235d0a8 Binary files /dev/null and b/img/features/wallpapers.png differ diff --git a/img/img.png b/img/img.png new file mode 100644 index 0000000..add2299 Binary files /dev/null and b/img/img.png differ diff --git a/img/sus-on-moon.jpg b/img/sus-on-moon.jpg new file mode 100644 index 0000000..b4faf18 Binary files /dev/null and b/img/sus-on-moon.jpg differ diff --git a/img/sus_art.png b/img/sus_art.png new file mode 100644 index 0000000..0bc68fc Binary files /dev/null and b/img/sus_art.png differ diff --git a/img/toppat-banner-light.png b/img/toppat-banner-light.png new file mode 100644 index 0000000..75a952c Binary files /dev/null and b/img/toppat-banner-light.png differ diff --git a/img/toppat-banner.png b/img/toppat-banner.png new file mode 100644 index 0000000..eacf31c Binary files /dev/null and b/img/toppat-banner.png differ diff --git a/img/toppat.png b/img/toppat.png new file mode 100644 index 0000000..7f9998f Binary files /dev/null and b/img/toppat.png differ diff --git a/icons/sus.png b/impostor.png similarity index 100% rename from icons/sus.png rename to impostor.png diff --git a/index.html b/index.html index c91cc67..c60dee0 100644 --- a/index.html +++ b/index.html @@ -1,194 +1,266 @@ - - - - - - - - - - - - - - - - - - AmogOS | Sussy wussy. - - - -
-
- -
-
-
- -
-
- A sus OS for aSUS computers -
-
-
- - - -
- -
- - - - - + + + + + + + + AmogOS Toppat | Now even more Sussy + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+

+ AmogOS + ToppatTop Hat +

+
+ + + +

+ The sus OS for sus computers is back, with more + sus than ever before. +

+
+ Explore AmogOS + Make your PC sus + What people say +
+
+ +
+
+

Reasons to make your computer sus

+
+ A screenshot of an AmogOS desktop with an Among Us character in the centre,
+            within a black circle. +
+

Custom AmogOS Wallpapers

+

+ AmogOS comes with a set of custom wallpapers, so you can make your desktop even + sussier! Check them out in ~/Pictures/.AmogOS/, or download them + here. +

+
+
+
+ A screenshot of an AmogOS desktop with an Among Us character in the centre,
+            within a black circle. +
+

Custom Neofetch

+

+ AmogOS comes with a custom Neofetch, so you can show off your sussy OS to your + friends! Check it out by running neofetch in the terminal. +

+
+
+
+ A screenshot of an AmogOS desktop with an Among Us character in the centre,
+            within a black circle. +
+

Epic Xfce

+

+ AmogOS uses the Xfce desktop environment, which is lightweight and easy to use. + It's also very customizable, so you can make it even more sussy! +

+
+
+
+ +
+ +
+

Let's make your PC sus

+

We've got different flavors for you to choose from. Find them all here:

+ Download AmogOS +
+ +
+ +
+

What people say about AmogOS

+ +
+
+ MattKC's YouTube profile picture. +

MattKC

+
American
+

"I found my new main OS"

+ +
+ +
+ TechHut's YouTube profile picture. +

TechHut

+
Also American
+

"Chad AmogOS vs bloated mainstream distro"

+ +
+ +
+ SomeOrdinaryGamers' YouTube profile picture. +

SomeOrdinaryGamers

+
Canadian
+

"sussy wussy"

+ +
+
+
+ +
+

Need help?

+ +
+
+ + + + diff --git a/install.html b/install.html deleted file mode 100644 index c3a9fab..0000000 --- a/install.html +++ /dev/null @@ -1,63 +0,0 @@ - - - - - - - - - - - - - - - - - - Install Instructions - AmogOS - - - -
-
- -
-
-

Install Instructions

-

How to make your device even more sus.

-

0. Please read the Installation Notes before making your device sus.

-

1. Download the latest files from the Downloads page for your CPU's architecture.

-

2. Flash the image to your device:

- -

-

3. Boot it up and it's done! Your device is now a sussy wussy baka!

-
-

If the OS won't boot, check out the Installation Notes and x64 Getting Started. If those still don't help you, why not drop by our Discord server for some help?

-




-
- -
- - diff --git a/js/aos.js b/js/aos.js new file mode 100644 index 0000000..da1453a --- /dev/null +++ b/js/aos.js @@ -0,0 +1,20 @@ +// aos (animate on sus) +const the_animation = document.querySelectorAll(".animation"); + +const observer = new IntersectionObserver( + (entries) => { + entries.forEach((entry) => { + if (entry.isIntersecting) { + entry.target.classList.add("scroll-animation"); + } else { + entry.target.classList.remove("scroll-animation"); + } + }); + }, + { threshold: 0.5 } +); +for (let i = 0; i < the_animation.length; i++) { + const elements = the_animation[i]; + + observer.observe(elements); +} diff --git a/js/elementConstructor.js b/js/elementConstructor.js new file mode 100644 index 0000000..2829b2b --- /dev/null +++ b/js/elementConstructor.js @@ -0,0 +1,144 @@ +/** + * @fileOverview Constructs repeated elements such as the header and footer. + */ + +const links = [ + { href: `./index.html`, name: `Home`, id: `home`, icon: "nf-md-home" }, + { + href: `./download.html`, + name: `Download`, + id: `downloads`, + icon: "nf-md-download", + }, + { href: `./help.html`, name: `Help`, id: `help`, icon: "nf-md-help" }, + { + href: `./credits.html`, + name: `Credits`, + id: `credits`, + icon: "nf-md-crowd", + }, + { + href: `https://opencollective.com/amogos`, + name: `Donate`, + id: `donate`, + icon: "nf-md-hand_heart", + }, +]; + +const socialLinks = [ + { + href: `https://discord.gg/z86muknm9y`, + name: `Discord`, + id: `discord`, + icon: "nf-md-discord", + }, + { + href: `https://github.com/amog-os/`, + name: `GitHub`, + id: `github`, + icon: "nf-md-github", + }, + { + href: `https://www.reddit.com/r/amogOS/`, + name: `Reddit`, + id: `reddit`, + icon: "nf-md-reddit", + }, +]; + +/** + * @name navConstructor + */ + +function navConstructor() { + const nav = document.createElement(`nav`); + nav.id = `navbar`; + nav.classList.add(`navbar`); + + const logo = document.createElement(`a`); + logo.href = `./index.html`; + logo.classList.add(`logo`); + logo.innerText = `AmogOS`; + nav.appendChild(logo); + + for (const link of links) { + if (link.id === `home`) continue; + const a = document.createElement(`a`); + a.href = link.href; + a.innerText = link.name; + a.id = link.id; + a.classList.add(`nav__link`); + + const icon = document.createElement(`i`); + icon.classList.add(`nf`, link.icon); + a.prepend(icon); + + nav.appendChild(a); + } + + const menu = document.createElement(`a`); + menu.id = `menu`; + menu.href = `javascript:void(0);`; + menu.onclick = () => { + if (nav.className === "navbar") nav.className += " responsive"; + else nav.className = "navbar"; + }; + + const menuIcon = document.createElement(`i`); + menuIcon.classList.add(`nf`, `nf-fa-bars`); + menu.appendChild(menuIcon); + + nav.append(menu); + document.body.prepend(nav); +} + +function createElement(tag, classes = [], content = "") { + const element = document.createElement(tag); + if (classes.length > 0) element.classList.add(...classes); + if (content) element.innerHTML = content; + return element; +} + +function createLink(link) { + const a = createElement("a", ["footer__link"]); + a.href = link.href; + a.innerText = link.name; + a.id = link.id; + return a; +} + +function footerConstructor() { + const footer = createElement("footer"); + + // noinspection HtmlUnknownTarget + footer.appendChild( + createElement( + "div", + ["logo"], + 'Logo' + ) + ); + + // noinspection HtmlUnknownTarget + const textContent = ` +

AmogOS Top HatToppat

+

The sus OS for sus computers is back, with more sus than ever before.

+

© AmogOS Project All suspiciousness reserved.

+ `; + const text = createElement("div", ["footer__text", "footer__subsection"], textContent); + + const linksContainer = createElement("div", ["footer__links", "footer__subsection"]); + linksContainer.appendChild(createElement("h2", [], "Links")); + links.forEach((link) => linksContainer.appendChild(createLink(link))); + + const social = createElement("div", ["footer__social", "footer__subsection"]); + social.appendChild(createElement("h2", [], "Social")); + + socialLinks.forEach((link) => social.appendChild(createLink(link))); + + footer.append(text, linksContainer, social); + document.body.appendChild(footer); +} + +navConstructor(); +footerConstructor(); diff --git a/js/getContributors.js b/js/getContributors.js new file mode 100644 index 0000000..3cc085c --- /dev/null +++ b/js/getContributors.js @@ -0,0 +1,203 @@ +/** + * @fileoverview This file contains the functions to get the contributors of the project for the + * contributors page + */ + +const githubApiUrl = `https://api.github.com`; +const CACHE_EXPIRATION_MS = 24 * 60 * 60 * 1000; // 24 hr + +/** + * waits for the specified amount of milliseconds, delaying whatever you do after + * + * @param {number} ms milliseconds + * @returns {Promise} + */ +function delay(ms) { + return new Promise((resolve) => setTimeout(resolve, ms)); +} + +/** + * @name getContributorExtraInfo + * @description This function gets the extra information of a contributor from the GitHub API + * @param {string} user Username of the contributor + * @param {?string} repo + * @returns {Promise} The extra information of the contributor + */ +async function getContributorExtraInfo(user, repo) { + const url = `${githubApiUrl}/users/${user}`; + const response = await fetch(url); + if (!response.ok) throw new Error(`Failed to fetch user ${user}: ${response.statusText}`); + const data = await response.json(); + if (repo) data.repo = repo; + return data; +} + +/** + * @name getContributors + * @description This function gets the contributors of the project from the GitHub API + * @param {string} org Parent organization of the repository + * @param {string} repo Repository name + * @returns {Promise} The contributors of the project + */ +async function getContributors(org, repo) { + try { + const url = `${githubApiUrl}/repos/${org}/${repo}/contributors`; + const response = await fetch(url, { + headers: { Accept: "application/vnd.github.v3+json" }, + }); + + const data = await response.json(); + + if (data.message && data.message.startsWith(`API rate limit exceeded`)) { + console.error(`Rate limit exceeded!`); + return []; + } + + for (let i = 0; i < data.length; i++) data[i].repo = repo; + return data; + } catch (e) { + console.error(`Error while checking rate limit: ${e}`); + } +} + +/** + * @name populateContributors + * @description This function populates the contributors page with the contributors of the project. + * Note that the client may be rate limited by the GitHub API. + * @returns {Promise} + */ +async function populateContributors() { + const organization = `Amog-OS`; + const repos = [`AmogOS`, `AmogOStopPat`, `AmogOS-Wallpapers`, `Amog-OS.github.io`]; + + /** + * @typedef {Object} contributor + * @property {string} avatar_url + * @property {string} login + * @property {string} html_url + * @property {"User" | "Contributor"} type + * @property {?string} blog + * @property {?string} bio + * @property {?string} repo + */ + + /** @type {contributor[]} */ + let contributors = []; + + for (let i = 0; i < repos.length; i++) { + const repo = repos[i]; + const repoContributors = await getContributors(organization, repo); + contributors = contributors.concat(repoContributors); + } + + const contributorsContainer = document.getElementById(`contributorsContainer`); + + if (!contributorsContainer) throw new Error("No contributorsContainer!"); + + for (let i = 0; i < contributors.length; i++) { + const contributorLogin = contributors[i].login; + if (!contributorLogin) continue; + /** @type {contributor} */ + let contributor = getCachedContributor(contributorLogin); + + if (!contributor) { + contributor = await getContributorExtraInfo(contributorLogin); + cacheContributor(contributorLogin, contributor); + } + + const coolBoi = document.createElement(`div`); + coolBoi.classList.add(`cool-boy`); + + const img = document.createElement(`img`); + img.src = contributor.avatar_url; + + const h1 = document.createElement(`h1`); + h1.innerText = contributor.login; + + const card = document.createElement(`div`); + card.classList.add(`role`); + card.innerText = contributor.type === `User` ? `Contributor` : contributor.type; + + // Add a role for repo the contributor has contributed to + if (contributor.repo) { + const repo = document.createElement(`div`); + repo.classList.add(`role`); + repo.innerText = contributor.repo; + card.appendChild(repo); + } + + const h3 = document.createElement(`p`); + h3.innerHTML = contributor.bio + ? `"${contributor.bio}"` + : `No bio provided`; + + const links = document.createElement(`div`); + links.classList.add(`links`); + + const ghLink = document.createElement(`a`); + ghLink.href = contributor.html_url; + + const githubIcon = document.createElement(`i`); + githubIcon.classList.add(`nf-fa-github`); + githubIcon.classList.add(`nf`); + ghLink.appendChild(githubIcon); + + const websiteLink = document.createElement(`a`); + if (contributor.blog) + websiteLink.href = contributor.blog.includes(`http`) + ? contributor.blog + : `https://${contributor.blog}`; + + const websiteIcon = document.createElement(`i`); + websiteIcon.classList.add(`nf-fa-link`); + websiteIcon.classList.add(`nf`); + websiteLink.appendChild(websiteIcon); + + links.appendChild(ghLink); + if (contributor.blog) links.appendChild(websiteLink); + + coolBoi.appendChild(img); + coolBoi.appendChild(h1); + coolBoi.appendChild(card); + coolBoi.appendChild(h3); + coolBoi.appendChild(links); + + // Append the coolBoi element after a delay of 150ms + await delay(150); + contributorsContainer.appendChild(coolBoi); + } +} + +function cacheContributor(login, data) { + const cacheData = { + data, + timestamp: Date.now(), + }; + + localStorage.setItem(`contributor_${login}`, JSON.stringify(cacheData)); +} + +/** + * gets an already cached contributor + * + * @param {string} login their login + * @returns {contributor} the contributor + */ +function getCachedContributor(login) { + const cachedData = localStorage.getItem(`contributor_${login}`); + + if (!cachedData) return null; + const { data, timestamp } = JSON.parse(cachedData); + const currentTime = Date.now(); + + if (currentTime - timestamp >= CACHE_EXPIRATION_MS) { + localStorage.removeItem(`contributor_${login}`); + return null; + } + + return data; +} + +populateContributors() + .then((_) => console.log(`Contributors populated!`)) + .catch((e) => console.error(`Error while populating contributors: ${e}`)); diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..7edfa63 --- /dev/null +++ b/js/main.js @@ -0,0 +1,31 @@ +/** + * @fileoverview Main JS file. + */ + +/** + * @description Navbar goes out of the screen when scrolling down and comes back when scrolling up. + * @param {HTMLElement} navbar - Navbar element. + */ +function navbarScroll(navbar) { + let prevScrollPos = window.pageYOffset; + + window.onscroll = function () { + const currentScrollPos = window.pageYOffset; + if (prevScrollPos > currentScrollPos) navbar.style.top = "0"; + else navbar.style.top = "-69px"; + prevScrollPos = currentScrollPos; + }; +} + +document.addEventListener("DOMContentLoaded", function () { + const navbar = document.querySelector("nav"); + navbarScroll(navbar); +}); + +const header = document.querySelector("header"); + +// As the user scrolls, keep the header background image in the same place +window.addEventListener("scroll", () => { + header.style.backgroundPositionY = window.scrollY / 4 + "px"; + header.style.filter = "blur(" + (1 - window.scrollY / 1000) + ")"; +}); diff --git a/rickroll.mp4 b/rickroll.mp4 deleted file mode 100644 index 4834c02..0000000 Binary files a/rickroll.mp4 and /dev/null differ diff --git a/rickroll.webm b/rickroll.webm new file mode 100644 index 0000000..0e146ce Binary files /dev/null and b/rickroll.webm differ diff --git a/robots.txt b/robots.txt deleted file mode 100644 index 182ec32..0000000 --- a/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -User-Agent: * -Disallow: -Sitemap: https://www.amog-os.github.io/sitemap.xml diff --git a/sitemap.xml b/sitemap.xml index 038b25f..2384d89 100644 --- a/sitemap.xml +++ b/sitemap.xml @@ -1,39 +1,38 @@ - - - - - https://amogos.studio/ - 2022-10-08T00:37:57+00:00 - monthly - 1.00 - - - https://amogos.studio/install - 2022-10-08T00:37:57+00:00 - monthly - 0.90 - - - https://amogos.studio/downloads - 2022-10-08T00:37:57+00:00 - weekly - 0.90 - - - https://amogos.studio/startpage/ - 2022-10-08T00:37:57+00:00 - never - 0.20 - - - https://amogos.studio/about - 2022-10-08T00:37:57+00:00 - yearly - 0 - - - + + + + + https://amog-os.github.io/ + 2022-10-08T00:37:57+00:00 + monthly + 1.00 + + + https://amog-os.github.io/install + 2022-10-08T00:37:57+00:00 + monthly + 0.90 + + + https://amog-os.github.io/downloads + 2022-10-08T00:37:57+00:00 + weekly + 0.90 + + + https://amog-os.github.io/startpage/ + 2022-10-08T00:37:57+00:00 + never + 0.20 + + + https://amog-os.github.io/about + 2022-10-08T00:37:57+00:00 + yearly + 0 + + + \ No newline at end of file diff --git a/startpage/index.html b/startpage/index.html index 49ab0f4..d568ae2 100644 --- a/startpage/index.html +++ b/startpage/index.html @@ -1,51 +1,291 @@ - - - - - - - Homepage - - - - - - - - - - - -
-
- -
-
- -
-
START
-
-
-
-
- -
-
-
-
-
quotes of the day
-
-
-
-
-
-
- - - + + + + + + + AmogOS Start Page + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+

+ AmogOS + StartTop Hat +

+

+ AmogOS is cool!! +

+ + + + +
+ + + + +
+ + diff --git a/startpage/script.js b/startpage/script.js deleted file mode 100644 index 2186459..0000000 --- a/startpage/script.js +++ /dev/null @@ -1,15 +0,0 @@ -const text = document.getElementById("text") -const button = document.getElementById("butoun") - -function randomQuote(){ - fetch('https://api.quotable.io/random') - .then(response => response.json()) - .then(data => { - text.textContent = data.content; - }); -} - -randomQuote(); -button.addEventListener('click' , () => { - randomQuote(); -}); \ No newline at end of file diff --git a/startpage/style.css b/startpage/style.css deleted file mode 100644 index cb85b09..0000000 --- a/startpage/style.css +++ /dev/null @@ -1,43 +0,0 @@ -html { - overflow: hidden; -} - -@font-face { - font-family: "amogos"; - src: url("AmongUs-Regular.ttf"); -} -body { - background-color: rgba(0, 0, 0, 0); - padding: 0; - margin: 0; - width: 100%; - height: 100%; - position: absolute; - background-image: url(https://bing.biturl.top/?resolution=1920&format=image&index=0&mkt=en-CA); - background-position: center; - background-repeat: no-repeat; - background-size: cover; -} -#yes { - font-family: amogos; - color: ivory; - font-size: 60px; -} -.shad { - background-color: rgba(0, 0, 0, 0.5); - width: 100vw; - height: 100vh; - margin: 0; -} -#wart { - color: azure; -} -#serch:hover { - box-shadow: 0 0 16px rgba(0, 0, 0, 0.555); -} -#text { - color: aliceblue; -} -#text1 { - color: aliceblue; -}