├── desktop_tpl.html ├── img ├── mc.jpg ├── wsm.png ├── yq.jpg ├── earth.webp ├── login.jpg ├── office.png ├── win11.jpg ├── win13.jpg ├── ai-copilot.png ├── dark-mode.png ├── start-menu.png └── colorful-apps.png ├── fonts ├── dos.ttf ├── bootstrap-icons.woff └── bootstrap-icons.woff2 ├── icon ├── wsa.png ├── office.png ├── taskmgr.png ├── vscode.png ├── bilibili.png ├── files │ ├── img.png │ ├── none.png │ ├── ppt.png │ ├── txt.png │ ├── word.png │ ├── excel.png │ ├── music.png │ ├── vidio.png │ ├── exefile.png │ ├── explorer.png │ └── picture.png ├── fold_dark.svg ├── fold_light.svg ├── user.svg ├── python.svg ├── copilot.svg ├── whiteboard.svg ├── terminal.svg ├── defender.svg ├── feedback.svg ├── about.svg ├── logo.svg ├── windows12.svg ├── run.svg ├── edge.svg ├── folder │ └── music.svg └── setting.svg ├── pwa ├── logo.png └── manifest.json ├── media ├── startup.mp3 └── Windows Background.wav ├── apps ├── icons │ ├── explorer │ │ ├── od.png │ │ ├── qa.png │ │ ├── rb.png │ │ ├── disk.png │ │ ├── diskwin.png │ │ ├── folder.png │ │ ├── thispc.png │ │ ├── tool-copy.png │ │ ├── tool-cut.png │ │ ├── tool-new.png │ │ ├── tool-paste.png │ │ ├── tool-sort.png │ │ ├── tool-view.png │ │ ├── tool-rename.png │ │ ├── disk.svg │ │ ├── thispc.svg │ │ └── folder.svg │ ├── setting │ │ ├── apps.png │ │ ├── game.png │ │ ├── help.png │ │ ├── safe.png │ │ ├── system.png │ │ ├── time.png │ │ ├── update.png │ │ ├── user.png │ │ ├── icons.woff2 │ │ ├── network.png │ │ ├── personal.png │ │ └── blueteeth.png │ ├── whiteboard │ │ ├── delete.png │ │ └── marker.png │ ├── edge │ │ ├── fullscreen.svg │ │ ├── exitfullscreen.svg │ │ └── disconnected.svg │ └── about │ │ ├── info.svg │ │ └── update.svg └── style │ ├── run.css │ ├── camera.css │ ├── terminal.css │ ├── whiteboard.css │ ├── bios.css │ ├── pythonEditor.css │ ├── edge.css │ ├── calc.css │ ├── login.css │ ├── copilot.css │ ├── notepad.css │ ├── about.css │ └── explorer.css ├── index.html ├── robots.txt ├── scripts ├── setting_getTime.js ├── boot_kernel.js ├── calculator_kernel.js └── bios_kernel.js ├── boot.html ├── base.css ├── disconnected.html ├── mainpage.html ├── shutdown.html ├── reload.html ├── CONTRIBUTING.md ├── module ├── tab.css └── tab.js ├── data └── tasks.js ├── bios.html ├── README.md ├── sw.js ├── disconnected_dark.html └── widgets.css /desktop_tpl.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /img/mc.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/mc.jpg -------------------------------------------------------------------------------- /img/wsm.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/wsm.png -------------------------------------------------------------------------------- /img/yq.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/yq.jpg -------------------------------------------------------------------------------- /fonts/dos.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/fonts/dos.ttf -------------------------------------------------------------------------------- /icon/wsa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/wsa.png -------------------------------------------------------------------------------- /img/earth.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/earth.webp -------------------------------------------------------------------------------- /img/login.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/login.jpg -------------------------------------------------------------------------------- /img/office.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/office.png -------------------------------------------------------------------------------- /img/win11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/win11.jpg -------------------------------------------------------------------------------- /img/win13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/win13.jpg -------------------------------------------------------------------------------- /pwa/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/pwa/logo.png -------------------------------------------------------------------------------- /icon/office.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/office.png -------------------------------------------------------------------------------- /icon/taskmgr.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/taskmgr.png -------------------------------------------------------------------------------- /icon/vscode.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/vscode.png -------------------------------------------------------------------------------- /icon/bilibili.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/bilibili.png -------------------------------------------------------------------------------- /icon/files/img.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/img.png -------------------------------------------------------------------------------- /icon/files/none.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/none.png -------------------------------------------------------------------------------- /icon/files/ppt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/ppt.png -------------------------------------------------------------------------------- /icon/files/txt.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/txt.png -------------------------------------------------------------------------------- /icon/files/word.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/word.png -------------------------------------------------------------------------------- /img/ai-copilot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/ai-copilot.png -------------------------------------------------------------------------------- /img/dark-mode.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/dark-mode.png -------------------------------------------------------------------------------- /img/start-menu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/start-menu.png -------------------------------------------------------------------------------- /media/startup.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/media/startup.mp3 -------------------------------------------------------------------------------- /icon/files/excel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/excel.png -------------------------------------------------------------------------------- /icon/files/music.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/music.png -------------------------------------------------------------------------------- /icon/files/vidio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/vidio.png -------------------------------------------------------------------------------- /img/colorful-apps.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/img/colorful-apps.png -------------------------------------------------------------------------------- /icon/files/exefile.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/exefile.png -------------------------------------------------------------------------------- /icon/files/explorer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/explorer.png -------------------------------------------------------------------------------- /icon/files/picture.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/icon/files/picture.png -------------------------------------------------------------------------------- /apps/icons/explorer/od.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/od.png -------------------------------------------------------------------------------- /apps/icons/explorer/qa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/qa.png -------------------------------------------------------------------------------- /apps/icons/explorer/rb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/rb.png -------------------------------------------------------------------------------- /fonts/bootstrap-icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/fonts/bootstrap-icons.woff -------------------------------------------------------------------------------- /apps/icons/explorer/disk.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/disk.png -------------------------------------------------------------------------------- /apps/icons/setting/apps.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/apps.png -------------------------------------------------------------------------------- /apps/icons/setting/game.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/game.png -------------------------------------------------------------------------------- /apps/icons/setting/help.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/help.png -------------------------------------------------------------------------------- /apps/icons/setting/safe.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/safe.png -------------------------------------------------------------------------------- /apps/icons/setting/system.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/system.png -------------------------------------------------------------------------------- /apps/icons/setting/time.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/time.png -------------------------------------------------------------------------------- /apps/icons/setting/update.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/update.png -------------------------------------------------------------------------------- /apps/icons/setting/user.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/user.png -------------------------------------------------------------------------------- /fonts/bootstrap-icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/fonts/bootstrap-icons.woff2 -------------------------------------------------------------------------------- /media/Windows Background.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/media/Windows Background.wav -------------------------------------------------------------------------------- /apps/icons/explorer/diskwin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/diskwin.png -------------------------------------------------------------------------------- /apps/icons/explorer/folder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/folder.png -------------------------------------------------------------------------------- /apps/icons/explorer/thispc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/thispc.png -------------------------------------------------------------------------------- /apps/icons/setting/icons.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/icons.woff2 -------------------------------------------------------------------------------- /apps/icons/setting/network.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/network.png -------------------------------------------------------------------------------- /apps/icons/setting/personal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/personal.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-copy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-copy.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-cut.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-cut.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-new.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-new.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-paste.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-paste.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-sort.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-sort.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-view.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-view.png -------------------------------------------------------------------------------- /apps/icons/setting/blueteeth.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/setting/blueteeth.png -------------------------------------------------------------------------------- /apps/icons/whiteboard/delete.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/whiteboard/delete.png -------------------------------------------------------------------------------- /apps/icons/whiteboard/marker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/whiteboard/marker.png -------------------------------------------------------------------------------- /apps/icons/explorer/tool-rename.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lttthedev/lttthedev.github.io/HEAD/apps/icons/explorer/tool-rename.png -------------------------------------------------------------------------------- /pwa/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Windows 12", 3 | "short_name": "Windows 12", 4 | "display": "standalone", 5 | "start_url": "/win12/boot.html", 6 | "prefer_related_applications": true, 7 | "background_color": "#000", 8 | "icons": [ 9 | { 10 | "src": "logo.png", 11 | "sizes": "144x144", 12 | "type": "image/png" 13 | } 14 | ] 15 | } -------------------------------------------------------------------------------- /apps/icons/edge/fullscreen.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/icons/edge/exitfullscreen.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Redirecting... 8 | 9 | 10 | 11 | 如果您的浏览器没有自动跳转,请点击这里…… 12 | 13 | -------------------------------------------------------------------------------- /icon/fold_dark.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/fold_light.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/style/run.css: -------------------------------------------------------------------------------- 1 | #win-run { 2 | display: flex !important; 3 | flex-direction: column; 4 | } 5 | 6 | #win-run>.top { 7 | display: flex; 8 | padding: 10px; 9 | } 10 | 11 | #win-run>.top>.icon { 12 | min-width: 70px; 13 | background-image: url('../../icon/run.svg'); 14 | background-position: 50% 50%; 15 | background-repeat: no-repeat; 16 | background-size: contain; 17 | margin-right: 10px; 18 | } 19 | 20 | #win-run>.open { 21 | display: flex; 22 | gap: 15px; 23 | padding: 10px 20px 10px 20px; 24 | } 25 | 26 | #win-run>.open>input { 27 | flex-grow: 1; 28 | width: auto !important; 29 | } 30 | 31 | #win-run>.open>.prompt { 32 | margin-top: 3px; 33 | } -------------------------------------------------------------------------------- /robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | 3 | # 若想要让搜索引擎爬取以下目录,请注释掉相应的索引规则 4 | 5 | # 外部数据文件:不允许搜索引擎爬取外部数据文件,以保护敏感数据 6 | Disallow: /data/ # 阻止搜索引擎访问外部数据文件 7 | 8 | # 应用程序:不允许搜索引擎爬取应用程序相关的内容 9 | Disallow: /apps/ # 阻止搜索引擎访问应用程序目录 10 | 11 | # GitHub相关:不允许搜索引擎爬取与GitHub相关的内容 12 | Disallow: /.github/ # 阻止搜索引擎访问GitHub相关内容 13 | 14 | # 模块:不允许搜索引擎爬取模块文件,以保护代码逻辑 15 | Disallow: /module/ # 阻止搜索引擎访问模块文件 16 | 17 | # 渐进式Web应用:不允许搜索引擎爬取PWA相关内容 18 | Disallow: /pwa/ # 阻止搜索引擎访问PWA相关内容 19 | 20 | # JavaScript文件:不允许搜索引擎爬取JavaScript文件 21 | Disallow: /scripts/ # 阻止搜索引擎访问JavaScript文件 22 | 23 | # 字体文件:不允许搜索引擎爬取字体文件 24 | Disallow: /fonts/ # 阻止搜索引擎访问字体文件 25 | 26 | # 图像文件:不允许搜索引擎爬取图像文件 27 | Disallow: /icon/ # 阻止搜索引擎访问图像文件 28 | 29 | # 图片文件:不允许搜索引擎爬取图片文件 30 | Disallow: /img/ # 阻止搜索引擎访问图片文件 31 | 32 | # 音频文件:不允许搜索引擎爬取音频文件 33 | Disallow: /media/ # 阻止搜索引擎访问音频文件 -------------------------------------------------------------------------------- /scripts/setting_getTime.js: -------------------------------------------------------------------------------- 1 | //设置页面时间获取逻辑 @Junchen Yi 2023-9-17 2 | 3 | // 获取具有class="settingTime"的元素 4 | const settingTimeElement = document.querySelector('.settingTime'); 5 | 6 | // 更新时间函数 7 | function updateTime() { 8 | const now = new Date(); 9 | const hours = now.getHours(); 10 | const minutes = now.getMinutes().toString().padStart(2, '0'); // 补零 11 | const seconds = now.getSeconds().toString().padStart(2, '0'); // 补零 12 | 13 | let timeOfDay = ''; 14 | 15 | if (hours < 12) { 16 | timeOfDay = '上午'; 17 | } else if (hours < 18) { 18 | timeOfDay = '下午'; 19 | } else { 20 | timeOfDay = '晚上'; 21 | } 22 | 23 | // 将时间注入到HTML元素内 24 | settingTimeElement.textContent = `${timeOfDay} ${hours}:${minutes}:${seconds}`; 25 | } 26 | 27 | // 初始加载时更新时间 28 | updateTime(); 29 | 30 | // 每秒钟更新一次时间 31 | setInterval(updateTime, 1000); 32 | -------------------------------------------------------------------------------- /apps/icons/edge/disconnected.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/style/camera.css: -------------------------------------------------------------------------------- 1 | .camera-notice { 2 | width: 300px !important; 3 | height: 400px !important; 4 | } 5 | 6 | #win-camera { 7 | position: relative; 8 | } 9 | 10 | #win-camera>.video { 11 | width: 100%; 12 | height: 100%; 13 | display: flex; 14 | justify-content: center; 15 | align-items: center; 16 | } 17 | 18 | #win-camera>.control>div { 19 | width: 45px; 20 | height: 45px; 21 | } 22 | 23 | #win-camera>.control>div>.startbutton { 24 | width: 45px; 25 | height: 45px; 26 | border-radius: 50%; 27 | background-color: #ffffffee; 28 | backdrop-filter: blur(10px) saturate(1.3); 29 | box-shadow: 0 0 0 4px #44444470, 0 0 0 7px #ffffffa0, 1px 1px 15px 7px #00000090; 30 | transition: 200ms; 31 | } 32 | 33 | #win-camera>.control>div>.startbutton:hover { 34 | background-color: #ffffffc0; 35 | } 36 | 37 | #win-camera>.control { 38 | position: absolute; 39 | display: flex; 40 | align-items: center; 41 | justify-content: center; 42 | background: #00000010; 43 | } 44 | 45 | #win-camera.h>.control { 46 | height: 100%; 47 | width: 80px; 48 | right: 0px; 49 | top: 0px; 50 | } 51 | 52 | #win-camera.v>.control { 53 | height: 80px; 54 | width: 100%; 55 | bottom: 0px; 56 | left: 0px; 57 | } 58 | 59 | #win-camera.h video { 60 | height: 100%; 61 | } 62 | 63 | #win-camera.v video { 64 | width: 100%; 65 | } -------------------------------------------------------------------------------- /icon/user.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /scripts/boot_kernel.js: -------------------------------------------------------------------------------- 1 | function setProgress(n) { 2 | document.getElementById('load').style.width = (400 / 20 * n) + 'px'; 3 | document.getElementById('back').style.width = (400 / 20 * (20 - n)) + 'px'; 4 | } 5 | setProgress(0); 6 | var i = 0; 7 | var progress = [0, 0, 1, 3, 7, 17, 20]; 8 | var timer; 9 | timer = setInterval(function () { 10 | setProgress(progress[i]); 11 | i++; 12 | document.getElementById('body').style.height = window.innerHeight + "px"; //适应高度 13 | document.getElementById('center-div').style.height = (window.innerHeight - document.getElementById('info').clientHeight - 10) + "px"; //适应高度 14 | if (i >= progress.length) { 15 | if (timer != undefined) { 16 | clearInterval(timer); 17 | } 18 | window.location.href = "./desktop.html"; 19 | } 20 | }, 300); 21 | function toBIOS() { 22 | if (timer != undefined) { 23 | clearInterval(timer); 24 | } 25 | setTimeout(() => { 26 | document.getElementById("body").innerHTML = ""; 27 | document.getElementById("body").style.cssText = "background-color: black;" 28 | }, 500); 29 | setTimeout(() => { 30 | window.location.href = "./bios.html" 31 | }, 1000); 32 | } 33 | window.onkeydown = function (event) { 34 | event = event || window.event; 35 | if (event.keyCode == 113) { 36 | toBIOS() 37 | } 38 | } 39 | window.ontouchstart = toBIOS; 40 | document.getElementById('center-div').style.height = (window.innerHeight - document.getElementById('info').clientHeight - 10) + "px"; //适应高度 41 | document.oncontextmenu = function () { 42 | return false; 43 | } 44 | -------------------------------------------------------------------------------- /apps/style/terminal.css: -------------------------------------------------------------------------------- 1 | .window.terminal-apps { 2 | --text: #ddd; 3 | --bg: #000000; 4 | --bg50: #00000060; 5 | --bg70: #000000b7; 6 | --sd: #000000a0; 7 | --card: #72727240; 8 | --hover: #aaaaaa40; 9 | --hover-half: #ffffff20; 10 | --hover-b: #eeeeee0f; 11 | --bggrey: #444; 12 | --fill:#54545470; 13 | --mm: #ffffff50; 14 | --cm: #252525bb; 15 | --bar: #7272722a; 16 | --hr:#333; 17 | --unfoc:#202020; 18 | --msg:#303030d0; 19 | --bd:#ffffff06; 20 | --s3d:#11111160; 21 | --mica: linear-gradient(140deg,#2d161c,#102d53); 22 | } 23 | 24 | .window.terminal-apps.max>.content { 25 | padding-bottom: 55px !important; 26 | } 27 | 28 | .window.terminal-apps>.content { 29 | overflow-y: auto !important; 30 | overflow-x: hidden !important; 31 | padding-bottom: 10px; 32 | } 33 | 34 | .window.terminal-apps>.content>pre { 35 | color: #ddd; 36 | margin: 0px 15px; 37 | font-family: "Consolas", "Monaco", "monospace", system-ui; 38 | user-select: text; 39 | font-size: 16px; 40 | } 41 | 42 | .window.terminal-apps>.content * { 43 | white-space: break-spaces; 44 | } 45 | 46 | .window.terminal-apps>.content *::selection { 47 | background: #ddd; 48 | background-clip: content-box; 49 | color: #333; 50 | } 51 | 52 | .window.terminal-apps>.content>pre>input { 53 | background: none; 54 | border: none; 55 | outline: none; 56 | padding: 0; 57 | color: #eee; 58 | cursor: default; 59 | width: 100%; 60 | } 61 | 62 | .window.terminal-apps>pre>input::selection { 63 | background: #ddd; 64 | background-clip: content-box; 65 | color: #333; 66 | } -------------------------------------------------------------------------------- /apps/style/whiteboard.css: -------------------------------------------------------------------------------- 1 | #win-whiteboard>canvas { 2 | background-color: #ffffff88; 3 | } 4 | 5 | :root.dark #win-whiteboard>canvas { 6 | background-color: #aaaaaa88; 7 | } 8 | 9 | .window.whiteboard.max>#win-whiteboard>.toolbar { 10 | bottom: 60px; 11 | } 12 | 13 | .window.whiteboard.max>#win-whiteboard>.toolbar>.tools { 14 | border-radius: 10px !important; 15 | } 16 | 17 | #win-whiteboard>.toolbar { 18 | display: flex; 19 | justify-content: center; 20 | align-items: center; 21 | position: absolute; 22 | bottom: 0px; 23 | width: 100%; 24 | transition: bottom 200ms; 25 | } 26 | 27 | #win-whiteboard>.toolbar>.tools { 28 | display: flex; 29 | border-radius: 10px 10px 0px 0px; 30 | justify-content: space-evenly; 31 | box-shadow: 0px 0px 10px 3px #00000066; 32 | padding: 0px 15px 0px 15px; 33 | overflow: hidden; 34 | transition: border-radius 200ms; 35 | background-color: #ffffff88; 36 | } 37 | 38 | :root.dark #win-whiteboard>.toolbar>.tools { 39 | background-color: #aaaaaa88; 40 | } 41 | 42 | #win-whiteboard>.toolbar>.tools>* { 43 | margin: 3px 3px 0px 3px; 44 | transition: background-color 70ms, top 100ms; 45 | border-radius: 10px 10px 0px 0px; 46 | position: relative; 47 | top: 13.5px; 48 | } 49 | 50 | #win-whiteboard>.toolbar>.tools>.active { 51 | top: 6px; 52 | background-color: #00000020; 53 | } 54 | 55 | #win-whiteboard>.toolbar>.tools>.eraser, 56 | #win-whiteboard>.toolbar>.tools>.delete { 57 | width: 76px; 58 | display: flex; 59 | justify-content: center; 60 | padding-top: 5px; 61 | } 62 | 63 | #win-whiteboard>.toolbar>.tools>*:not(.active):hover { 64 | background-color: #00000015; 65 | } -------------------------------------------------------------------------------- /apps/style/bios.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'dos'; 3 | src: url(../../fonts/dos.ttf); 4 | } 5 | 6 | body { 7 | background-color: #aaaaaa; 8 | } 9 | 10 | html, 11 | body { 12 | width: 100%; 13 | height: 100%; 14 | } 15 | 16 | 17 | * { 18 | font-family: 'dos'; 19 | padding: 0px; 20 | margin: 0px; 21 | border: 0px; 22 | cursor: none; 23 | -webkit-user-select: none; 24 | -moz-user-select: none; 25 | -o-user-select: none; 26 | user-select: none; 27 | scrollbar-width: none; 28 | /* Firefox */ 29 | -ms-overflow-style: none; 30 | /* IE 10+ */ 31 | } 32 | 33 | ::-webkit-scrollbar { 34 | display: none; 35 | /* Chrome Safari */ 36 | } 37 | 38 | .tit { 39 | font-size: 1.2rem; 40 | text-align: center; 41 | background-color: #4ba7a8; 42 | list-style-type: none; 43 | margin: 0px; 44 | padding: 5px; 45 | } 46 | 47 | body { 48 | display: flex; 49 | flex-direction: column; 50 | } 51 | 52 | .pages { 53 | background-color: #0100a2; 54 | padding: 5px; 55 | } 56 | 57 | a { 58 | text-decoration: none; 59 | } 60 | 61 | .page { 62 | font-size: 110%; 63 | color: #0100a2; 64 | background-color: #aaaaaa; 65 | margin: 5px; 66 | padding: 5px; 67 | } 68 | 69 | .option { 70 | border: none; 71 | } 72 | 73 | #mainPage, 74 | #exitPage { 75 | margin: 20px; 76 | padding: 20px; 77 | border: 3.5px solid #000; 78 | height: 100%; 79 | } 80 | 81 | .exit { 82 | color: #0100a2; 83 | padding: 5px; 84 | } 85 | 86 | /*.exit:hover{ 87 | color: #fff; 88 | }*/ 89 | 90 | .confirm-button { 91 | background-color: #fff; 92 | color: #000; 93 | } 94 | 95 | /*.confirm-button:hover{ 96 | background-color: #000; 97 | color: #fff; 98 | }*/ -------------------------------------------------------------------------------- /apps/icons/about/info.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /boot.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Windows 12 Web Version 6 | 7 | 8 | 42 | 43 | 44 | 45 |
46 |
47 |
48 |

