diff --git a/README.md b/README.md index e89797b..239c44b 100644 --- a/README.md +++ b/README.md @@ -12,7 +12,7 @@ ![文件资源管理器](https://user-images.githubusercontent.com/71509955/188390819-362a2986-95cb-4d79-84e4-333b4136a792.png) *文件资源管理器* -还有搜索等等功能。 +还有搜索、计算器等等功能。 更多功能还在制作之中... ## 在线体验 diff --git a/apps/about/main.css b/apps/about/main.css new file mode 100644 index 0000000..69bf07e --- /dev/null +++ b/apps/about/main.css @@ -0,0 +1,59 @@ +#win-about{ + display: flex; + height: calc(100% - 30px); +} + +#win-about>.menu{ + height: 100%; + min-width: 200px; + padding: 3px; +} + +#win-about>.menu>list>*{ + padding: 5px 10px; +} + +#win-about>.cnt{ + height: 100%; + flex-grow: 1; + overflow: auto; +} + +#win-about>.cnt .tit{ + margin: 0; + display: flex; +} + +#win-about>.cnt .tit>span{ + background-color: #2983cc; + border-radius: 10px; + width: 6px; + margin: 5px 5px; + transition: 200ms; + opacity: 0; +} + +#win-about>.cnt .tit:hover>span{ + opacity: 1; +} + +#win-about>.update>div>details{ + background-color: #ffffff50; + padding: 10px; + border-radius: 10px; + box-shadow: 3px 3px 5px #7f7f7f7f; + margin: 10px 10px 0 0; + transition: 200ms; +} + +#win-about>.update>div>details>summary{ + font-size: 17px; +} + +#win-about>.update>div>details>summary>span{ + font-weight: 900; +} + +#win-about>.update>div>details>p{ + margin-left: 10px; +} \ No newline at end of file diff --git a/apps/calc/main.css b/apps/calc/main.css index 9e7ffbc..89b9de2 100644 --- a/apps/calc/main.css +++ b/apps/calc/main.css @@ -34,11 +34,6 @@ padding-top: 5px; } #win-calc>.keyb>.b.ans{ - width: 71px; - margin: -157px 5px 5px 5px; - padding-top: 75px; - height: 233px; - border-radius: 35px; background-color: #2983cc50; } #win-calc>.keyb>.b.ans:hover{ diff --git a/apps/explorer/main.css b/apps/explorer/main.css index 4c1b2ce..70904b9 100644 --- a/apps/explorer/main.css +++ b/apps/explorer/main.css @@ -51,7 +51,7 @@ #win-explorer>.main{ flex-grow: 1; - height: 100%; + height: calc(100% - 32px); display: flex; flex-direction: column; } @@ -102,9 +102,10 @@ flex-grow: 1; background-color: #ffffff50; border-radius: 10px; - margin: -10px 20px 45px 0; + margin: -10px 10px 10px 0; padding: 8px; box-shadow: 3px 3px 8px #7f7f7f6f; + overflow-y: auto; } #win-explorer>.main>.content>.title{ diff --git a/desktop.css b/desktop.css index ef35058..4cb8625 100644 --- a/desktop.css +++ b/desktop.css @@ -1,10 +1,6 @@ @import "./bootstrap-icons.css"; @import "./base.css"; -:root { - --theme: #fff; - --theme-text: #ddd; -} p { margin: 0; @@ -16,17 +12,19 @@ body { } .a { - color: var(--them-text); - text-decoration: none; + color: #000; + text-decoration: none !important; cursor: pointer; } -.a:hover { - color: var(--them-text); +a.jump{ + cursor: alias !important; + text-decoration: underline; + color: #2983cc; } body { - color: var(--them-text); + color: #000; user-select: none; } @@ -88,7 +86,8 @@ body { } .dock.about { - width: 330px; + cursor: pointer; + width: 280px; font-size: 18px; display: block; overflow: hidden; @@ -230,7 +229,7 @@ body { display: none; position: absolute; bottom: 0px; - height: 500px; + height: calc(90% - 120px); width: 800px; left: calc(50% - 400px); border-radius: 20px; @@ -249,16 +248,18 @@ body { #start-menu.show { display: flex; - height: 594px; + height: calc(100% - 120px); + max-height: 594px; bottom: 60px; opacity: 1; } #start-menu.max { - width: 100%; - height: 100%; left: 0; top: 0; + width: 100%; + max-height: 100%; + height: 100%; border-radius: 0; } #start-menu.max>#s-m-l>#s-m-user{ @@ -274,6 +275,8 @@ body { height: 100%; padding: 0 10px; transition: 400ms; + display: flex; + flex-direction: column; } #start-menu.max>#s-m-l{ @@ -297,6 +300,8 @@ input-before { #s-m-l>list { margin-left: 5px; margin-top: 40px; + flex-grow: 1; + overflow: auto; } #s-m-l>list>a { @@ -524,7 +529,7 @@ input-before { display: none; position: absolute; bottom: 0px; - height: 500px; + height: calc(90% - 120px); width: 600px; left: calc(50% - 300px); border-radius: 20px; @@ -544,9 +549,10 @@ input-before { } #search-win.show { + height: calc(100% - 120px); + max-height: 594px; display: flex; flex-direction: column; - height: 600px; bottom: 60px; opacity: 1; } @@ -588,6 +594,7 @@ input-before { #search-win>.ans{ display: flex; flex-grow: 1; + overflow: auto; } #search-win>.ans>.list{ width: 250px; @@ -684,6 +691,21 @@ input-before { text-align: center; transition: 80ms; padding: 0 3px; + color: #888; + cursor: inherit; +} + +.sm-app.enable { + color: #000; + cursor: pointer; +} + +.sm-app.enable:hover { + background-color: #ffffff70; +} + +.sm-app.enable>*:first-child { + filter: brightness(1.2); } .sm-app>*:first-child { @@ -691,6 +713,7 @@ input-before { width: 34px; margin-top: 12px; transition: 200ms; + filter: contrast(0.4) brightness(0.8); } .sm-app>*:last-child { @@ -701,7 +724,7 @@ input-before { } .sm-app:hover { - background-color: #ffffff70; + background-color: #cccccc40; } .sm-app:active { diff --git a/desktop.html b/desktop.html index 23699d0..7d70595 100644 --- a/desktop.html +++ b/desktop.html @@ -20,6 +20,7 @@ + @@ -73,7 +74,7 @@ setTimeout(()=>{$('#start-menu').removeClass('show-begin');},200);">

计算器

其它

-

Microsoft Edge

 +

相机
@@ -115,20 +116,22 @@
- -

计算器(可用)

 +

计算器

相机

 + +

反馈中心

Windows 安全中心

 -

Microsoft Edge

 -

关于Win12网页版

 + -

文件资源管理器(可用)

 -

入门

 +

文件资源管理器

记事本

 - -

设置 (可用)

 +

设置

Microsoft Store

任务管理器

Teams

 @@ -249,9 +252,8 @@
+ onclick="if($(this).hasClass('show')){$(this).removeClass('show')}else{$(this).addClass('show')}"> Windows 12 网页版 谭景元原创 - 关于...

Windows 12 网页版是一个开放源项目,
希望让用户在网络上预先体验 Windows 12,
内容可能与 Windows 12 正式版本不一致。
@@ -447,22 +449,22 @@

+ 𝑥² + √𝑥 + C + - - - × - ÷ 7 8 9 - C + - 4 5 6 - + × 1 2 3 - + ÷ . 0 @@ -470,6 +472,63 @@
+
+
+ +

关于 Windows12 网页版

+
+ + + + + + + + + +
+
+
+
+ + 简介 + 更新记录 + +
+
+

Windows 12 网页版

+
+

简介

+

  Windows 12 网页版是一个开源项目, 由谭景元原创, 使用标准网络技术,例如 Html、CSS 和 Javascript, 希望让用户在网络上预先体验 Windows 12。

+

  因为这只是概念版，所以内容可能与 Windows 12 正式版本不一致。

+

  由于这是一个开源项目，你可以在任何媒介以任何形式复制、发行本作品。 + 你还可以对该项目进行修改、转换或以本作品为基础进行创作。 + 但您必须给出适当的署名，您必须提供创作者姓名、作品链接，同时标明是否对此作了修改。您可以用任何合理的方式来署名，但是不得以任何方式暗示许可方认可您或您的使用。

+

  此项目绝不附属于微软,且不应与微软操作系统或产品混淆, 这也不是 Windows365 cloud PC

+

  本项目中微软、Windows和其他示范产品是微软公司的商标

+
+
+

其它

+

  此项目已发布至 Github, 点击此处查看

+

  若您对于该项目有任何意见或建议，请在 Github 上提交 issues, 您的问题会被尽可能快地解决

+
+
+ +
+
\ No newline at end of file diff --git a/desktop.js b/desktop.js index 0248973..4088ce7 100644 --- a/desktop.js +++ b/desktop.js @@ -74,4 +74,17 @@ calc_tit.addEventListener('mousedown', function (e) { }) main.addEventListener('mouseup', function (e) { main.removeEventListener('mousemove', calc_move); +}) +const about_tit = document.querySelector('.window.about>.titbar'); +const about_win = document.querySelector('.window.about'); +function about_move(e) { + about_win.setAttribute('style', `left:${e.clientX - deltaLeft}px;top:${e.clientY - deltaTop}px`) +} +about_tit.addEventListener('mousedown', function (e) { + deltaLeft = e.clientX - about_win.offsetLeft; + deltaTop = e.clientY - about_win.offsetTop; + main.addEventListener('mousemove', about_move) +}) +main.addEventListener('mouseup', function (e) { + main.removeEventListener('mousemove', about_move); }) \ No newline at end of file diff --git a/icon/about.png b/icon/about.png new file mode 100644 index 0000000..45cc120 Binary files /dev/null and b/icon/about.png differ diff --git a/icon/edge.png b/icon/edge.png deleted file mode 100644 index 69ecc4e..0000000 Binary files a/icon/edge.png and /dev/null differ diff --git a/icon/feedback.png b/icon/feedback.png new file mode 100644 index 0000000..bf69375 Binary files /dev/null and b/icon/feedback.png differ diff --git a/icon/getstarted.png b/icon/getstarted.png deleted file mode 100644 index eb72665..0000000 Binary files a/icon/getstarted.png and /dev/null differ