From da39e782a39de01d32c4394cf89c4e53d99792b0 Mon Sep 17 00:00:00 2001 From: JanluOfficial <95766563+JanluOfficial@users.noreply.github.com> Date: Tue, 10 Dec 2024 23:36:17 +0100 Subject: [PATCH] Retheming and system.version() --- assets/logo_black.svg | 12 +++++ assets/logo_white.svg | 12 +++++ libs/system/sdk.js | 8 +++- pkgs/apps/desktop/notification.js | 2 +- pkgs/apps/desktop/taskbar.js | 76 +++++++++++++++---------------- pkgs/apps/desktop/watermark.js | 5 +- pkgs/apps/dynamic-test.js | 4 +- pkgs/apps/sysver.js | 4 +- stylesheets/index.css | 2 +- stylesheets/window.css | 8 ++-- 10 files changed, 85 insertions(+), 48 deletions(-) create mode 100644 assets/logo_black.svg create mode 100644 assets/logo_white.svg diff --git a/assets/logo_black.svg b/assets/logo_black.svg new file mode 100644 index 0000000..f7de043 --- /dev/null +++ b/assets/logo_black.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/assets/logo_white.svg b/assets/logo_white.svg new file mode 100644 index 0000000..7ea5d7c --- /dev/null +++ b/assets/logo_white.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/libs/system/sdk.js b/libs/system/sdk.js index a1ae4d5..06492a1 100644 --- a/libs/system/sdk.js +++ b/libs/system/sdk.js @@ -313,4 +313,10 @@ const element = { resolve(elementObject); }); } -}; \ No newline at end of file +}; + +const system = { + version: () => { + return 8; + } +} \ No newline at end of file diff --git a/pkgs/apps/desktop/notification.js b/pkgs/apps/desktop/notification.js index 671fd49..ece1c36 100644 --- a/pkgs/apps/desktop/notification.js +++ b/pkgs/apps/desktop/notification.js @@ -4,7 +4,7 @@ */ const notificationcss = (` - background-color: hsla(270, 44%, 12%, 75%); + background-color: hsla(270, 0%, 12%, 75%); outline: 1px solid rgba(255, 255, 255, 0.125); position: fixed; bottom: 60px; diff --git a/pkgs/apps/desktop/taskbar.js b/pkgs/apps/desktop/taskbar.js index 07de3bd..2763a11 100644 --- a/pkgs/apps/desktop/taskbar.js +++ b/pkgs/apps/desktop/taskbar.js @@ -4,46 +4,46 @@ */ const taskbarcss = (` - background-color: hsla(270, 44%, 12%, 75%); - outline: 1px solid rgba(255, 255, 255, 0.125); - /*border-radius: 4px;*/ - position: fixed; - bottom: 0px; - width: 80%; - margin: 15px; - height: 45px; - padding: 0px; - left: 0; - right: 0; - margin-left: auto; - margin-right: auto; - box-shadow: 0 0 10px 2px #000000cc; - display: flex; - z-index: 50; - backdrop-filter: blur(16px) saturate(200%); - -webkit-backdrop-filter: blur(16px) saturate(180%); - border-radius: 12px; - display: flex; - flex-direction: row; - align-items: center; - justify-content: left; - text-align: center; + background-color: hsla(270, 0%, 12%, 75%); + outline: 1px solid rgba(255, 255, 255, 0.125); + /*border-radius: 4px;*/ + position: fixed; + bottom: 0px; + width: 80%; + margin: 15px; + height: 45px; + padding: 0px; + left: 0; + right: 0; + margin-left: auto; + margin-right: auto; + box-shadow: 0 0 10px 2px #000000cc; + display: flex; + z-index: 50; + backdrop-filter: blur(16px) saturate(200%); + -webkit-backdrop-filter: blur(16px) saturate(180%); + border-radius: 12px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: left; + text-align: center; `) const taskbarcomponent = (` - border: 0px; - border-radius: 0px; - /* width: 45px; */ - height: 45px; - padding: 5px 5px; - display: flex; - align-items: center; - justify-content: center; - text-align: center; - z-index: 50; - background: none; - border: 0; - transition-duration: 0.1s + border: 0px; + border-radius: 0px; + /* width: 45px; */ + height: 45px; + padding: 5px 5px; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + z-index: 50; + background: none; + border: 0; + transition-duration: 0.1s `) const taskbarstart = (` @@ -92,7 +92,7 @@ element.create('button', '', 'start-btn').then(elm => elm ); element.create('img', '', '').then(elm => elm - .src('assets/logo.svg') + .src('assets/logo_white.svg') .width(30) .height(30) .dropshadow('0px 4px 5px #00000050') diff --git a/pkgs/apps/desktop/watermark.js b/pkgs/apps/desktop/watermark.js index 7616a9c..c3d08e3 100644 --- a/pkgs/apps/desktop/watermark.js +++ b/pkgs/apps/desktop/watermark.js @@ -3,6 +3,9 @@ Written by: MTSyntho @ AzuSystem 2024 */ +// Gets system version +var systemversion = system.version().toString(); + // Create a

element var watermark = document.createElement('p'); @@ -10,7 +13,7 @@ var watermark = document.createElement('p'); watermark.className = 'sysver'; // Set the inner HTML -watermark.innerHTML = 'AzuOS Alpha 8
By AzuSystem'; +watermark.innerHTML = 'AzuOS Alpha ' + systemversion + '
By AzuSystem'; // Add to desktop var desktop = document.getElementById('desktop'); diff --git a/pkgs/apps/dynamic-test.js b/pkgs/apps/dynamic-test.js index 4726a43..b0180c2 100644 --- a/pkgs/apps/dynamic-test.js +++ b/pkgs/apps/dynamic-test.js @@ -1,3 +1,5 @@ +var systemversion = system.version().toString(); + win.create("sdk testing", "root2").then(win => win .setWidth(700) .setHeight(500) @@ -20,7 +22,7 @@ element.create('p', 'This script is used to test the AzuOS SDK', "tes").then(elm .textalign('center') ); -element.create('p', 'Copyright @ AzuSystem 2024 - AzuOS Alpha 7', "tes").then(elm => elm +element.create('p', 'Copyright @ AzuSystem 2024 - AzuOS Alpha ' + systemversion, "tes").then(elm => elm .window("root2") .textalign('center') ); \ No newline at end of file diff --git a/pkgs/apps/sysver.js b/pkgs/apps/sysver.js index 788285e..6e4e4f6 100644 --- a/pkgs/apps/sysver.js +++ b/pkgs/apps/sysver.js @@ -5,6 +5,8 @@ // type: "process" // } +var systemversion = system.version().toString(); + win.create("About AzuOS", "root").then(win => win .setWidth(700) .setHeight(500) @@ -64,7 +66,7 @@ element.create('p', 'AzuOS is an Operating System written primarily with Web Tec .parent('contents') ); -element.create('p', 'Copyright @ AzuSystem 2024 - AzuOS Alpha 8', "tes").then(elm => elm +element.create('p', 'Copyright @ AzuSystem 2024 - AzuOS Alpha ' + systemversion, "tes").then(elm => elm .parent('contents') ); diff --git a/stylesheets/index.css b/stylesheets/index.css index 8584d6c..0d0c30b 100644 --- a/stylesheets/index.css +++ b/stylesheets/index.css @@ -3,7 +3,7 @@ body { } .desktop { - background-image: url('../assets/wallpapers/palm tree near dome.jpg'); + background-image: url('../assets/wallpapers/dark\ waves.jpg'); background-size: cover; background-attachment: fixed; top: 0px; diff --git a/stylesheets/window.css b/stylesheets/window.css index c67fe0f..1204fbc 100644 --- a/stylesheets/window.css +++ b/stylesheets/window.css @@ -35,9 +35,9 @@ } .winbox { - backdrop-filter: blur(16px) saturate(180%); - -webkit-backdrop-filter: blur(16px) saturate(180%); - background-color: rgba(30, 17, 44, 0.75); + -webkit-backdrop-filter: blur(16px) /* saturate(180%) */; + backdrop-filter: blur(16px) /* saturate(180%) */; + background-color: hsla(269, 0%, 12%, 0.75); border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.125); box-shadow: 0px 0px 30px #000000; @@ -52,7 +52,7 @@ .wb-body { /* set the width of window border via margin: */ - background: #150d1f50; + background: hsla(267, 0%, 9%, 0.0); /* Originally 0.314 */ } @font-face {