diff --git a/tools/website/assets/Background.png b/tools/website/assets/Background.png deleted file mode 100644 index 401e31e5..00000000 Binary files a/tools/website/assets/Background.png and /dev/null differ diff --git a/tools/website/css/style.css b/tools/website/css/style.css index 20398673..c55a9356 100644 --- a/tools/website/css/style.css +++ b/tools/website/css/style.css @@ -13,6 +13,23 @@ body { margin: 0; } +.background_main { + background-image: linear-gradient(121deg, rgb(0, 0, 0) 40%, rgb(72, 0, 140) 40%, rgb(0, 16, 80) 76%, rgb(72, 0, 0) 100%); + background-size: 400% 400%; + height: 100vh; + animation: gradient 4s ease-out; + animation-fill-mode: forwards; +} + +@keyframes gradient { + 0% { + background-position: 0% 50%; + } + + 100% { + background-position: 100% 50%; + } +} ::-webkit-scrollbar { width: 10px; @@ -88,7 +105,7 @@ body { } .button { - background-color: rgb(100, 0, 180, 0.5); + background-color: rgb(15, 15, 15, 0.1); /* #964caf; */ border: none; color: white; @@ -110,11 +127,10 @@ body { color: #f2f2f2; text-align: center; padding: 5px; - font-size: 35px; position: sticky; top: 0; z-index: 100; - backdrop-filter: blur(5px); + backdrop-filter: blur(10px); } footer { @@ -126,7 +142,7 @@ footer { bottom: 0; width: 100%; z-index: 104; - backdrop-filter: blur(5px); + backdrop-filter: blur(10px); } .round-border-low { @@ -142,14 +158,16 @@ footer { } .panel { - background: rgb(40, 40, 40, .8); - box-shadow: 1px 2px 3px 0px rgba(0, 0, 0, 0.80); - overflow: hidden; - backdrop-filter: blur(5px); + background: rgba(177, 177, 177, 0.2); + backdrop-filter: blur(40px); + box-shadow: 1px 1px 2px rgb(255, 255, 255), 0 0 0.2em rgb(0, 42, 167), 0 0 0.5em rgb(81, 0, 144); + border-radius: 4px; + padding-left: 4px; + padding-right: 4px; } #backToTopBtn { - backdrop-filter: blur(5px); + backdrop-filter: blur(10px); display: none; position: fixed; bottom: 20px; @@ -181,113 +199,16 @@ footer { background-size: cover; } -.wrapper { - background: rgb(255, 255, 255); - padding: 50px; - text-align: center; - background-attachment: fixed; - background-position: center; - background-repeat: no-repeat; - background-size: cover; -} - -.wrapper .icon { - position: relative; - background-color: #ffffff; - border-radius: 50%; - margin: 40px; - width: 100px; - height: 100px; - line-height: 50px; - font-size: 80px; - display: inline-block; - align-items: center; - box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1); - cursor: pointer; - transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55); - color: #333; - text-decoration: none; -} - -.wrapper .tooltip { - position: absolute; - top: 0; - line-height: 1.5; - font-size: 14px; - background-color: #ffffff; - color: #ffffff; - padding: 5px 8px; - border-radius: 5px; - box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1); - opacity: 0; - pointer-events: none; - transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); -} - -.wrapper .tooltip::before { - position: absolute; - content: ""; - height: 8px; - width: 8px; - background-color: #ffffff; - bottom: -3px; - left: 50%; - transform: translate(-50%) rotate(45deg); - transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); -} - -.wrapper .icon:hover .tooltip { - top: -45px; - opacity: 1; - visibility: visible; - pointer-events: auto; -} - -.wrapper .icon:hover span, -.wrapper .icon:hover .tooltip { - text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.1); -} - -.wrapper .whatsapp:hover, -.wrapper .whatsapp:hover .tooltip, -.wrapper .whatsapp:hover .tooltip::before { - background-color: #25D366; - color: #ffffff; -} - -.wrapper .twitter:hover, -.wrapper .twitter:hover .tooltip, -.wrapper .twitter:hover .tooltip::before { - background-color: #46c1f6; - color: #ffffff; -} - -.wrapper .instagram:hover, -.wrapper .instagram:hover .tooltip, -.wrapper .instagram:hover .tooltip::before { - background-color: #e1306c; - color: #ffffff; -} - -.wrapper .github:hover, -.wrapper .github:hover .tooltip, -.wrapper .github:hover .tooltip::before { - background-color: #333333; - color: #ffffff; -} - -.wrapper .youtube:hover, -.wrapper .youtube:hover .tooltip, -.wrapper .youtube:hover .tooltip::before { - background-color: #de463b; - color: #ffffff; -} - .gradienttext { color: #eee; text-transform: capitalize; background: linear-gradient(-45deg, #09f1b8, #00a2ff, #920077, #fed90f); background-size: 100% 100%; + background-clip: text; -webkit-background-clip: text; -webkit-text-stroke: 10px transparent; +} + +.glowtext { + text-shadow: 1px 1px 2px red, 0 0 2em rgb(0, 42, 167), 0 0 1.2em rgb(50, 0, 88); } \ No newline at end of file diff --git a/tools/website/index.html b/tools/website/index.html index 8dc0151d..9a2adef6 100644 --- a/tools/website/index.html +++ b/tools/website/index.html @@ -1,150 +1,175 @@ - Fennix Project + Fennix - -
-





-

Fennix Project

-

Operating System from scratch made in C and C++

- - -








-
- -
-
- GitHub Workflow Status - GitHub - GitHub repo size - GitHub Repo stars +
+
+

Fennix

+

Operating System from scratch made in C and C++

+ + +
+
+ +
+
+ GitHub Workflow Status + GitHub + GitHub repo size + GitHub Repo stars
-

About

- - - - - - -
- -
- Hello!
- This is my Operating System from scratch, my goal is to make a fully functional Operating System with a GUI and a lot of features.
- I'm working on this project alone, but I'm open to any kind of help, if you want to help me, you can contribute to the project on GitHub.
- I have a Discord server too →
+

About

+ + + + + + +
+ +
+
+ Hello!
+ This is my Operating System from scratch, my goal is to make a fully functional Operating System with a + GUI and a lot of features.
+ I'm working on this project alone, but I'm open to any kind of help, if you want to help me, you can + contribute to the project on GitHub.
+ I have a Discord server too →
+
+ +
+
+

Compiling Instructions

+
+

Requirements

+ First of all, you need to install the required packages to build the cross-compiler, bootloader, OS, + etc.
+
+ • Ubuntu 22.04
+ For cross-compiler:
+ sudo apt install build-essential bison flex libgmp3-dev libmpc-dev libmpfr-dev texinfo libzstd-dev libisl-dev autoconf m4 automake gettext gperf dejagnu guile-3.0 guile-3.0-dev expect tcl autogen tex-common sphinx-common git ssh diffutils patch +
+ For bootloader:
+ sudo apt-get install make gcc-mingw-w64-x86-64 gcc-mingw-w64-i686 mingw-w64 +
+ For QEMU you'll have to follow this page here
+ For OS:
+ sudo apt-get install xorriso mtools genisoimage ovmf nasm doxygen + +
+
+ +
+

Building The Cross-Compiler

+ The cross-compiler is used to compile the OS, the bootloader and the kernel.
+
+ All you have to do is to write this command in the terminal:
+ make tools
+ You'll have to wait a while, but when it's done, you can jump to the next step.
+
+ +
+

Configuring your kernel

+ If you want to build different architecture, use other QEMU binary or change kernel name you can find in + Makefile.conf file.
+
+ DEBUG • If it's set to 1, the kernel will + be compiled in debug mode.
+ TESTING • Enable unit testing.
+ OSNAME • The name of the kernel. This can be anything.
+ OSARCH • The architecture of the kernel. Supported values are: amd64 i686 aarch64.
+ KERNEL_VERSION • The version of the kernel. This can be anything.
+ BOOTLOADER • The bootloader to be used. If set to other, the bootloader will be Limine for 64-bit, + or with GRUB if 32-bit. lynx it's still under development.
+ COMPILER_PATH • The path of the cross compiler. If you want to use + your own cross compiler, change it to the path of the compiler.
+ LIMINE_FOLDER • The path of the Limine bootloader.
+ QEMU_PATH • Qemu path. If you want to use the one you have installed + in your system, change it to /usr/bin/qemu-system- (do not include x86_64 or i386, it will be added + automatically)
+ That's all you can change in this file.
+
+ +
+

Building The Operating System

+ The fun part!
+
+ Now that you have the cross-compiler, you can build the OS.
+ There are a few commands that you can use to compile the OS:
+ make build • Builds the entire OS and creates an ISO image.
+ make run • Same as make build but starts + the QEMU too.
+ make clean • Clean all files (object files, ISO, etc...).
+ make doxygen • Generate the documentation in directory doxygen-doc.
+
+
+ +
+

Running With Other Virtual Machines

+
+
+ • On VirtualBox and VMware, you can use the ISO image to run the OS.
+ • HDD/SSD are not required.
+ • The minimum RAM required is 4G. You can run with lower memory, but sometimes can cause issues + (I don't know why).
+ • UEFI required. BIOS sometimes doesn't work properly.
+ • Serial Port (COM1) is recommended.
+
+
+ +
+

Reporting Issues

+
+
+ You can report bugs or crash issues to Issues + tab.
+
+
+ + +
+

© EnderIce2

+ +
- -
-

Compiling Instructions

-
-

Requirements

- First of all, you need to install the required packages to build the cross-compiler, bootloader, OS, etc.
-
- • Ubuntu 22.04
- For cross-compiler:
- sudo apt install build-essential bison flex libgmp3-dev libmpc-dev libmpfr-dev texinfo libzstd-dev libisl-dev autoconf m4 automake gettext gperf dejagnu guile-3.0 guile-3.0-dev expect tcl autogen tex-common sphinx-common git ssh diffutils patch
- For bootloader:
- sudo apt-get install make gcc-mingw-w64-x86-64 gcc-mingw-w64-i686 mingw-w64
- For QEMU you'll have to follow this page here
- For OS:
- sudo apt-get install xorriso mtools genisoimage ovmf nasm doxygen
-
- -
-

Building The Cross-Compiler

- The cross-compiler is used to compile the OS, the bootloader and the kernel.
-
- All you have to do is to write this command in the terminal:
- make tools
- You'll have to wait a while, but when it's done, you can jump to the next step.
-
- -
-

Configuring your kernel

- If you want to build different architecture, use other QEMU binary or change kernel name you can find in Makefile.conf file.
-
- DEBUG • If it's set to 1, the kernel will be compiled in debug mode.
- TESTING • Enable unit testing.
- OSNAME • The name of the kernel. This can be anything.
- OSARCH • The architecture of the kernel. Supported values are: amd64 i686 aarch64.
- KERNEL_VERSION • The version of the kernel. This can be anything.
- BOOTLOADER • The bootloader to be used. If set to other, the bootloader will be Limine for 64-bit, - or with GRUB if 32-bit. lynx it's still under development.
- COMPILER_PATH • The path of the cross compiler. If you want to use your own cross compiler, change it to the path of the compiler.
- LIMINE_FOLDER • The path of the Limine bootloader.
- QEMU_PATH • Qemu path. If you want to use the one you have installed in your system, change it to /usr/bin/qemu-system- (do not include x86_64 or i386, it will be added automatically)
- That's all you can change in this file.
-
- -
-

Building The Operating System

- The fun part!
-
- Now that you have the cross-compiler, you can build the OS.
- There are a few commands that you can use to compile the OS:
- make build • Builds the entire OS and creates an ISO image.
- make run • Same as make build but runs the QEMU too.
- make clean • Clean all files (object files, ISO, etc...).
- make doxygen • Generate the documentation in directory doxygen-doc.
-
- -

Running With Other Virtual Machines

-
-
- • On VirtualBox and VMware, you can use the ISO image to run the OS.
- • HDD/SSD are not required.
- • The minimum RAM required is 4G. You can run with lower memory, but sometimes can cause issues (I don't know why).
- • UEFI required. BIOS sometimes doesn't work properly.
- • Serial Port (COM1) is recommended.
-
- -

Reporting Issues

-
-
- You can report bugs or crash issues to Issues tab.
-
-
- - - - + \ No newline at end of file diff --git a/tools/website/js/script.js b/tools/website/js/script.js index 0913096c..1df2c15f 100644 --- a/tools/website/js/script.js +++ b/tools/website/js/script.js @@ -1,9 +1,55 @@ -if (document.addEventListener) { - document.addEventListener('contextmenu', function (e) { - e.preventDefault(); - }, false); -} else { - document.attachEvent('oncontextmenu', function () { - window.event.returnValue = false; +document.querySelectorAll(".hdrbtn").forEach((b) => { + b.onmouseleave = (e) => { + e.target.style.background = "rgb(15, 15, 15, 0.1)"; + e.target.style.borderImage = null; + }; + + b.addEventListener("mousemove", (e) => { + const rect = e.target.getBoundingClientRect(); + const x = e.clientX - rect.left; + const y = e.clientY - rect.top; + e.target.style.background = `radial-gradient(circle at ${x}px ${y}px , rgba(100, 0, 180, 0.5),rgba(15, 15, 15, 0.1) )`; + e.target.style.borderImage = `radial-gradient(20% 75% at ${x}px ${y}px ,rgba(255, 255, 255, 0.7),rgba(255, 255, 255, 0.1) ) 1 / 1px / 0px stretch `; + }); +}); + +document.getElementById("year").innerHTML = new Date().getFullYear(); +topButton = document.getElementById("backToTopBtn"); +window.onscroll = function () { scrollToTop(); }; +function scrollToTop() { + if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { + topButton.style.display = "block"; + } else { + topButton.style.display = "none"; + } +} + +function topScript() { + window.scroll({ + top: 0, + behavior: 'smooth' }); } + +function CopyToClipboard(text) { + if (window.clipboardData && window.clipboardData.setData) { + return window.clipboardData.setData("Text", text); + } + else if (document.queryCommandSupported && document.queryCommandSupported("copy")) { + var textarea = document.createElement("textarea"); + textarea.textContent = text; + textarea.style.position = "fixed"; + document.body.appendChild(textarea); + textarea.select(); + try { + return document.execCommand("copy"); + } + catch (ex) { + console.warn("Copy to clipboard failed.", ex); + return prompt("Copy to clipboard: Ctrl+C, Enter", text); + } + finally { + document.body.removeChild(textarea); + } + } +} \ No newline at end of file