diff --git a/index.html b/index.html index 6360138..734e681 100644 --- a/index.html +++ b/index.html @@ -1,12 +1,13 @@ - - - - Flow OS - - - - - - \ No newline at end of file + + + + Flow OS + + + + + + + diff --git a/package-lock.json b/package-lock.json index bbfd532..2667fe3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "license": "MIT", "dependencies": { "@ptkdev/logger": "^1.8.0", + "eruda": "^3.0.1", "filer": "^1.4.1", "prism-code-editor": "^1.2.2", "prismjs": "^1.29.0", @@ -1846,6 +1847,11 @@ "is-arrayish": "^0.2.1" } }, + "node_modules/eruda": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/eruda/-/eruda-3.0.1.tgz", + "integrity": "sha512-6q1Xdwga4JTr1mKSW4mzuWSSbmXgqpm/8Wa1QGFGfCWRjC0bCQjbS4u06M1te1moucIS3hBLlbSTPWYH2W0qbQ==" + }, "node_modules/es-abstract": { "version": "1.22.2", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.2.tgz", diff --git a/package.json b/package.json index d91f9ff..494ea71 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "test": "ts-standard", "dev": "vite", "build": "vite build", - "serve": "vite serve" + "preview": "vite preview" }, "keywords": [], "author": "", @@ -21,6 +21,7 @@ }, "dependencies": { "@ptkdev/logger": "^1.8.0", + "eruda": "^3.0.1", "filer": "^1.4.1", "prism-code-editor": "^1.2.2", "prismjs": "^1.29.0", diff --git a/src/index.ts b/src/index.ts index ea1346d..24f0676 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,7 +1,7 @@ import './style.less' -import StatusBar from './statusbar.ts' -import WM from './wm.ts' +import StatusBar from './statusbar' +import WM from './wm' import * as fs from 'fs' @@ -16,3 +16,15 @@ declare global { window.statusBar = new StatusBar() window.wm = new WM() window.fs = new (window as any).Filer.FileSystem() + +const params = new URLSearchParams(window.location.search) + +async function enableDebug (): Promise { + const { default: eruda } = await import('eruda') + eruda.init() + return await Promise.resolve() +} + +if (params.get('debug') !== null && params.get('debug') !== undefined) { + enableDebug().catch(e => console.error(e)) +} diff --git a/src/modules/battery.ts b/src/modules/battery.ts index dce3252..3909381 100644 --- a/src/modules/battery.ts +++ b/src/modules/battery.ts @@ -9,5 +9,5 @@ export const run = (element: HTMLDivElement): void => { element.style.alignItems = 'center' element.style.paddingLeft = '15px' element.style.paddingRight = '15px' - element.innerHTML = '100%' + element.innerHTML = '🔋 100%' } diff --git a/src/style.less b/src/style.less index 6e19dd6..9efce8c 100644 --- a/src/style.less +++ b/src/style.less @@ -11,7 +11,12 @@ --crust: #11111b; } -body, html { +.bx-category { + color: #181926; +} + +body, +html { background-color: var(--crust); width: 100vw; @@ -25,7 +30,6 @@ body, html { overflow: hidden; } - *::-webkit-scrollbar { display: none; } @@ -34,7 +38,7 @@ body, html { -ms-overflow-style: none; scrollbar-width: none; - font-family: 'Satoshi', sans-serif; + font-family: "Satoshi", sans-serif; font-weight: 600; color: var(--text); @@ -50,12 +54,17 @@ toolbar { margin: 0 0 0 0; justify-content: center; + div[data-toolbar-id="appview"] { + background: rgb(150, 181, 246); + background: linear-gradient(45deg, rgba(150, 181, 246, 1) 0%, rgba(150, 181, 246, 1) 12%, rgba(77, 129, 236, 1) 100%); + color: black; + } & > div { background: var(--base); padding: 5px; border-radius: 5px; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1), 0 0px 10px rgba(0, 0, 0, 0.1); - height: 40px!important; + height: 40px !important; display: flex; app { @@ -80,7 +89,6 @@ window-area { margin-bottom: 20px; height: 100%; overflow: hidden; - window { background: var(--base); @@ -91,8 +99,8 @@ window-area { overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.2); background: var(--crust); - transition: .2s opacity, .2s width, .2s height; - + transition: 0.2s opacity, 0.2s width, 0.2s height; + window-header { height: 20px; padding: 7.5px; @@ -106,7 +114,7 @@ window-area { border-radius: 40%; } } - + window-content { height: 100%; border-radius: 10px 10px 0 0; @@ -129,10 +137,12 @@ launcher { top: 0; background: rgba(0, 0, 0, 0.5); z-index: 99999999999999999999999; - width: 100vw; + width: calc(100vw + 20px); height: calc(100vh + 20px); gap: 20px; - transition: .2s opacity, .2s backdrop-filter; + transition: 0.2s opacity, 0.2s backdrop-filter; + margin: 0; + left: 0; apps { max-height: 70vh; @@ -167,11 +177,11 @@ launcher { width: 300px; max-width: 100vw; text-align: center; - transition: border .2s; + transition: border 0.2s; &:focus { outline: none; border: 2px solid var(--text); } } -} \ No newline at end of file +}