Starting

49 |
50 |
51 |
52 |
53 |

Press F2 or touch screen to enter SETUP

54 |
55 | 56 | 57 | -------------------------------------------------------------------------------- /apps/style/pythonEditor.css: -------------------------------------------------------------------------------- 1 | #win-pythonEditor *::-webkit-scrollbar { 2 | background-color: #FFFFFF10; 3 | } 4 | 5 | ::-webkit-scrollbar:hover { 6 | background-color: #ffffff10; 7 | } 8 | 9 | #win-pythonEditor *{ 10 | scroll-behavior:initial !important; 11 | } 12 | 13 | #win-pythonEditor { 14 | display: grid; 15 | grid-template-rows: 60% 40%; 16 | min-height: 0px; 17 | user-select: all; 18 | } 19 | 20 | .window.pythonEditor .titbar .run { 21 | font-size: 17px; 22 | padding-top: 4px; 23 | } 24 | 25 | #win-python-ace-editor { 26 | font-size: 16px; 27 | line-height: 1.25; 28 | height: 100% !important; 29 | font-weight: 200; 30 | } 31 | 32 | #win-pythonEditor .output { 33 | background-color: #0f0f0f; 34 | color: #f8f8f2; 35 | border: 25px solid #1a1a1a !important; 36 | border: none; 37 | /* border-radius: 5px; */ 38 | padding: 10px; 39 | width: 100%; 40 | height: 100%; 41 | font: 14px / normal 'Consolas', 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'Source Code Pro', 'source-code-pro', monospace; 42 | overflow-y: scroll; 43 | white-space: pre-wrap; 44 | word-wrap: break-word; 45 | user-select: auto; 46 | } 47 | 48 | #win-pythonEditor .output::selection { 49 | background: #ddd; 50 | background-clip: content-box; 51 | color: #333; 52 | } 53 | /* 编辑器 */ 54 | .ace_editor.ace_autocomplete.ace_dark.ace-vibrant-ink{ 55 | border-radius: 8px; 56 | box-shadow: 1px 1px 10px #000; 57 | } 58 | 59 | .ace_autocomplete .ace_layer.ace_marker-layer>.ace_active-line{ 60 | border-radius: 5px; 61 | background-color: #ffffff30 !important; 62 | } 63 | .ace_autocomplete .ace_layer.ace_marker-layer>.ace_line-hover{ 64 | border-radius: 5px; 65 | background: #ffffff20; 66 | border-color: var(--href); 67 | transition: 100ms; 68 | } 69 | .ace_autocomplete .ace_layer.ace_text-layer>.ace_line{ 70 | padding: 0px 6px; 71 | } 72 | 73 | .ace_autocomplete .ace_layer.ace_text-layer>.ace_line>.ace_completion-highlight{ 74 | color: var(--theme-1); 75 | } 76 | 77 | .ace_tooltip{ 78 | border-radius: 8px; 79 | box-shadow: 1px 1px 10px #000; 80 | background-color: #26282c !important; 81 | border: 1px #484747 solid; 82 | padding: 5px 8px; 83 | } -------------------------------------------------------------------------------- /base.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji; 4 | font-size: 1rem; 5 | font-weight: 400; 6 | line-height: 1.5; 7 | color: #212529; 8 | text-align: left; 9 | background-color: #fff; 10 | } 11 | 12 | *, ::after, ::before { 13 | box-sizing: border-box; 14 | } 15 | 16 | html { 17 | touch-action: none; 18 | font-family: sans-serif; 19 | line-height: 1.15; 20 | -webkit-text-size-adjust: 100%; 21 | -webkit-tap-highlight-color: transparent; 22 | } 23 | 24 | html * { 25 | touch-action: auto; 26 | } 27 | 28 | pre { 29 | font-family: monospace; 30 | } 31 | 32 | 33 | hr { 34 | box-sizing: content-box; 35 | height: 0; 36 | overflow: visible; 37 | unicode-bidi: isolate; 38 | margin-block-start: 0.5em; 39 | margin-block-end: 0.5em; 40 | margin-inline-start: auto; 41 | margin-inline-end: auto; 42 | border: 0; 43 | border-top: 1px solid rgba(0,0,0,.1); 44 | } 45 | 46 | [type=button], [type=reset], [type=submit], button { 47 | -webkit-appearance: button; 48 | appearance: button; 49 | } 50 | button, select { 51 | text-transform: none; 52 | } 53 | button, input { 54 | overflow: visible; 55 | } 56 | button, input, optgroup, select, textarea { 57 | margin: 0; 58 | font-family: inherit; 59 | font-size: inherit; 60 | line-height: inherit; 61 | } 62 | 63 | button { 64 | appearance: auto; 65 | writing-mode: horizontal-tb !important; 66 | text-rendering: auto; 67 | letter-spacing: normal; 68 | word-spacing: normal; 69 | line-height: normal; 70 | text-transform: none; 71 | text-indent: 0px; 72 | text-shadow: none; 73 | display: inline-block; 74 | text-align: center; 75 | align-items: flex-start; 76 | cursor: default; 77 | box-sizing: border-box; 78 | background-color: -internal-light-dark(rgb(239, 239, 239), rgb(59, 59, 59)); 79 | margin: 0em; 80 | padding: 1px 6px; 81 | border-width: 2px; 82 | border-style: outset; 83 | border-color: buttonborder; 84 | border-image: initial; 85 | } 86 | 87 | a:-webkit-any-link { 88 | cursor: pointer; 89 | text-decoration: none; 90 | } -------------------------------------------------------------------------------- /icon/python.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/style/edge.css: -------------------------------------------------------------------------------- 1 | .window.edge.max>#win-edge { 2 | padding-bottom: 55px; 3 | } 4 | 5 | #win-edge { 6 | display: flex; 7 | flex-direction: column; 8 | transition: 50ms; 9 | } 10 | 11 | #win-edge>.tool { 12 | display: flex; 13 | padding: 6px 7px 2px 7px; 14 | } 15 | 16 | #win-edge>.tool>.a { 17 | font-size: 18px; 18 | border-radius: 6px; 19 | width: 35px; 20 | height: 30px; 21 | text-align: center; 22 | transition: 50ms; 23 | margin: 0 1.5px; 24 | --top:2px; 25 | } 26 | 27 | #win-edge>.tool>.a.disabled { 28 | filter: contrast(0.2); 29 | pointer-events: none; 30 | } 31 | 32 | #win-edge>.tool>.a>.bi::before { 33 | position: relative; 34 | top: var(--top); 35 | } 36 | 37 | #win-edge>.tool>.a:hover { 38 | background-color: var(--hover-half); 39 | } 40 | 41 | #win-edge>.tool>input { 42 | background-color: var(--hover-half); 43 | border-radius: 50px; 44 | border: 1.5px solid transparent; 45 | padding: 3px 14px 4px 10px; 46 | outline: medium; 47 | color: var(--text); 48 | transition: 100ms, border 0s; 49 | height: 30px; 50 | margin: 0 2px; 51 | } 52 | 53 | #win-edge>.tool>input.url { 54 | flex-grow: 1; 55 | } 56 | 57 | #win-edge>.tool>input.rename:not(.show) { 58 | width: 0; 59 | padding: 0; 60 | border: none; 61 | } 62 | 63 | #win-edge>.tool>input.rename.show { 64 | width: 200px; 65 | } 66 | 67 | #win-edge>.tool>input:hover { 68 | border-color: #7f7f7f7f; 69 | } 70 | 71 | #win-edge>.tool>input:focus { 72 | border-color: var(--href); 73 | } 74 | 75 | #win-edge>iframe { 76 | width: calc(100% - 4px); 77 | flex-grow: 1; 78 | margin: 2px; 79 | border-radius: 10px; 80 | --bg: var(--bg); 81 | --text: var(--text); 82 | display: none; 83 | } 84 | 85 | #win-edge>iframe.show { 86 | display: block; 87 | } 88 | 89 | .reloading>svg { 90 | width: 27px !important; 91 | } 92 | 93 | .reloading { 94 | margin-right: -5px; 95 | margin-bottom: -4px; 96 | animation: reload 100ms; 97 | } 98 | 99 | @keyframes reload { 100 | 0% { 101 | margin-right: -27px; 102 | } 103 | 104 | 100% { 105 | margin-right: -5px; 106 | } 107 | } 108 | 109 | .reloading>svg>circle:first-child { 110 | stroke: #7f7f7f50; 111 | fill: none; 112 | stroke-width: 2px; 113 | } 114 | 115 | .reloading>svg>circle:last-child { 116 | stroke: #2983cc; 117 | stroke-width: 2px; 118 | } -------------------------------------------------------------------------------- /disconnected.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Windows 12 for the web - Solutions to network connection issues 7 | 8 | 66 | 67 | 68 |
69 |
70 |
Network connection issues
71 |
72 |

The web is different for you. Let us help you get back online!

73 |

Please try the following:

74 | 78 |

Error code: ERR_INTERNET_DISCONNECTED

79 |
80 |
81 | 82 | -------------------------------------------------------------------------------- /apps/style/calc.css: -------------------------------------------------------------------------------- 1 | @keyframes shine { 2 | 0% { 3 | border-color: #111; 4 | } 5 | 49% { 6 | border-color: #111; 7 | } 8 | 51% { 9 | border-color: transparent; 10 | } 11 | 98% { 12 | border-color: transparent; 13 | } 14 | 100% { 15 | border-color: #111; 16 | } 17 | } 18 | 19 | #win-calc { 20 | display: flex; 21 | flex-direction: column; 22 | padding: 5px; 23 | } 24 | 25 | #calc-input { 26 | /* height: 90px; */ 27 | border: none; 28 | border-right: 2px solid transparent; 29 | outline: none; 30 | background-color: #00000000; 31 | font-size: 35px; 32 | text-align: end; 33 | color: var(--text); 34 | width: 100%; 35 | } 36 | 37 | #win-calc>.container { 38 | height: 90px; 39 | display: flex; 40 | align-items: center; 41 | } 42 | 43 | #calc-input:focus { 44 | border-color: #111; 45 | animation-name: shine; 46 | animation-duration: 1s; 47 | animation-iteration-count: infinite; 48 | } 49 | 50 | #win-calc>.keyb { 51 | flex-grow: 1; 52 | display: grid; 53 | grid-template-columns: repeat(4, 1fr); 54 | grid-template-rows: repeat(5, 50px); 55 | gap: 4px; 56 | } 57 | 58 | #win-calc>.keyb>.b { 59 | /* width: 60px; */ 60 | height: 50px; 61 | font-size: 25px; 62 | text-align: center; 63 | transition: 40ms; 64 | border-radius: 7px; 65 | /* border: 1.5px solid #63636330; */ 66 | box-shadow: 0px 1px 1px 1px var(--s3d); 67 | background: var(--card); 68 | padding-top: 5px; 69 | /* border: 1.5px solid var(--bd); 70 | border-top: 2px solid var(--bd); 71 | border-bottom: 1px solid var(--bd); */ 72 | /* border-color: var(--bd); */ 73 | transform-origin: bottom; 74 | } 75 | 76 | #win-calc>.keyb>.checked { 77 | background-color: var(--mm) !important; 78 | } 79 | 80 | #win-calc>.keyb>.b.u { 81 | padding-top: 5px; 82 | } 83 | 84 | #win-calc>.keyb>.b.ans { 85 | background-image: linear-gradient(120deg, var(--theme-1), var(--theme-2)); 86 | border: none; 87 | color: #ddd; 88 | } 89 | 90 | #win-calc>.keyb>.b.ans:hover { 91 | backdrop-filter: brightness(0.8); 92 | } 93 | 94 | #win-calc>.keyb>span { 95 | width: 71px; 96 | margin: 5px 5px; 97 | height: 71px; 98 | } 99 | 100 | #win-calc>.keyb>.b:hover { 101 | background-color: var(--hover); 102 | } 103 | 104 | #win-calc>.keyb>.b:active { 105 | opacity: 0.8; 106 | transform: scale(0.96); 107 | box-shadow: 0px 1px 1px var(--bd); 108 | } -------------------------------------------------------------------------------- /apps/style/login.css: -------------------------------------------------------------------------------- 1 | #loginback { 2 | width: 100%; 3 | height: 100%; 4 | display: flex; 5 | justify-content: center; 6 | align-items: center; 7 | flex-direction: column; 8 | /* background: linear-gradient(130deg, #ad6eca, #3b91d8); */ 9 | background-image: url('../../img/login.jpg'); /* Lucas Andrade, CC BY SA-4.0 */ 10 | background-size: cover; 11 | background-repeat: no-repeat; 12 | background-position: 50% 50%; 13 | transition: filter 500ms, background-color 500ms, opacity 1500ms ease-in-out; 14 | position: absolute; 15 | width: 100%; 16 | height: 100%; 17 | opacity: 0; 18 | display: none; 19 | z-index: 101; 20 | } 21 | 22 | #login { 23 | cursor: pointer; 24 | padding: 4px 50px 4px 50px; 25 | border: 2px solid #aaa; 26 | background-color: #eeeeee80; 27 | backdrop-filter: blur(10px) brightness(2); 28 | color: #121212; 29 | transition: background-color 300ms, transform cubic-bezier(0.14, 1.02, 0.17, 0.03) 300ms; 30 | font-size: 18px; 31 | border-radius: 10px; 32 | } 33 | 34 | #login:hover { 35 | background-color: #fafafa50; 36 | } 37 | 38 | #login:active { 39 | transform: scale(0.9); 40 | } 41 | 42 | #login-after { 43 | color: #fefefe; 44 | font-family: Arial, Helvetica, sans-serif; 45 | font-size: 18px; 46 | margin: 6px 0px 6px 0px; 47 | } 48 | 49 | #loginback>div.user { 50 | width: 150px; 51 | height: 150px; 52 | border-radius: 100%; 53 | background-image: url("../../icon/user.svg"); 54 | background-size: 65% 65%; 55 | background-position: 50% 50%; 56 | background-repeat: no-repeat; 57 | margin-bottom: 10px; 58 | background-color: #ddd; 59 | transition: filter 500ms; 60 | margin-top: -35px; 61 | } 62 | 63 | #loginback>div.name { 64 | color: #fefefe; 65 | font-size: 30px; 66 | font-family: Arial, Helvetica, sans-serif; 67 | margin-bottom: 15px; 68 | transition: color 500ms; 69 | } 70 | 71 | #loginback.close, 72 | #loginback.close>div.user { 73 | filter: brightness(0); 74 | } 75 | 76 | #loginback.close>div.name, 77 | #loginback.close #login-after { 78 | color: #000 !important; 79 | } 80 | 81 | #loginback.close { 82 | background-color: black; 83 | } 84 | 85 | #loginback .power { 86 | display: flex; 87 | position: absolute; 88 | bottom: 20px; 89 | right: 20px; 90 | width: 165px; 91 | justify-content: space-evenly; 92 | color: #fff; 93 | align-items: center; 94 | } 95 | 96 | #loginback .power>* { 97 | cursor: pointer; 98 | transition: all 300ms; 99 | font-size: 44px; 100 | display: flex; 101 | justify-content: center; 102 | align-items: center; 103 | padding: 10px; 104 | border-radius: 7px; 105 | transition: transform cubic-bezier(0.14, 1.02, 0.17, 0.03) 300ms; 106 | } 107 | 108 | #loginback .power>*:hover { 109 | background-color: var(--card); 110 | } 111 | 112 | #loginback .power>*:active { 113 | transform: scale(0.95); 114 | } 115 | -------------------------------------------------------------------------------- /apps/icons/explorer/disk.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /mainpage.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Windows 12 Browser 9 | 71 | 72 | 73 | 74 | 75 |
76 | 77 | 78 | 79 | 94 |
95 | 96 | 97 | -------------------------------------------------------------------------------- /shutdown.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Shut down - Win12 7 | 8 | 50 | 51 | 52 |
53 | 54 | 55 | 56 | 57 | 58 | 59 |

60 | Shutting down 61 |

62 | 75 | 76 | -------------------------------------------------------------------------------- /reload.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Win12 - Restarting 7 | 8 | 50 | 51 | 52 | 53 |
54 | 55 | 56 | 57 | 58 | 59 | 60 |

61 | Restarting 62 |

63 | 75 | 76 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # 贡献指南 2 | 3 | 感谢所有为本项目做出贡献的开发者和大家的支持! 4 | 5 | 如果您喜欢本项目,欢迎给这个项目点一颗Star、给我们赞助一下或为我们做出一些重要的贡献qwq~ 6 | 7 | ## 漏洞汇报 8 | 9 | 1. 请使用最新版本,以确认该漏洞是否已经被修复。 10 | 11 | 2. 请确认该漏洞或错误是不是属于您所使用的问题。如,使用较为老旧的浏览器(如IE等)、关闭了浏览器部分特性(如禁止存储数据等) 12 | 13 | 3. 请清楚地描述漏洞,以便我们更好地进行修复。 14 | 15 | 4. 您可以使用“漏洞汇报”Issue模板进行反馈,但请正确地填写其中的内容。 16 | 17 | 5. 禁止在内容中添加任何违反法律或政治敏感的内容,否则将会采取锁定+视情况封禁的处理。 18 | 19 | ## 提出建议 20 | 21 | 1. 请使用最新版本,以确认该建议是否已被实现/解决。 22 | 23 | 2. 请清楚地描述建议,以便我们更好地进行实现/解决。 24 | 25 | 3. 您可以使用“提出建议”Issue模板进行反馈,但请正确地填写其中的内容。 26 | 27 | 4. 禁止在内容中添加任何违反法律或政治敏感的内容,否则将会采取锁定+视情况封禁的处理。 28 | 29 | ## 提交代码 30 | 31 | 注意:请严格按照下面的,以及desktop.html开头的开发规范编辑代码,否则不予合并 32 | 33 | 1. 请尽量一次Commit提交全部内容。可以追加Commits,但尽量不要超过5个Commits。 34 | 35 | 2. 请尽量使用Git命令行、Github Desktop、[https://github.dev](https://github.dev/tjy-gitnub/win12)等方式进行提交。请不要直接在浏览器中上传文件来提交。 36 | 37 | 3. 禁止上传任何违反法律或政治敏感的内容,否则将会采取锁定+视情况封禁的处理(温馨提示:时事新闻也不行)。 38 | 39 | 4. 提交时请不要随意取提交标题及内容,例如: 40 | 41 | - 好的例子:修复xx无法正常使用的问题、新增xx应用 42 | 43 | - 坏的例子:阿巴阿巴、这个玩意忘弄了、bug太多了...qwq 44 | 45 | 5. 格式化要求: 46 | 47 | - 请不要使用格式化工具格式化HTML文件 48 | 49 | - 对于JavaScript和CSS文件,可以使用Visual Studio Code自带的格式化工具格式化 50 | 51 | ### 提交信息要求 52 | 53 | 1. 若更新具有一定重要性或量级时,请按照以下格式: 54 | 55 | ``` 56 | v11.4.5 - 更新了xxx 57 | 58 | (更新来自 @Somebody) 59 | - 更新了... 60 | - 优化了... 61 | - 修复了... 62 | ... 63 | ``` 64 | 65 | - 使用该格式的要求: 66 | 67 | 1. 该更新提交前必须告知我们。 68 | 69 | - 说明: 70 | 71 | 1. 标题要带有版本号、主要更新内容。 72 | 73 | 2. 内容第一行注明更新来源。 74 | 75 | 3. 内容要用列表的方式阐述更新内容。 76 | 77 | - 注意: 78 | 79 | 1. 请不要任意选取版本号。若您不清楚,可以通过我们的交流群与我们取得联系()并分配到版本号。 80 | 81 | 2. 在更新时,记住要在“关于 Windows 12 网页版”应用的更新记录中,添加关于该更新的相关内容。 82 | 83 | 2. 若满足下列条件,提交内容不作过于标准的规定: 84 | 85 | - 更新内容较少。 86 | 87 | - 更新内容没有重要的更改。 88 | 89 | 尽管没有标准的规定,但仍然需要: 90 | 91 | 1. 提交标题应当清晰明了,能简要概括更新的主要内容。 92 | 93 | 2. 提交内容应当注明提交者,并以列表或其他方式进行对本次更新内容的阐述。 94 | 95 | ### 开发规范 96 | 97 | 1. 对于HTML文件的规定 98 | 99 | 1. 对于id属性的规定:除非是必须,尽量不要使用id属性,以免冲突,尽量以class替代。若必须使用,请记住以下几点: 100 | 101 | 1. 除非是body>*的节点,请不要使用单个单词的id名称 102 | 103 | 2. 所取的名字必须要有意义 104 | 105 | 3. 对于非body>*节点,请按照“父元素标志词-(...)-id名称”进行命名。如:taskmgr-search, setting-search等 106 | 107 | 2. 对于class属性的规定: 108 | 109 | 1. 所取的名字必须要有意义 110 | 111 | 2. 不需要为每一个元素分配class,按需分配即可 112 | 113 | 3. 在使用css选择器时,请确保选择的元素是在预期范围内的,即准确定位到元素,以免误匹配其他元素 114 | 115 | 3. 对于代码规范的规定: 116 | 117 | 1. 对于svg图像,请尽量压成一行或提取至单独文件,以免过于臃肿 118 | 119 | 2. 对于那些不需要展开的代码,尽量压成一行 120 | 121 | 2. 对JS文件的规定 122 | 123 | 1. 请按照以下代码风格进行开发: 124 | 125 | ```js 126 | var sum = 0; 127 | for (var i = 0; i < 10; i++) { 128 | sum += i; 129 | } 130 | console.log(sum); 131 | ``` 132 | 133 | 2. 对于函数名及变量命名,请使用驼峰式命名法,如: 134 | 135 | - isLoaded 136 | 137 | - storagedItems 138 | 139 | 3. 对于类名,请使用帕斯卡命名法(大驼峰式命名法),如: 140 | 141 | - WindowManager 142 | 143 | - Widgets 144 | 145 | 4. 对于代码规范的规定: 146 | 147 | 1. 对于那些不需要展开的代码,尽量压成一行 148 | 149 | ## 投稿新闻 150 | 151 | 1. 请确保您所投稿的新闻**均不在当前时刻或过去时刻的现实生活中出现**,即为纯虚构。 152 | 153 | 2. 禁止上传任何违反法律或政治敏感的内容,否则将会采取锁定+视情况封禁的处理(温馨提示:时事新闻也不行)。 154 | -------------------------------------------------------------------------------- /module/tab.css: -------------------------------------------------------------------------------- 1 | .window.tabs>.titbar>.tabs { 2 | display: flex; 3 | flex-grow: 1 !important; 4 | height: calc(100% - 2px); 5 | padding: 2px 1px; 6 | /* overflow-x:auto; */ 7 | overflow: hidden; 8 | align-items: center; 9 | margin-top: 2px; 10 | } 11 | 12 | .window.tabs>.titbar>.tabs>.tab { 13 | display: flex; 14 | border-radius: 7px; 15 | max-width: 200px; 16 | display: flex; 17 | justify-content: space-between; 18 | /* padding: 4px 0; */ 19 | align-items: center; 20 | width: 0; 21 | flex-grow: 1; 22 | max-width: 200px; 23 | min-width: none; 24 | overflow: hidden; 25 | transition: 50ms; 26 | height: 100%; 27 | white-space: nowrap; 28 | } 29 | 30 | .window.tabs>.titbar>.tabs>.tab::before { 31 | content: ''; 32 | position: relative; 33 | width: 1.5px; 34 | height: 19px; 35 | background: var(--hr); 36 | /* opacity: 0.3; */ 37 | transition: 50ms; 38 | } 39 | 40 | .window.tabs>.titbar>.tabs>.tab p { 41 | overflow: hidden; 42 | display: -webkit-box; 43 | box-orient: vertical; 44 | -webkit-box-orient: vertical; 45 | line-clamp: 1; 46 | -webkit-line-clamp: 1; 47 | } 48 | 49 | .window.tabs>.titbar>.tabs>.tab.show { 50 | background: var(--hover) !important; 51 | box-shadow: 0 1px 2px var(--sd); 52 | } 53 | 54 | .window.tabs>.titbar>.tabs>.tab.close { 55 | transform: translateY(calc(100% + 5px)) !important; 56 | opacity: 0.6; 57 | transition: 150ms; 58 | } 59 | 60 | .window.tabs>.titbar>.tabs>.tab.left { 61 | transform: translateX(-100%) !important; 62 | transition: 150ms; 63 | } 64 | 65 | .window.tabs>.titbar>.tabs>.tab.right { 66 | transform: translateX(100%) !important; 67 | transition: 150ms; 68 | } 69 | 70 | .window.tabs>.titbar>.tabs>.tab.moving { 71 | /* background: var(--unfoc) !important; */ 72 | background: var(--bggrey) !important; 73 | z-index: 1; 74 | } 75 | 76 | .window.tabs>.titbar>.tabs>.tab:hover { 77 | background: var(--hover-b); 78 | } 79 | 80 | .window.tabs>.titbar>.tabs>.tab:hover::before, 81 | .window.tabs>.titbar>.tabs>.tab:hover+.tab::before, 82 | .window.tabs>.titbar>.tabs>.tab.show::before, 83 | .window.tabs>.titbar>.tabs>.tab.show+.tab::before { 84 | opacity: 0; 85 | } 86 | 87 | .window.tabs>.titbar>.tabs>.tab>p { 88 | font-size: 15px; 89 | margin-left: 7px; 90 | margin-top: 1px; 91 | flex-grow: 1; 92 | } 93 | 94 | .window.tabs>.titbar>.tabs>.tab>.clbtn { 95 | border-radius: 4px; 96 | display: block; 97 | margin: 0 5px 0 0; 98 | width: 18px; 99 | height: 18px; 100 | } 101 | 102 | .window.tabs>.titbar>.tabs>.tab>.clbtn::before { 103 | position: relative; 104 | top: -3px; 105 | left: 1px; 106 | } 107 | 108 | .window.tabs>.titbar>.tabs>.tab>.clbtn:hover { 109 | background: var(--hover); 110 | } 111 | 112 | .window.tabs>.titbar>.tabs>.new { 113 | border-radius: 7px; 114 | margin: 3px 2px; 115 | height: 25px; 116 | width: 25px; 117 | font-size: 20px; 118 | text-align: center; 119 | transition: 50ms; 120 | } 121 | 122 | .window.tabs>.titbar>.tabs>.new::before { 123 | position: relative; 124 | top: -3px; 125 | } 126 | 127 | .window.tabs>.titbar>.tabs>.new:hover { 128 | background-color: var(--hover-half); 129 | } 130 | -------------------------------------------------------------------------------- /apps/style/copilot.css: -------------------------------------------------------------------------------- 1 | #copilot{ 2 | position: fixed; 3 | right: -410px; 4 | background-color: var(--bg70); 5 | /* box-shadow: 1px 2px 25px var(--sd); */ 6 | border: 2px solid #6f6f6f30; 7 | width: 400px; 8 | height: calc(100% - 70px); 9 | top: 10px; 10 | border-radius: 14px; 11 | overflow: hidden; 12 | transition: 300ms cubic-bezier(0.9, 0, 0.1, 1); 13 | z-index: 92; 14 | display: flex; 15 | flex-direction: column; 16 | padding-top: 5px; 17 | } 18 | 19 | #copilot.show{ 20 | right: 10px; 21 | box-shadow: 1px 2px 25px var(--sd); 22 | backdrop-filter: blur(20px) saturate(1.3); 23 | } 24 | 25 | #copilot>.titbar{ 26 | height: 40px; 27 | display: flex; 28 | align-items: center; 29 | padding: 0 10px; 30 | min-height: 40px; 31 | } 32 | 33 | #copilot>.titbar>.text{ 34 | font-size: 20px; 35 | } 36 | 37 | #copilot>.titbar>.alr{ 38 | flex-grow: 1; 39 | display: flex; 40 | justify-content: flex-end; 41 | } 42 | 43 | #copilot>.titbar>.alr>.btn{ 44 | width: 35px; 45 | height: 35px; 46 | text-align: center; 47 | padding: 6px 0; 48 | display: block; 49 | } 50 | 51 | #copilot>.chat{ 52 | flex-grow: 1; 53 | padding: 10px 15px; 54 | overflow-y: auto; 55 | overflow-x:hidden !important; 56 | scroll-behavior: smooth; 57 | } 58 | 59 | #copilot>.chat>.line{ 60 | width: 100%; 61 | display: flex; 62 | margin-top: 15px; 63 | } 64 | #copilot>.chat>.line.user{ 65 | width: 100%; 66 | flex-direction: row-reverse; 67 | } 68 | @keyframes msg{ 69 | 0%{ 70 | opacity: 0; 71 | transform: translateY(20px); 72 | } 73 | 100%{ 74 | opacity: 1; 75 | transform: none; 76 | } 77 | } 78 | 79 | #copilot>.chat>.line>.text{ 80 | width: max-content; 81 | padding: 10px 15px; 82 | border-radius: 10px; 83 | box-shadow: 0 1px 6px var(--sd); 84 | max-width: calc(100% - 40px); 85 | word-break:break-all; 86 | animation: msg 400ms cubic-bezier(0,0,0,1); 87 | user-select:text; 88 | } 89 | #copilot>.chat>.line.ai>.text{ 90 | background-color: var(--msg); 91 | } 92 | #copilot>.chat>.line.user>.text{ 93 | background: linear-gradient(100deg,#3397e9c0,#024bb1d6); 94 | color: #fff; 95 | } 96 | #copilot>.chat>.line.system>.text{ 97 | background: linear-gradient(100deg,#ca3ee0b0,#6f0bbcbe); 98 | color: #fff; 99 | } 100 | #copilot>.chat>.line.ai>.text>.action{ 101 | background-color: var(--hover-b); 102 | padding: 10px 15px; 103 | border-radius: 9px; 104 | box-shadow: 0 1px 2px var(--s3d); 105 | margin: 10px 5px; 106 | } 107 | #copilot>.chat>.line.ai>.text>.action>.tit{ 108 | font-size: 20px; 109 | } 110 | 111 | #copilot>.inputbox{ 112 | height: 60px; 113 | display: flex; 114 | align-items: center; 115 | min-height: 60px; 116 | } 117 | 118 | #copilot>.inputbox.disable{ 119 | pointer-events:none; 120 | filter: saturate(0.8) brightness(0.9); 121 | } 122 | 123 | #copilot>.inputbox>.input{ 124 | margin: 0 10px; 125 | flex-grow: 1; 126 | height: 40px; 127 | } 128 | 129 | #copilot>.inputbox>.send{ 130 | width: 80px; 131 | color: #fff; 132 | text-align: center; 133 | margin-right: 10px; 134 | background: linear-gradient(120deg,var(--theme-1),var(--theme-2)); 135 | } -------------------------------------------------------------------------------- /icon/copilot.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/icons/about/update.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /data/tasks.js: -------------------------------------------------------------------------------- 1 | let taskmgrTasks = [ 2 | { 3 | name: '任务管理器', 4 | icon: 'icon/taskmgr.png', 5 | link: 'taskmgr' 6 | }, 7 | { 8 | name: 'Whiteboard', 9 | icon: 'icon/whiteboard.png', 10 | link: 'whiteboard' 11 | }, 12 | { 13 | name: '相机', 14 | icon: 'icon/camera.svg', 15 | link: 'camera' 16 | }, 17 | { 18 | name: '哔哩哔哩客户端', 19 | icon: 'icon/bilibili.png', 20 | link: 'bilibili' 21 | }, 22 | { 23 | name: 'Microsoft Edge', 24 | icon: 'icon/edge.svg', 25 | link: 'edge' 26 | }, 27 | { 28 | name: 'WebView2运行时组件' 29 | }, 30 | { 31 | name: '设置', 32 | icon: 'icon/setting.svg', 33 | link: 'setting' 34 | }, 35 | { 36 | name: 'Python Editor(Python程序编辑器)', 37 | icon: 'icon/pythonEditor.svg', 38 | link: 'pythonEditor' 39 | }, 40 | { 41 | name: '计算器', 42 | icon: 'icon/calc.svg', 43 | link: 'calc' 44 | }, 45 | { 46 | name: '文件资源管理器', 47 | icon: 'icon/explorer.svg', 48 | link: 'explorer' 49 | }, 50 | { 51 | name: '关于Windows12', 52 | icon: 'icon/about.svg', 53 | link: 'about' 54 | }, 55 | { 56 | name: '记事本', 57 | icon: 'icon/notepad.svg', 58 | link: 'notepad' 59 | }, 60 | { 61 | name: '终端', 62 | icon: 'icon/terminal.svg', 63 | link: 'terminal' 64 | }, 65 | { 66 | name: 'Visual Studio Code', 67 | icon: 'icon/vscode.png', 68 | link: 'vscode' 69 | }, 70 | { 71 | name: 'System' 72 | }, 73 | { 74 | name: 'Windows内存处理系统进程' 75 | }, 76 | { 77 | name: '应用层网关服务' 78 | }, 79 | { 80 | name: 'DCOM DLL Host进程' 81 | }, 82 | { 83 | name: 'Windows内存处理系统进程' 84 | }, 85 | { 86 | name: '应用层网关服务' 87 | }, 88 | { 89 | name: 'Client/Server Runtime Server Subsystem' 90 | }, 91 | { 92 | name: 'DirectDraw Helper' 93 | }, 94 | { 95 | name: 'DCOM DLL Host进程' 96 | }, 97 | { 98 | name: 'IIS Admin Service Helper' 99 | }, 100 | { 101 | name: 'Input Locales' 102 | }, 103 | { 104 | name: 'Windows壳进程' 105 | }, 106 | { 107 | name: '本地安全权限服务' 108 | }, 109 | { 110 | name: 'Machine Debug Manager' 111 | }, 112 | { 113 | name: '多媒体支持进程' 114 | }, 115 | { 116 | name: 'Windows路由进程' 117 | }, 118 | { 119 | name: 'Windows信使服务' 120 | }, 121 | { 122 | name: 'Windows计划任务' 123 | }, 124 | { 125 | name: '远程注册表服务' 126 | }, 127 | { 128 | name: 'RPC Portmapper' 129 | }, 130 | { 131 | name: 'Windows Service Controller' 132 | }, 133 | { 134 | name: 'Session Manager Subsystem' 135 | }, 136 | { 137 | name: 'Microsoft SNMP Agent' 138 | }, 139 | { 140 | name: 'Printer Spooler' 141 | }, 142 | { 143 | name: 'Printer Spooler Service' 144 | }, 145 | { 146 | name: 'Still Image Service' 147 | }, 148 | { 149 | name: 'Service Host Process' 150 | }, 151 | { 152 | name: 'Windows System Process' 153 | }, 154 | { 155 | name: 'Windows Task Optimizer' 156 | }, 157 | { 158 | name: 'TCP/IP Services' 159 | }, 160 | { 161 | name: 'Windows Logon Process' 162 | }, 163 | { 164 | name: 'Windows Management Service' 165 | } 166 | ] -------------------------------------------------------------------------------- /icon/whiteboard.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/terminal.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /scripts/calculator_kernel.js: -------------------------------------------------------------------------------- 1 | class Calculator { 2 | constructor(input, container) { 3 | this.elt = input; 4 | this.num1 = null; 5 | this.num2 = null; 6 | this.keysContainer = container; 7 | this.operator = 0; 8 | this.preview = false; 9 | } 10 | 11 | get_num() { 12 | return Big(this.elt.value); 13 | } 14 | 15 | number_key(key) { 16 | // key:按下的数字键,int 17 | // id:显示区的id 18 | if (this.elt.value == "0" || this.preview) { 19 | this.elt.value = ""; 20 | this.preview = false; 21 | } 22 | this.elt.value += key; 23 | this.uncheck(); 24 | } 25 | 26 | func_key(key) { 27 | // key:按下的功能键,int,加1,减2,乘3,除4 28 | if (!this.isCheck()) { 29 | if (this.num1 != null) { 30 | this.num2 = Big(this.elt.value); 31 | this.num1 = Big(this._calc(this.num1, this.num2, this.operator)); 32 | this.elt.value = this.num1; 33 | this.preview = true; 34 | } 35 | else { 36 | this.num1 = Big(this.elt.value); 37 | this.elt.value = this.num1; 38 | this.preview = true; 39 | } 40 | } 41 | this.operator = key; 42 | 43 | } 44 | 45 | check(elt) { 46 | this.uncheck(); 47 | elt.classList.add('checked'); 48 | } 49 | 50 | uncheck() { 51 | for (const elt of this.keysContainer.children) { 52 | elt.classList.remove('checked'); 53 | } 54 | } 55 | 56 | isCheck() { 57 | for (const elt of this.keysContainer.children) { 58 | if (elt.classList.contains('checked')) { 59 | return true; 60 | } 61 | } 62 | return false; 63 | } 64 | 65 | point() { 66 | if (this.elt.value == "") { 67 | this.elt.value = "0"; 68 | } 69 | if (!(this.elt.value.includes('.'))) { 70 | this.elt.value += "."; 71 | } 72 | } 73 | 74 | square() { 75 | this.elt.value = Math.pow(Number(this.get_num().toString()), 2); 76 | } 77 | 78 | squareRoot() { 79 | this.elt.value = Math.sqrt(Number(this.get_num().toString())); 80 | } 81 | 82 | backspace() { 83 | if (this.elt.value.length > 0) { 84 | this.elt.value = this.elt.value.substring(0, this.elt.value.length - 1); 85 | } 86 | if (this.elt.value == "") { 87 | this.elt.value = "0"; 88 | } 89 | } 90 | 91 | 92 | clear_num() { 93 | this.elt.value = "0"; 94 | this.num1 = null, this.num2 = null, this.operator = 0; 95 | this.uncheck(); 96 | } 97 | 98 | eq() { 99 | this.uncheck(); 100 | if (this.operator == 0) { 101 | return true; 102 | } 103 | this.num2 = Big(this.elt.value); 104 | var num = this._calc(this.num1, this.num2, this.operator); 105 | this.clear_num(); 106 | if (num != null) { 107 | this.elt.value = num; 108 | return true; 109 | } 110 | return false; 111 | } 112 | 113 | _calc(n1, n2, c) { 114 | switch (c) { 115 | case 1: 116 | return n1.plus(n2).toString(); 117 | case 2: 118 | return n1.minus(n2).toString(); 119 | case 3: 120 | return n1.times(n2).toString(); 121 | case 4: 122 | return (n2 != 0) ? this.num1.div(this.num2).toString() : null; 123 | } 124 | } 125 | } 126 | 127 | var widgetCalculator = new Calculator($('#calc-input-widgets')[0], $('#widgets .calc>.content')[0]); 128 | var appCalculator = new Calculator($('#calc-input')[0], $('#win-calc>.keyb')[0]); 129 | -------------------------------------------------------------------------------- /bios.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Windows 12 BIOS Setup 9 | 10 | 11 | 12 | 13 | 14 | 25 | 26 | 27 | 30 | 34 | 35 |
36 | 37 | 38 | 41 | 42 | 45 | 46 | 47 | 48 | 51 | 52 | 55 | 56 | 57 |
39 | System Time: 40 | 43 | [11:45:14] 44 |
49 | System Date: 50 | 53 | [10/08/1919] 54 |
58 |
59 | 60 |
61 |
Exit Saving Changes
62 |
Exit Discarding Changes
63 |
Restore Defaults
64 |
65 | 66 | 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /icon/defender.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/style/notepad.css: -------------------------------------------------------------------------------- 1 | #win-notepad{ 2 | overflow: hidden; 3 | } 4 | 5 | #win-notepad>.tool{ 6 | width: 100%; 7 | height: 35px; 8 | padding-top: 5px; 9 | margin-bottom: 2px; 10 | } 11 | 12 | #win-notepad>.text-box{ 13 | border-radius: 10px 10px 0px 0px; 14 | width: 100%; 15 | border: none; 16 | background-color: var(--card); 17 | opacity: 0.8; 18 | transform: translate(0,8px); 19 | outline: none; 20 | box-shadow: 0 -3px 3px var(--sd); 21 | padding: 10px; 22 | resize: none; 23 | font-size: 15px; 24 | line-height: 1.25; 25 | color: var(--text); 26 | height: calc(100% - 65px); 27 | transition: 200ms; 28 | } 29 | 30 | #win-notepad>.text-box *:not(div):not(br){ 31 | border-radius: 8px; 32 | outline: 2px solid transparent; 33 | transition: 100ms; 34 | display: block; 35 | } 36 | 37 | #win-notepad>.text-box *:not(div):not(br):focus{ 38 | background: red; 39 | } 40 | 41 | #win-notepad>.text-box *:not(div):not(br):hover{ 42 | outline-color: #2983cc; 43 | } 44 | 45 | #win-notepad>.text-box:focus{ 46 | transform: none; 47 | opacity: 1; 48 | box-shadow: 0 -6px 6px var(--sd); 49 | } 50 | 51 | #win-notepad>.text-box::selection{ 52 | background: #2983cc; 53 | color: #ddd; 54 | } 55 | 56 | #win-notepad>.text-box.down{ 57 | transform: translate(0,100%); 58 | } 59 | 60 | #win-notepad>.tool>a{ 61 | border-radius: 10px; 62 | margin: -5px 0 0 5px; 63 | text-align: center; 64 | padding: 3px 5px; 65 | display: inline-block; 66 | transition: 100ms; 67 | } 68 | 69 | #win-notepad>.tool>a:hover{ 70 | background-color: var(--hover); 71 | } 72 | 73 | #win-notepad-font>.row { 74 | display: flex; 75 | justify-content: space-around; 76 | height: 266px; 77 | } 78 | 79 | .select-input { 80 | display: inline-block; 81 | height: 200px; 82 | } 83 | 84 | .select-input#win-notepad-font-type { 85 | width: 200px; 86 | } 87 | 88 | .select-input#win-notepad-font-size { 89 | width: 80px; 90 | } 91 | 92 | .select-input#win-notepad-font-style { 93 | width: 90px; 94 | } 95 | 96 | .select-input#win-notepad-font-style>.value-box{ 97 | padding: 5px; 98 | } 99 | 100 | /* #win-notepad-font-size { 101 | vertical-align: top; 102 | } */ 103 | 104 | 105 | .select-input>input[type=text] { 106 | outline: none; 107 | width: 100%; 108 | background-color: rgba(255, 255, 255, 0.3); 109 | border-radius: 10px 10px 0px 0px; 110 | border: 2px solid #7f7f7f40; 111 | background: var(--card); 112 | border-bottom: none; 113 | color: var(--text); 114 | padding: 3px 6px; 115 | /* box-shadow: 2px 2px 5px var(--sd); */ 116 | } 117 | 118 | .select-input>.description { 119 | margin-left: 3px; 120 | } 121 | 122 | .select-input>.value-box { 123 | width: 100%; 124 | height: 100%; 125 | border: 2px solid #7f7f7f40; 126 | background: var(--card); 127 | border-radius: 0px 0px 10px 10px; 128 | border-style: solid; 129 | overflow-y: auto; 130 | overflow-x: hidden; 131 | /* background-color: rgba(255, 255, 255, 0.3); */ 132 | /* box-shadow: inset 0px 4px 2.5px var(--sd); */ 133 | display: block; 134 | padding: 5px 0 5px 5px; 135 | /* box-shadow: 2px 2px 5px var(--sd); */ 136 | 137 | } 138 | 139 | .select-input>.value-box>.option { 140 | padding: 3px 7px; 141 | } 142 | 143 | /* .select-input>.value-box>.option { 144 | padding: 3px; 145 | width: 100%; 146 | } */ 147 | 148 | #win-notepad-font .preview { 149 | display: inline-block; 150 | width: 150px; 151 | height: 150px; 152 | margin: 5px 10px;; 153 | } 154 | 155 | #win-notepad-font .preview>.preview-box { 156 | display: flex; 157 | width: 150px; 158 | flex-direction: column; 159 | justify-content: center; 160 | align-items: center; 161 | word-break: keep-all; 162 | height: 150px; 163 | text-align: center; 164 | border: 2px solid #7f7f7f40; 165 | background: var(--card); 166 | border-width: 2px; 167 | overflow: hidden; 168 | border-radius: 10px; 169 | line-height: 1.25; 170 | } -------------------------------------------------------------------------------- /icon/feedback.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/style/about.css: -------------------------------------------------------------------------------- 1 | #win-about { 2 | display: flex; 3 | } 4 | 5 | #win-about>.menu { 6 | height: 100%; 7 | width: 20%; 8 | min-width: 180px; 9 | max-width: 250px; 10 | padding: 8px 5px 0 14px; 11 | } 12 | 13 | #win-about>.menu>list>* { 14 | padding: 6px 8px 5px 12px; 15 | display: flex; 16 | margin-bottom: 3px; 17 | border-radius: 7px; 18 | } 19 | 20 | #win-about>.menu>list>*>img { 21 | margin: 2px 7px 0 0; 22 | } 23 | 24 | #win-about>.cnt { 25 | overflow: auto; 26 | transform: translate(0, 50%); 27 | opacity: 0; 28 | width: 0; 29 | transition: transform 300ms cubic-bezier(0, 0, 0, 1), opacity 300ms 50ms; 30 | padding: 0 5px 60px 0; 31 | /* display: none; */ 32 | } 33 | 34 | #win-about>.cnt.show { 35 | flex-grow: 1; 36 | transform: none; 37 | opacity: 1; 38 | display: block; 39 | } 40 | 41 | #win-about>.cnt .tit { 42 | margin: 8px 0 3px 0; 43 | display: flex; 44 | } 45 | 46 | #win-about>.cnt .tit>span { 47 | background: linear-gradient(180deg, var(--theme-1), var(--theme-2)); 48 | border-radius: 10px; 49 | width: 6px; 50 | margin: 5px 8px 5px 5px; 51 | transition: 200ms; 52 | /* opacity: 0; */ 53 | transform: scaleY(0); 54 | transform-origin: top; 55 | } 56 | 57 | #win-about>.cnt .tit:hover>span { 58 | transform: none; 59 | } 60 | 61 | #win-about>.update>div>details { 62 | background-color: var(--card); 63 | padding: 10px 10px 0 15px; 64 | border-radius: 8px; 65 | /* box-shadow: 3px 3px 5px var(--sd); */ 66 | box-shadow: 0 1px 2px 1px var(--s3d); 67 | margin: 12px 10px 0 0; 68 | transition: 100ms, height 0ms, padding-bottom 100ms ease-out; 69 | overflow: hidden; 70 | height: 45px; 71 | } 72 | 73 | #win-about>.update>div>details[open] { 74 | padding-bottom: 10px; 75 | height: 100%; 76 | } 77 | 78 | #win-about>.update>div>details:not([open]):hover { 79 | filter: brightness(1.2); 80 | } 81 | 82 | #win-about>.update>div>details:active { 83 | opacity: 0.6; 84 | } 85 | 86 | #win-about>.update>div>details>summary { 87 | font-size: 17px; 88 | transition: 200ms; 89 | } 90 | 91 | #win-about>.update>div>details>summary>span { 92 | font-weight: 900; 93 | } 94 | 95 | #win-about>.update>div>details>p { 96 | margin-left: 10px; 97 | } 98 | 99 | #contri { 100 | display: flex; 101 | flex-wrap: wrap; 102 | } 103 | 104 | #contri>.a { 105 | margin: 3px; 106 | background: var(--card); 107 | box-shadow: 0 1px 2px var(--sd); 108 | border-radius: 10px; 109 | width: 110px; 110 | height: 70px; 111 | text-align: center; 112 | padding-top: 10px; 113 | font-size: 13px; 114 | transition: 50ms; 115 | } 116 | 117 | #contri>.a:hover { 118 | background: var(--hover); 119 | } 120 | 121 | #contri>.a:active { 122 | opacity: 0.6; 123 | } 124 | 125 | #contri>.a>.name { 126 | font-size: 17px; 127 | margin: 0px 6px; 128 | /* border: 6px; */ 129 | white-space: nowrap; 130 | text-overflow: ellipsis; 131 | overflow: hidden; 132 | } 133 | 134 | #contri>.a>.cbs>.num { 135 | font-size: 15px; 136 | font-weight: 550; 137 | } 138 | 139 | #contri>.button { 140 | height: max-content; 141 | margin: 10px 0 0 10px; 142 | } 143 | 144 | .window.winver{ 145 | width: 600px; 146 | height: 550px; 147 | } 148 | 149 | #win-winver>.logo{ 150 | display: flex; 151 | justify-content: center; 152 | } 153 | 154 | #win-winver>.logo>.img{ 155 | background: url(../../icon/logo.svg) center; 156 | background-size: cover; 157 | height: 80px; 158 | width: 80px; 159 | margin:10px; 160 | } 161 | 162 | #win-winver>.logo>p{ 163 | background-image: linear-gradient(100deg, var(--theme-1), var(--theme-2)); 164 | -webkit-background-clip: text; 165 | background-clip: text; 166 | -webkit-text-fill-color: transparent; 167 | font-size: 45px; 168 | font-weight: 550; 169 | font-family: 'Microsoft Yahei UI'; 170 | margin: 15px; 171 | } 172 | 173 | #win-winver>hr{ 174 | width: calc(100% - 20px); 175 | margin: 10px; 176 | } 177 | 178 | #win-winver p{ 179 | margin: 0 50px; 180 | } 181 | 182 | #win-winver>.mesg:hover{ 183 | text-decoration: underline!important; 184 | } 185 | 186 | #win-winver>.mesg:active{ 187 | opacity: 0.5; 188 | transition: 30ms; 189 | } 190 | 191 | #win-winver>.bottom{ 192 | position: absolute; 193 | bottom: 80px; 194 | } 195 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Windows 12 网页版 2 | 3 | > **🎉🎉Windows 12 网页版一周岁生日快乐!`o(^o^)o`** 4 | > **向在座的各位的支持表示诚挚的感谢!** 5 | 6 | ``` 7 | 千古有冬夏,一载经春秋。破浪长风扶摇起,夜深星源起处。 8 | 天涯何处觅知音,春秋冬夏君相昔。 9 | 一路有你,纵冰塞黄河,雪满太行,不畏,丈夫未可轻年少。 10 | 愿我如星君如月,夜夜流光相皎洁。 11 | 12 | 感念一年来大家的支持与鼓励,批评和建议。 13 | Windows 12 的明天在大家的努力下会更灿烂美好! 14 | ————星源 23/8/28 15 | ``` 16 | 17 | --- 18 | 19 | > 作者今年初三了,不会做什么功能的更新了。维护和继续开发交给我们的 @User782Tec,详见 [公告](https://github.com/tjy-gitnub/win12/wiki/%E5%85%AC%E5%91%8A-Notices)。 20 | 21 | ``` 22 | 寒窗苦读九春秋,一朝定乾坤。 23 | 山岭越尽云雾散,霞光终万道。 24 | 待蟾折桂题金榜,再叙一载过往! 25 | 后会有期,明年再见,各位朋友,洒家告辞! 26 | ————星源 23/8/30 27 | ``` 28 | 29 | --- 30 | 31 | > 🎉🎉项目在 GitHub 上突破✨3.6k✨stars✨啦!芜湖🎊🎈`o(^o^)o` 32 | > 向在座的各位的支持表示诚挚的感谢! 33 | 34 | --- 35 | 36 | - [Windows 12 网页版](#windows-12-网页版) 37 | - [前前言](#前前言) 38 | - [前言](#前言) 39 | - [特别感谢](#特别感谢) 40 | - [效果展示](#效果展示) 41 | - [在线体验](#在线体验) 42 | - [安装和使用](#安装和使用) 43 | - [前景规划](#前景规划) 44 | - [开源说明](#开源说明) 45 | - [贡献须知](#贡献须知) 46 | 47 | ## 前前言 48 | 49 | 最近(不久之前)看到有一些冒充我们的,在此做个声明: 50 | 51 | 我们项目是由 tjy-gitnub(初三),NB-group(预备),782(初一),三位开发者共同开发的! 52 | 53 | 我们只在 GitHub、Bilibili 和爱发电上有官方账号! 54 | 55 | GitHub: 56 | 57 | 去贡献者里看一下吧~ 58 | 59 | Bilibili: 60 | 61 | tjy-gitnub: 62 | 63 | ![image](https://github.com/tjy-gitnub/win12/assets/121747915/6b13f81a-2a33-4265-abee-44c3796c2817) 64 | 65 | NB-group: 66 | 67 | ![image](https://github.com/tjy-gitnub/win12/assets/121747915/9dad6cac-e0e7-44b3-975e-41eaf33520dd) 68 | 69 | 782: 70 | 71 | ![image](https://github.com/tjy-gitnub/win12/assets/121747915/e475890f-010d-4e47-9ac6-fd4abad26218) 72 | 73 | 爱发电: 74 | 75 | 全世界唯一可以捐款的官方账号!擦亮你的双眼!不要给其他人捐款! 76 | 77 | ![image](https://github.com/tjy-gitnub/win12/assets/121747915/c4a7e71c-ac41-4ab5-ba87-967d188ca2cc) 78 | 79 | 链接:https://afdian.net/a/qstudio?tab=feed 80 | 81 | **我们的项目及源代码绝对不进行强制收费!如果看到售卖本项目且没有注明原项目链接的,或违反EPL-2.0开源协议及本项目开源说明的,欢迎举报!** 82 | 83 | ## 前言 84 | 85 | 最近(很久以前)看到 Windows 12 概念版(Powered by PowerPoint)后深受启发,决定做一个 Windows 12 网页版,就像 [Windows 11 网页版](https://win11.blueedge.me/) 一样。 86 | 87 | 参考 [前景规划](#前景规划)。 88 | 89 | 精美的 ui 设计,流畅丰富的动画,各种高级的功能(相较于网页版)。 90 | 91 | > 移动端适配不太完善,开桌面版网站凑合着用吧 `>v-)o` 92 | 93 | ### 特别感谢 94 | 95 | 特别感谢以下赞助者: 96 | 97 | - CursoR_光标() 98 | - Baymax() 99 | 100 | 在此对以上赞助者表示公开鸣谢! 101 | 102 | ## 效果展示 103 | 104 | > 新的版本有很多变化,仅供参考,请以实物为准(你点一下 [这里](https://tjy-gitnub.github.io/win12/desktop.html) 就知道了啊,不麻烦`-_-)o` ) 105 | 106 | ![image](https://tjy-gitnub.github.io/win12/img/start-menu.png) 107 | 108 | *开始菜单* 109 | 110 | ![image](https://tjy-gitnub.github.io/win12/img/colorful-apps.png) 111 | 112 | *丰富的应用* 113 | 114 | ![image](https://tjy-gitnub.github.io/win12/img/dark-mode.png) 115 | 116 | *深色模式* 117 | 118 | ![image](https://tjy-gitnub.github.io/win12/img/ai-copilot.png) 119 | 120 | *AI Copilot* 121 | 122 | ## 在线体验 123 | 124 | [在线预览](https://tjy-gitnub.github.io/win12/desktop.html) 125 | 126 | 有点慢,稍等一下~ 127 | 128 | ## 安装和使用 129 | 130 | 下载代码,无需安装,打开 desktop.html 即可。 131 | 132 | ## 前景规划 133 | 134 | 关于该项目的路径规划: 135 | 136 | - [x] 基本功能与应用 137 | - [x] 外观整体优化 138 | - [x] 加入特效 139 | - [x] 窗口功能 140 | - [x] 应用完善 141 | - [x] 添加更多个性化方面的设置 142 | - [x] 添加 Edge 应用 143 | - [ ] 为更多应用添加标签页 144 | - [x] 完善小组件,添加到桌面等功能 145 | - [x] 动态壁纸 146 | - [ ] 更多任务栏的自定义 147 | - [ ] 丰富应用生态,添加 Microsoft Store 148 | - [ ] 完善设置及 Windows 更新 149 | 150 | 下面是一些...呃......畅..想 `~o~)/`: 151 | 152 | - [x] 建立文件系统 153 | - [ ] 建立自己的可执行文件机制 154 | - [ ] 将 .exe 文件转化并执行 155 | - [ ] 提供更多 api 供应用调用 156 | - [x] 内置浏览器内核,成为应用 157 | - [ ] 将项目更名为 "Windows 12" 158 | - [ ] 封装到 Windows 系统中 159 | - [ ] 将启动程序设为此应用 160 | - [ ] 去除多余系统功能,封装成独立的操作系统 161 | - [ ] 将项目更名为 "Doswin 1.0" 162 | - [ ] 适配量子计算机 163 | - [x] 接入chatgpt 164 | - [ ] 将项目更名为 "550W" 165 | 166 | ## 开源说明 167 | 168 | 本项目作者:谭景元(tjy-gitnub) 169 | 170 | 本项目链接: 171 | 172 | 此项目是一个开源项目。此项目使用 EPL v2.0 开源许可。开源许可是具有法律效力的合同,请自觉遵守开源许可,尊重他人劳动。 173 | 174 | 根据许可,你可以对该项目进行传播、分发、修改以及二次发布,包括个人和商业用途,但我方不鼓励一切商业用途。 175 | 176 | 您必须给出源码来源,**包括作者,项目链接**(见上)等,必须使用相同的协议开源。 177 | 178 | 若此项目的源码作为项目的一部分与你私有的源码一起发布时,你可以使用其它协议,**但要声明 EPL 部分的内容并声明此部分继续遵循 EPL 协议**。 179 | 180 | 不是在该项目基础上进行增加、修改的,仅参考源码的,不需要开源,但也仅供学习用途。 181 | 182 | 由于近期发现大量滥用行为,在此规定附加条例: 183 | 184 | - 任何使用本项目者,必须在介绍里附上原作者及项目链接,不得故意隐瞒原项目中的署名信息、原作者或项目链接,不得限制查看原项目中的署名信息、原作者或项目链接,且不得修改原项目中的署名信息; 185 | 186 | - 将本项目用于商业用途者,需要**标明原作者及项目链接**,且**必须**以 EPL 协议开源。未经修改的源代码**不得用于**商业用途; 187 | 188 | - 任何使用本项目者,不得移除或故意隐藏、限制查看本声明; 189 | 190 | - 请您遵守上述规定,我方有权通过法律手段进行合法维权。 191 | 192 | ## 贡献须知 193 | 194 | 详情请见 [贡献指南](./CONTRIBUTING.md)。 195 | -------------------------------------------------------------------------------- /sw.js: -------------------------------------------------------------------------------- 1 | let dymanic = [ 2 | 'api.github.com', 3 | 'tjy-gitnub.github.io/win12-theme', 4 | 'win12server.freehk.svipss.top', 5 | 'assets.msn.cn' 6 | ] 7 | this.addEventListener('fetch', function (event) { 8 | event.respondWith( 9 | caches.match(event.request).then(res => { 10 | let fl = false; 11 | dymanic.forEach(d => { 12 | if (event.request.url.indexOf(d) > 0) { 13 | fl = true; 14 | return; 15 | } 16 | }); 17 | if (fl) { 18 | console.log('动态请求', event.request.url); 19 | return fetch(event.request); 20 | } 21 | return res || 22 | fetch(event.request) 23 | .then(responese => { 24 | // console.log(event.request); 25 | const responeseClone = responese.clone(); 26 | caches.open('def').then(cache => { 27 | console.log('下载数据', responeseClone.url); 28 | cache.put(event.request, responeseClone); 29 | }) 30 | return responese; 31 | }) 32 | .catch(err => { 33 | console.log(err); 34 | }); 35 | }) 36 | ) 37 | }); 38 | const cacheNames = ['def']; 39 | let nochanges = [ 40 | '/win12/fonts/', 41 | '/win12/img/', 42 | '/win12/apps/icons/', 43 | '/win12/jq.min.js', 44 | '/win12/bootstrap-icons.css', 45 | ] 46 | let flag = false; 47 | 48 | function update(force = false) { 49 | caches.keys().then(keys => { 50 | if (keys.includes('def')) { 51 | caches.open('def').then(cc => { 52 | cc.keys().then(key => { 53 | key.forEach(k => { 54 | let fl = true; 55 | if (force) { 56 | console.log('删除数据', k.url); 57 | return cc.delete(k); 58 | } 59 | nochanges.forEach(fi => { 60 | if (RegExp(fi + '\\S+').test(k.url)) { 61 | fl = false; 62 | return; 63 | } 64 | }); 65 | if (fl) { 66 | console.log('删除数据', k.url); 67 | return cc.delete(k); 68 | } 69 | }); 70 | }); 71 | }); 72 | } 73 | }); 74 | } 75 | 76 | 77 | this.addEventListener('message', function (e) { 78 | if (e.data.head == 'update') { 79 | if(e.data.force)update(true); 80 | else update(); 81 | } 82 | }); 83 | 84 | this.addEventListener('activate', update); 85 | 86 | 87 | // let dongtai=[ 88 | // 'api.github.com', 89 | // 'tjy-gitnub.github.io/win12-theme', 90 | // 'win12server.freehk.svipss.top', 91 | // 'assets.msn.cn' 92 | // ] 93 | // this.addEventListener('fetch', function (event) { 94 | // event.respondWith( 95 | // caches.match(event.request).then(res => { 96 | // let fl=false; 97 | // dongtai.forEach(d=>{ 98 | // if(event.request.url.indexOf(d)>0){ 99 | // fl=true; 100 | // return; 101 | // } 102 | // }); 103 | // if(fl){console.log('动态请求',event.request.url);return fetch(event.request);} 104 | // return res || 105 | // fetch(event.request) 106 | // .then(responese => { 107 | // // console.log(event.request); 108 | // const responeseClone = responese.clone(); 109 | // caches.open('def').then(cache => { 110 | // console.log('下载数据', responeseClone.url); 111 | // cache.put(event.request, responeseClone); 112 | // }) 113 | // return responese; 114 | // }) 115 | // .catch(err => { 116 | // console.log(err); 117 | // }); 118 | // }) 119 | // ) 120 | // }); 121 | // const cacheNames = ['def']; 122 | // let nochanges = [ 123 | // '/win12/fonts/', 124 | // '/win12/img/', 125 | // '/win12/apps/icons/', 126 | // '/win12/jq.min.js', 127 | // '/win12/bootstrap-icons.css', 128 | // ] 129 | // let flag = false; 130 | // this.addEventListener('activate', function (event) { 131 | // flag = true; 132 | // console.log('开始更新'); 133 | // event.waitUntil( 134 | // caches.keys().then(keys => { 135 | // if (keys.includes('def')) { 136 | // caches.open('def').then(cc => { 137 | // cc.keys().then(key => { 138 | // key.forEach(k => { 139 | // let fl = true; 140 | // nochanges.forEach(fi => { 141 | // if (RegExp(fi + '\\S+').test(k.url)) { 142 | // fl = false; 143 | // return; 144 | // } 145 | // }); 146 | // if (fl) { 147 | // console.log('删除数据', k.url); 148 | // return cc.delete(k); 149 | // } 150 | // }); 151 | // }) 152 | // }) 153 | // } 154 | // }) 155 | // ); 156 | // event.waitUntil( 157 | // caches.open('def').then(function (cache) { 158 | // return cache.addAll([ 159 | // 'bg-dark.svg' 160 | // ]); 161 | // }) 162 | // ); 163 | // }); 164 | // this.addEventListener('message', function (e) { 165 | // if (e.data.head == 'is_update') { 166 | // if (flag) { 167 | // e.source.postMessage({ 168 | // head: 'update' 169 | // }); 170 | // flag = false; 171 | // } 172 | // } 173 | // }); 174 | -------------------------------------------------------------------------------- /module/tab.js: -------------------------------------------------------------------------------- 1 | let m_tab={ 2 | newtab: (appn,n) => { 3 | app=apps[appn]; 4 | app.tabs.push([app.len++, n]); 5 | console.log(app.tabs) 6 | m_tab.settabs(appn); 7 | }, 8 | settabs: (appn) => { 9 | app=apps[appn]; 10 | let html = ''; 11 | for (let i = 0; i < app.tabs.length; i++) { 12 | const t = app.tabs[i]; 13 | html+=app.settab(t,i); 14 | } 15 | $(`.window.${appn}>.titbar>.tabs`)[0].innerHTML = html; 16 | $(`.window.${appn}>.titbar>.tabs`)[0].innerHTML += ``; 17 | // $(`.window.${appn}>.titbar>.tabs>.tab.`+app.tabs[app.now][0]).addClass('show'); 18 | }, 19 | moving: (appn, t, ev, np) => { 20 | app=apps[appn]; 21 | let deltaLeft, pos; 22 | if (ev.type.match('mouse')) { 23 | deltaLeft = ev.clientX; 24 | } 25 | else if (ev.type.match('touch')) { 26 | deltaLeft = ev.touches[0].clientX; 27 | } 28 | function move_f(e) { 29 | let x; 30 | if (e.type.match('mouse')) { 31 | x = e.clientX; 32 | } 33 | else if (e.type.match('touch')) { 34 | x = e.touches[0].clientX; 35 | } 36 | $(this).css('transform', `translateX(${x - deltaLeft}px)`); 37 | pos = Math.floor((this.offsetLeft + x - deltaLeft - 36 + (this.offsetWidth / 2)) / this.offsetWidth); 38 | if (pos > app.tabs.length - 1) { 39 | pos = app.tabs.length - 1; 40 | } 41 | $(`.window.${appn}>.titbar>.tabs>.tab.left`).removeClass('left'); 42 | $(`.window.${appn}>.titbar>.tabs>.tab.right`).removeClass('right'); 43 | if (np < pos) { 44 | for (let i = np + 1; i <= pos; i++) { 45 | const ta = app.tabs[i]; 46 | if (ta) { 47 | $(`.window.${appn}>.titbar>.tabs>.tab.` + ta[0]).addClass('left'); 48 | } 49 | } 50 | } 51 | else if (np > pos) { 52 | for (let i = pos; i < np; i++) { 53 | const ta = app.tabs[i]; 54 | if (ta) { 55 | $(`.window.${appn}>.titbar>.tabs>.tab.${ta[0]}`).addClass('right'); 56 | } 57 | } 58 | } 59 | }; 60 | page.onmousemove = move_f.bind(t); 61 | page.ontouchmove = move_f.bind(t); 62 | function up_f(e) { 63 | page.onmousemove = null; 64 | page.onmouseup = null; 65 | page.ontouchmove = null; 66 | page.ontouchend = null; 67 | let x; 68 | if (e.type.match('mouse')) { 69 | x = e.clientX; 70 | pos = Math.floor((this.offsetLeft + x - deltaLeft - 36 + (this.offsetWidth / 2)) / this.offsetWidth); 71 | if (pos > app.tabs.length - 1) { 72 | pos = app.tabs.length - 1; 73 | } 74 | } 75 | if (pos == np || pos > app.tabs.length || pos < 0) { 76 | $(this).css('transform', 'none'); 77 | $(this).removeClass('moving'); 78 | $(`.window.${appn}>.titbar>.tabs>.tab.left`).removeClass('left'); 79 | $(`.window.${appn}>.titbar>.tabs>.tab.right`).removeClass('right'); 80 | } 81 | else { 82 | app.tabs.splice(np < pos ? pos + 1 : pos, 0, app.tabs[np]); 83 | app.tabs.splice(np < pos ? np : (np + 1), 1); 84 | m_tab.settabs(appn); 85 | m_tab.tab(appn,pos); 86 | } 87 | } 88 | page.onmouseup = up_f.bind(t); 89 | page.ontouchend = up_f.bind(t); 90 | page.ontouchcancel = up_f.bind(t); 91 | $(t).addClass('moving'); 92 | }, 93 | close: (appn, c) => { 94 | app=apps[appn]; 95 | $(`.window.${appn}>.titbar>.tabs>.tab.${app.tabs[c][0]}`).addClass('close'); 96 | for (let i = c + 1; i < app.tabs.length; i++) { 97 | const _id = app.tabs[i][0]; 98 | $(`.window.${appn}>.titbar>.tabs>.tab.${_id}`).addClass('left'); 99 | } 100 | setTimeout(() => { 101 | $(`#win-${appn}>iframe.${app.tabs[c][0]}`).remove(); 102 | app.tabs.splice(c, 1); 103 | m_tab.settabs(appn); 104 | if (app.tabs.length == 0) { 105 | hidewin(appn); 106 | } 107 | else { 108 | m_tab.tab(appn,app.tabs.length - 1); 109 | } 110 | }, 200); 111 | }, 112 | tab: (appn,c,load=true) => { 113 | focwin(appn); 114 | app=apps[appn]; 115 | app.now = c; 116 | app.tab(c,load); 117 | $(`.window.${appn}>.titbar>.tabs>.tab.show`).removeClass('show'); 118 | $(`.window.${appn}>.titbar>.tabs>.tab.${app.tabs[c][0]}`).addClass('show'); 119 | }, 120 | rename: (appn,n) => { 121 | app=apps[appn]; 122 | console.log(n,app.tabs); 123 | app.tabs[app.now][1] = n; 124 | m_tab.settabs(appn); 125 | m_tab.tab(appn,app.now,false); 126 | }, 127 | } -------------------------------------------------------------------------------- /icon/about.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /disconnected_dark.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Windows 12 网页版 - 网络连接问题解决方案 7 | 8 | 75 | 76 | 77 |
78 |
79 |
Network connection issues
80 |
81 |

The web is different for you. Let us help you get back online!

82 |

Please try the following:

83 |
    84 |
  • Check network cables, modems, and routers
  • 85 |
  • Reconnect to wireless network
  • 86 |
87 |

Error code: ERR_INTERNET_DISCONNECTED

88 |
89 |
90 | 91 | -------------------------------------------------------------------------------- /icon/logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/windows12.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/run.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/icons/explorer/thispc.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/edge.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /icon/folder/music.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /scripts/bios_kernel.js: -------------------------------------------------------------------------------- 1 | var code = "null"; 2 | function addZero(i) { 3 | return i < 10 ? ('0' + i) : i 4 | } 5 | function timeChange() { 6 | d = new Date() 7 | document.getElementById('time').innerHTML = "[" + addZero(d.getHours()) + ":" + addZero(d.getMinutes()) + ":" + addZero(d.getSeconds()) + "]"; 8 | document.getElementById('date').innerHTML = "[" + d.getDate() + "/" + (d.getMonth() + 1) + "/" + d.getFullYear() + "]"; 9 | 10 | //顺便适应高度 11 | // document.getElementById('body').style.height = window.innerHeight + "px"; 12 | // document.getElementById('mainPage').style.height = (window.innerHeight - 150) + 'px'; 13 | // document.getElementById('exitPage').style.height = (window.innerHeight - 150) + 'px'; 14 | } 15 | function toBoot() { 16 | document.getElementById('background').style.display = ''; 17 | setTimeout('document.getElementById(`body`).innerHTML=``;document.getElementById(`body`).style.cssText=`background-color: black;`;', 500); setTimeout('window.location.href=`./boot.html`', 1000); //Boot延迟 18 | } 19 | function BIOS_confirm(tit, okcode, width) { 20 | document.getElementById('confirm-tit').innerHTML = tit; 21 | document.getElementById('exit_confirm').style.display = ''; 22 | document.getElementById('background').style.display = ''; 23 | document.getElementById('confirm').style.width = (window.innerWidth * width / 100) + "px"; 24 | code = okcode; 25 | } 26 | setTimeout("timeChange();setInterval(timeChange,1000)", 1000 - (new Date()).getMilliseconds()); 27 | 28 | var here; 29 | var tab = 0, tab_back = tab; 30 | var btn = 0, btn_back = btn; 31 | var foc = 0, foc_back = foc; 32 | timeChange(); 33 | function ChangePage() { 34 | if (!tab) { 35 | document.getElementById('exitPage').style.display = 'none'; 36 | document.getElementById('mainPage').style.display = ''; 37 | document.getElementById('exit').style.cssText = 'background-color: #0100a2;color: #aaaaaa;'; 38 | document.getElementById('main').style.cssText = 'color: #ffffff;background-color: #aaaaaa;'; 39 | here = 'main'; 40 | tab = 0; 41 | } else { 42 | document.getElementById('mainPage').style.display = 'none'; 43 | document.getElementById('exitPage').style.display = ''; 44 | document.getElementById('main').style.cssText = 'background-color: #0100a2;color: #aaaaaa;'; 45 | document.getElementById('exit').style.cssText = 'color: #ffffff;background-color: #aaaaaa;'; 46 | here = 'exit'; 47 | tab = 1; 48 | } 49 | } 50 | ChangePage(); 51 | h = window.innerHeight * 0.15; 52 | w = window.innerWidth * 0.3; 53 | document.getElementById('confirm').style.height = h + "px"; 54 | document.getElementById('confirm').style.width = w + "px"; 55 | document.oncontextmenu = function () { 56 | return false; 57 | } 58 | var tabs = ['main', 'exit'] 59 | window.onkeydown = function (event) { 60 | event = event || window.event; 61 | tab_back = tab; 62 | if (document.getElementById('background').style.display != '') { 63 | if (event.keyCode == 9) { 64 | event.preventDefault(); 65 | tab++; 66 | foc = 0; 67 | tab = tab % 2; 68 | ChangePage(); 69 | } 70 | if (event.keyCode == 121/*F10=退出*/) { 71 | event.preventDefault(); 72 | eval(document.getElementById('e1').getAttribute('click')); 73 | } 74 | if (event.keyCode == 39) { 75 | event.preventDefault(); 76 | tab++; 77 | } else if (event.keyCode == 37) { 78 | event.preventDefault(); 79 | tab--; 80 | } 81 | if (tab + 1 > 0 && tab + 1 <= tabs.length && foc == 0) { 82 | if ([37, 39].includes(event.keyCode)) { 83 | ChangePage(); 84 | } 85 | } else { 86 | tab = tab_back; 87 | } 88 | foc_back = foc; 89 | if (event.keyCode == 40) { 90 | event.preventDefault(); 91 | foc++; 92 | } else if (event.keyCode == 38) { 93 | event.preventDefault(); 94 | foc--; 95 | } 96 | if (tab == 1 && foc <= 3 && foc >= 0) { 97 | if (!foc) { //0 98 | if (tab) 99 | document.getElementById('exit').style.cssText = 'color: #ffffff;background-color: #aaaaaa;'; 100 | else 101 | document.getElementById('main').style.cssText = 'color: #ffffff;background-color: #aaaaaa;'; 102 | for (var i = 1; i <= 3; i++) 103 | document.getElementById('e' + i).style.color = "#0100a2"; 104 | } else { 105 | if (tab) 106 | document.getElementById('exit').style.cssText = 'color: #0100a2;background-color: #aaaaaa;'; 107 | else 108 | document.getElementById('main').style.cssText = 'color: #0100a2;background-color: #aaaaaa;'; 109 | for (var i = 1; i <= 3; i++) 110 | document.getElementById('e' + i).style.color = "#0100a2"; 111 | document.getElementById('e' + foc).style.color = "#fff"; 112 | if (event.keyCode == 13) { 113 | eval(document.getElementById('e' + foc).getAttribute('click')); 114 | } 115 | } 116 | } else { 117 | foc = foc_back; 118 | } 119 | } else { 120 | btn_back = btn; 121 | if (event.keyCode == 39) { 122 | event.preventDefault(); 123 | btn++; 124 | } else if (event.keyCode == 37) { 125 | event.preventDefault(); 126 | btn--; 127 | } 128 | if ([0, 1].includes(btn)) { 129 | if (btn) {//1 130 | document.getElementById('cancel-btn').style.cssText = "background-color: #000;color: #fff;"; 131 | document.getElementById('ok-btn').style.cssText = "color: #000;background-color: #fff;"; 132 | } else {//0 133 | document.getElementById('ok-btn').style.cssText = "background-color: #000;color: #fff;"; 134 | document.getElementById('cancel-btn').style.cssText = "color: #000;background-color: #fff;"; 135 | } 136 | } else { 137 | btn = btn_back; 138 | } 139 | if (event.keyCode == 13) { 140 | event.preventDefault(); 141 | if (btn) { 142 | eval(document.getElementById('cancel-btn').getAttribute('click')); 143 | } else { 144 | eval(document.getElementById('ok-btn').getAttribute('click')); 145 | } 146 | btn = 0; 147 | document.getElementById('ok-btn').style.cssText = "background-color: #000;color: #fff;"; 148 | document.getElementById('cancel-btn').style.cssText = "color: #000;background-color: #fff;"; 149 | } 150 | } 151 | } -------------------------------------------------------------------------------- /icon/setting.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /apps/icons/explorer/folder.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /widgets.css: -------------------------------------------------------------------------------- 1 | @keyframes shine { 2 | 0% { 3 | border-color: #111; 4 | } 5 | 49% { 6 | border-color: #111; 7 | } 8 | 51% { 9 | border-color: transparent; 10 | } 11 | 98% { 12 | border-color: transparent; 13 | } 14 | 100% { 15 | border-color: #111; 16 | } 17 | } 18 | 19 | .wg { 20 | border-radius: 10px; 21 | box-shadow: 1px 2px 5px var(--sd); 22 | overflow: hidden; 23 | transition: 200ms; 24 | } 25 | 26 | .wg>.titbar { 27 | display: flex; 28 | flex-direction: row-reverse; 29 | } 30 | 31 | .wg>.titbar>.more { 32 | border-radius: 50%; 33 | width: 25px; 34 | height: 25px; 35 | background-color: var(--bggrey); 36 | box-shadow: 2px 2px 5px var(--sd); 37 | margin: 3px 3px 0 0; 38 | text-align: center; 39 | overflow: hidden; 40 | z-index: 1; 41 | } 42 | 43 | .wg>.titbar>.more>.bi { 44 | display: block; 45 | } 46 | 47 | .wg>.titbar>.more:hover>.bi { 48 | background: var(--hover); 49 | } 50 | 51 | .wg>.titbar>.menu { 52 | transition: 200ms cubic-bezier(0.9, 0, 0.1, 1); 53 | max-width: 0; 54 | box-shadow: 2px 2px 5px var(--sd); 55 | overflow: hidden; 56 | margin: 3px 3px 0 3px; 57 | background-color: var(--bggrey); 58 | border-radius: 12.5px; 59 | height: 25px; 60 | flex-grow: 1; 61 | display: flex; 62 | max-width: fit-content; 63 | transform: scaleX(0); 64 | transform-origin: right; 65 | } 66 | 67 | .wg>.titbar>.menu.show { 68 | transform: scaleX(1); 69 | } 70 | 71 | .wg>.titbar>.menu>.a { 72 | width: 25px; 73 | height: 100%; 74 | } 75 | 76 | .wg>.titbar>.menu>.a>.bi { 77 | margin-left: 4px; 78 | } 79 | 80 | .wg>.titbar>.menu>.a:first-child>.bi { 81 | margin-left: 8px; 82 | } 83 | 84 | .wg>.titbar>.menu>.a:first-child, 85 | .wg>.titbar>.menu>.a:last-child { 86 | width: 28px; 87 | } 88 | 89 | .wg>.titbar>.menu>.a.img>img { 90 | width: 18px; 91 | height: 18px; 92 | margin: 3.5px 0 3.5px 6px; 93 | } 94 | 95 | .wg>.titbar>.menu>.a:hover { 96 | background-color: var(--hover); 97 | } 98 | 99 | .wg>.content { 100 | width: 100%; 101 | height: 100%; 102 | margin-top: -28px; 103 | } 104 | 105 | .wg.toolbar { 106 | border-radius: 8px; 107 | height: 100%; 108 | background-color: var(--cm); 109 | backdrop-filter: blur(20px) saturate(1.5); 110 | -webkit-backdrop-filter: blur(20px) saturate(1.5); 111 | box-shadow: 0 1px 2px #44444460, 0px 3px 25px 1px var(--sd); 112 | margin: 0 3px; 113 | } 114 | 115 | .wg.toolbar>.titbar>.more { 116 | width: 18px; 117 | height: 18px; 118 | font-size: 13px; 119 | opacity: 0; 120 | } 121 | 122 | .wg.toolbar:hover>.titbar>.more { 123 | opacity: 1; 124 | } 125 | 126 | .wg.toolbar>.titbar>.menu>.a.addtotb { 127 | display: none; 128 | } 129 | 130 | .wg.desktop>.titbar>.menu>.a.addtodt { 131 | display: none; 132 | } 133 | 134 | .wg.calc { 135 | grid-column: auto / span 2; 136 | grid-row: auto / span 3; 137 | } 138 | 139 | .wg.calc>.content { 140 | display: grid; 141 | grid-template-areas: 142 | "input input input input" 143 | "pow sqrt c jia" 144 | "n7 n8 n9 jian" 145 | "n4 n5 n6 cheng" 146 | "n1 n2 n3 chu" 147 | "dot n0 back ans"; 148 | grid-template-columns: repeat(4, 25%); 149 | grid-template-rows: 25% repeat(5, 15%); 150 | gap: 0px; 151 | } 152 | 153 | .wg.calc>.content .checked { 154 | background-color: var(--mm) !important; 155 | } 156 | 157 | .wg.calc>.content>.container>input { 158 | border: none; 159 | outline: none; 160 | background-color: #00000000; 161 | font-size: 30px; 162 | text-align: end; 163 | color: var(--text); 164 | width: 98%; 165 | border-right: 2px solid transparent; 166 | } 167 | 168 | .wg.calc>.content>.container { 169 | display: flex; 170 | grid-area: input; 171 | width: 100%; 172 | align-items: flex-end; 173 | } 174 | 175 | .wg.calc>.content>.container>input:focus { 176 | animation-name: shine; 177 | animation-duration: 1s; 178 | border-color: #111; 179 | animation-iteration-count: infinite; 180 | } 181 | 182 | .wg.calc>.content>.b { 183 | margin: 5px 5px; 184 | font-size: 25px; 185 | margin: 0; 186 | border: 1px solid var(--hr); 187 | text-align: center; 188 | transition: 50ms; 189 | background: var(--card); 190 | } 191 | 192 | .wg.calc>.content>.b.ans { 193 | border: none; 194 | background-image: linear-gradient(120deg, var(--theme-1), var(--theme-2)); 195 | filter: opacity(0.7); 196 | } 197 | 198 | .wg.calc>.content>.b.ans:hover { 199 | filter: none; 200 | } 201 | 202 | .wg.calc>.content>.b:hover { 203 | background-color: var(--mm); 204 | } 205 | 206 | .wg.weather.menu { 207 | grid-column: auto / span 3; 208 | grid-row: auto / span 1; 209 | } 210 | 211 | .wg.weather.desktop { 212 | grid-column: auto / span 3; 213 | grid-row: auto / span 1; 214 | } 215 | 216 | .wg.weather>.content { 217 | display: flex; 218 | } 219 | 220 | .wg.weather.menu>.content>.img, .wg.desktop.desktop>.content>.img { 221 | width: 70px; 222 | height: 100%; 223 | background-size: cover; 224 | margin: 0 10px; 225 | } 226 | 227 | .wg.weather.menu>.content>.text>.temperature, .wg.weather.desktop>.content>.text>.temperature { 228 | font-size: 30px; 229 | margin: 8px 0; 230 | } 231 | 232 | .wg.weather>.content>.text { 233 | padding-top: 10px; 234 | line-height: 1; 235 | } 236 | 237 | .wg.toolbar.weather>.content>.img { 238 | width: 30px; 239 | height: 100%; 240 | margin: 0 5px 0 10px; 241 | } 242 | 243 | .wg.toolbar.weather>.content>.text { 244 | font-size: 9px; 245 | padding-top: 5px; 246 | margin-right: 10px; 247 | } 248 | 249 | .wg.toolbar.weather>.content>.text>.temperature { 250 | font-size: 19px; 251 | } 252 | 253 | .wg.monitor.menu { 254 | grid-column: auto / span 3; 255 | grid-row: auto / span 1; 256 | } 257 | 258 | .wg.monitor.desktop { 259 | grid-column: auto / span 3; 260 | grid-row: auto / span 1; 261 | } 262 | 263 | .wg.monitor>.content>.text>.type { 264 | font-size: 1.4em; 265 | } 266 | 267 | .wg.monitor>.content { 268 | display: flex; 269 | flex-direction: row; 270 | gap: 20px; 271 | align-items: center; 272 | } 273 | 274 | .wg.monitor>.content>.container { 275 | width: 60px; 276 | height: 60px; 277 | position: relative; 278 | margin-left: 13px; 279 | } 280 | 281 | .wg.monitor>.content>.container>.text { 282 | font-size: 0.9em; 283 | } 284 | 285 | .wg.monitor>.content>.container>svg>circle:first-child { 286 | fill: none; 287 | stroke: var(--hover-b); 288 | stroke-width: 6px; 289 | } 290 | 291 | .wg.monitor>.content>.container>svg>circle:last-child { 292 | stroke: #fff; 293 | fill: none; 294 | stroke-width: 2px; 295 | transform: rotate(90deg); 296 | stroke-width: 6px; 297 | stroke-linecap: round; 298 | } 299 | 300 | .wg.monitor>.content>.container>div.text { 301 | position: absolute; 302 | width: 60px; 303 | height: 60px; 304 | top: 0px; 305 | left: 0px; 306 | display: flex; 307 | align-items: center; 308 | justify-content: center; 309 | } 310 | 311 | .wg.monitor.toolbar>.content { 312 | font-size: 0.7em; 313 | gap: 10px; 314 | min-width: 180px; 315 | line-height: 1.1; 316 | } 317 | 318 | .wg.monitor.toolbar>.content>.container, .wg.monitor.toolbar>.content>.container>svg, .wg.monitor.toolbar>.content>.container>.text { 319 | height: 40px; 320 | width: 40px; 321 | } 322 | 323 | .wg.monitor.toolbar>.content>.container>svg>circle { 324 | cx: 20px; 325 | cy: 20px; 326 | r: 15px; 327 | stroke-width: 5px; 328 | } 329 | 330 | .wg.monitor.toolbar>.content>.container>svg>circle:last-child { 331 | cy: -20px !important; 332 | } 333 | 334 | /* .wg.monitor.toolbar>.content>.text { 335 | font-siz 336 | } */ 337 | -------------------------------------------------------------------------------- /apps/style/explorer.css: -------------------------------------------------------------------------------- 1 | .window.explorer>.titbar>.tabs>.tab>p>img{ 2 | width: 25px; 3 | height: 25px; 4 | margin-right: 5px; 5 | } 6 | 7 | .window.explorer>.titbar>.tabs>.tab>p{ 8 | display: flex !important; 9 | align-items: center; 10 | } 11 | 12 | #win-explorer { 13 | display: flex; 14 | flex-direction: column; 15 | } 16 | 17 | #win-explorer>.page { 18 | display: flex; 19 | flex-grow: 1; 20 | overflow: hidden; 21 | } 22 | 23 | #win-explorer>.page>.menu { 24 | min-width: 250px; 25 | height: 100%; 26 | overflow-y: auto; 27 | margin-right: 6px; 28 | padding-right: 2px; 29 | } 30 | 31 | #win-explorer>.page>.menu>.card { 32 | margin: 10px 0 10px 15px; 33 | border-radius: 8px; 34 | background-color: var(--card); 35 | padding: 4px; 36 | box-shadow: 0 1px 2px 1px var(--s3d); 37 | /* border: 1.5px solid #6f6f6f30; */ 38 | } 39 | 40 | #win-explorer>.page>.menu>.card>.title { 41 | padding: 6px 10px; 42 | font-weight: 550; 43 | } 44 | 45 | #win-explorer>.page>.menu>.card>list>a { 46 | padding: 4px 5px 4px 20px; 47 | font-size: 15px; 48 | border-radius: 7px; 49 | transition: 100ms; 50 | display: flex; 51 | } 52 | 53 | #win-explorer>.page>.menu>.card>list>a.check { 54 | background-color: var(--hover) !important; 55 | } 56 | 57 | #win-explorer>.page>.menu>.pinned>list>a>img { 58 | width: 18px; 59 | height: 18px; 60 | margin-top: 2px; 61 | margin-right: 5px; 62 | } 63 | 64 | #win-explorer>.page>.menu>.tags>list>a>span { 65 | width: 13px; 66 | height: 13px; 67 | margin-left: 4px; 68 | margin-top: 4px; 69 | margin-right: 7px; 70 | border-radius: 50%; 71 | box-shadow: 0 0 5px var(--sd); 72 | } 73 | 74 | #win-explorer>.page>.main { 75 | flex-grow: 1; 76 | height: 100%; 77 | display: flex; 78 | flex-direction: column; 79 | overflow: hidden; 80 | padding-left: 2px; 81 | } 82 | 83 | #win-explorer>.page>.main>.tool { 84 | width: 100%; 85 | height: 42px; 86 | display: flex; 87 | padding: 0 10px 5px 10px; 88 | margin-top: 3px; 89 | align-items: center; 90 | } 91 | 92 | #win-explorer>.page>.main>.tool>.b { 93 | height: 33px; 94 | padding: 6px 8px; 95 | border-radius: 7px; 96 | transition: 100ms; 97 | margin: 0 1px; 98 | } 99 | 100 | #win-explorer>.page>.main>.tool>.b.t { 101 | display: flex; 102 | align-items: center; 103 | font-size: 15px; 104 | } 105 | 106 | #win-explorer>.page>.main>.tool>.b.t>img { 107 | display: flex; 108 | margin-right: 5px; 109 | } 110 | 111 | #win-explorer>.page>.main>.tool>.b:hover { 112 | background-color: var(--hover); 113 | } 114 | 115 | #win-explorer>.page>.main>.tool>.b>img { 116 | width: 20px; 117 | height: 20px; 118 | } 119 | 120 | #win-explorer>.page>.main>.tool>.hr { 121 | width: 2px; 122 | height: 25px; 123 | background-color: #7f7f7f7f; 124 | border-radius: 10px; 125 | margin: 5px 3px; 126 | } 127 | 128 | #win-explorer>.page>.main>.content { 129 | width: calc(100% - 15px); 130 | flex-grow: 1; 131 | background-color: var(--card); 132 | border-radius: 8px; 133 | margin: 0 15px 10px 0; 134 | padding: 13px 10px 40px 10px; 135 | overflow-y: auto; 136 | /* border: 1.5px solid #6f6f6f30; */ 137 | box-shadow: 0 1px 2px 1px var(--s3d); 138 | } 139 | 140 | #win-explorer>.path { 141 | height: 35px; 142 | width: 100%; 143 | display: flex; 144 | padding: 4px 10px 0 10px; 145 | align-items: center; 146 | /* margin-bottom: 10px; */ 147 | } 148 | 149 | /* #win-explorer>.path>.btn>.bi { 150 | font-size: 15px; 151 | } */ 152 | 153 | #win-explorer>.path>.front.disabled, #win-explorer>.path>.back.disabled { 154 | filter: contrast(0.2); 155 | pointer-events: none; 156 | } 157 | 158 | #win-explorer>.path>.btn { 159 | transition: 100ms; 160 | font-size: 17px; 161 | text-align: center; 162 | padding-top: 4px; 163 | min-width: 33px; 164 | } 165 | #win-explorer>.path>.tit { 166 | overflow: hidden; 167 | display: flex; 168 | /* background-color: var(--bg70); */ 169 | flex-grow: 1; 170 | margin: 0px 10px 0px 5px; 171 | border-radius: 7px; 172 | height: 32px; 173 | /* align-items: center; */ 174 | } 175 | 176 | #win-explorer>.path>.tit>img { 177 | width: 22px; 178 | height: 22px; 179 | margin-top: 2px; 180 | } 181 | 182 | #win-explorer>.path>.tit>.path{ 183 | display: flex; 184 | align-items: center; 185 | overflow-y:hidden; 186 | /* flex-grow: 1; */ 187 | width: calc(100% - 35px); 188 | } 189 | 190 | #win-explorer>.path>.tit>.path::-webkit-scrollbar{ 191 | height: 2px; 192 | } 193 | #win-explorer>.path>.tit>.path::-webkit-scrollbar-thumb { 194 | background: #7f7f7f70; 195 | background-clip: padding-box; 196 | border: 0px solid transparent; 197 | border-radius: 10px; 198 | } 199 | 200 | 201 | #win-explorer>.path>.tit>.path>* { 202 | display: block; 203 | height: 100%; 204 | white-space:nowrap; 205 | } 206 | 207 | #win-explorer>.path>.tit>.path>.arrow { 208 | opacity: 0.4; 209 | font-size: 14px; 210 | line-height: 1; 211 | height: 14px; 212 | margin: 0 4px; 213 | } 214 | 215 | #win-explorer>.path>.tit>.path>.text { 216 | padding: 2px 5px; 217 | height: min-content; 218 | border-radius: 5px; 219 | font-size: 15px; 220 | transition: 50ms; 221 | } 222 | 223 | #win-explorer>.path>.tit>.path>.text:hover { 224 | background-color: var(--hover-b); 225 | } 226 | 227 | #win-explorer>.path>.tit>.path>.text:active { 228 | opacity: 0.8; 229 | } 230 | 231 | #win-explorer>.path>.tit>.icon { 232 | width: 25.6px; 233 | margin-top: -1px; 234 | margin-left: 3px; 235 | margin-right: 5px; 236 | background-size: contain; 237 | background-position: 50% 50%; 238 | background-repeat: no-repeat; 239 | } 240 | 241 | /* #win-explorer>.path>.tit:hover{ 242 | height: min-content; 243 | min-width: 100px; 244 | background: var(--unfoc); 245 | border-radius: 5px; 246 | border: 1.5px solid #6f6f6f30; 247 | padding: 3px 5px; 248 | margin: 0 5px 3px 0; 249 | box-shadow: 2px 2px 5px var(--sd); 250 | z-index: 1; 251 | } */ 252 | 253 | /* #win-explorer>.path>.search{ 254 | flex-grow: 1; 255 | } */ 256 | 257 | #win-explorer>.path>.search { 258 | min-width: 170px; 259 | width: 26%; 260 | max-width: 400px; 261 | } 262 | 263 | #win-explorer>.path>.search>* { 264 | float: right; 265 | } 266 | 267 | #win-explorer>.path>.search>.input { 268 | padding-left: 30px; 269 | } 270 | 271 | #win-explorer>.path>.search>input-before { 272 | margin-top: 4px; 273 | margin-right: -23px; 274 | } 275 | 276 | #win-explorer>.page>.main>.content>.view { 277 | width: 100%; 278 | height: max-content; 279 | display: flex; 280 | flex-direction: column; 281 | } 282 | 283 | #win-explorer>.page>.main>.content>.view>* { 284 | animation: exp-show 200ms; 285 | } 286 | 287 | @keyframes exp-show { 288 | 0% { 289 | transform: translateX(-10px); 290 | opacity: 0; 291 | } 292 | 293 | 100% { 294 | transform: none; 295 | opacity: 1; 296 | } 297 | } 298 | 299 | #win-explorer>.page>.main>.content>.view>.info { 300 | color: #888; 301 | text-align: center; 302 | } 303 | 304 | #win-explorer>.page>.main>.content>.view>.item { 305 | width: 100%; 306 | padding: 2px 5px; 307 | border-radius: 5px; 308 | display: flex; 309 | border: 1.5px solid transparent; 310 | font-size: 14px; 311 | align-items: center; 312 | height: 30px; 313 | transition: 40ms, transform 400ms cubic-bezier(0.14, 1.02, 0.17, 0.03); 314 | } 315 | 316 | #win-explorer>.page>.main>.content>.view>.item:active { 317 | transform: scale(0.99); 318 | transform-origin: bottom; 319 | } 320 | 321 | #win-explorer>.page>.main>.content>.view>.item>img { 322 | width: 25px; 323 | height: 25px; 324 | margin-right: 5px; 325 | } 326 | 327 | #win-explorer>.page>.main>.content>.view>.item.file>img { 328 | width: 22px; 329 | height: 22px; 330 | margin-left: 2px; 331 | margin-right: 7px; 332 | } 333 | 334 | #win-explorer>.page>.main>.content>.view>.item:hover { 335 | background-color: var(--hover); 336 | /* border: 1.5px solid #6f6f6f30; */ 337 | box-shadow: 0 1px 2px var(--s3d); 338 | } 339 | 340 | #win-explorer>.page>.main>.content>.view>.item>.input { 341 | border-radius: 5px; 342 | /* background: none; */ 343 | font-size: 14px; 344 | border-width: 2px; 345 | } --------------------------------------------------------------------------------