Skip to content

Commit 64e4594

Browse files
NeserCodeNeserCode
committed
update style
add btns
1 parent d8a745d commit 64e4594

File tree

5 files changed

+93
-60
lines changed

5 files changed

+93
-60
lines changed

‎sql/table.sql‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,6 @@ create table team_leetcode_submit(
4848
FOREIGN KEY fk_userid(userid) REFERENCES team_user_info(id)
4949
);
5050

51-
-- https://img2.woyaogexing.com/2020/12/10/7d32ba291a204ddbbe24ceb2551c922b!400x400.jpeg
52-
5351

5452

5553

‎src/components/CheckDays/index.vue‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -239,12 +239,14 @@ export default {
239239
@apply w-full h-full;
240240
}
241241
.title {
242-
@apply sticky inline-block w-full h-full top-0 mx-4 px-4 py-4 text-lg font-bold text-left font-mono;
242+
@apply sticky inline-block w-full h-full top-0 px-4 py-4 text-lg font-bold text-left font-mono
243+
border-2 rounded-t-sm border-gray-200 dark:border-gray-600;
243244
z-index: 2001;
244245
}
245246
246247
.checkDays {
247-
@apply flex flex-wrap justify-center text-left;
248+
@apply flex flex-wrap justify-center text-left py-4 border-2 border-t-0
249+
border-gray-200 dark:border-gray-600;
248250
}
249251
.checkDays span.notSignSpan {
250252
@apply inline-block text-base font-semibold;
@@ -259,11 +261,11 @@ export default {
259261
}
260262
.day {
261263
@apply inline-flex w-8 h-8 rounded justify-center items-center px-2 py-1 border-2
262-
mx-2 my-1
264+
mx-2 my-1 border-gray-300 dark:border-gray-600
263265
text-base font-semibold transition border-transparent;
264266
}
265267
.today {
266-
@apply border-blue-500;
268+
@apply border-blue-500 dark:border-green-300;
267269
}
268270
269271
@media (prefers-color-scheme: dark) {
@@ -274,10 +276,10 @@ export default {
274276
@apply bg-gray-600;
275277
}
276278
.day {
277-
@apply bg-gray-600;
279+
@apply bg-gray-800;
278280
}
279281
.day.checked {
280-
@apply bg-gray-800;
282+
@apply bg-gray-600;
281283
}
282284
}
283285

‎src/components/Frameworks/Header/index.vue‎

Lines changed: 4 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -7,42 +7,12 @@
77
<div class="headOpArea">
88
<div class="minimize option" @click="handleMinimizeWindow">
99
<a>
10-
<svg
11-
t="1634436877401"
12-
class="icon"
13-
viewBox="0 0 1024 1024"
14-
version="1.1"
15-
xmlns="http://www.w3.org/2000/svg"
16-
p-id="3418"
17-
:width="headIconSize"
18-
:height="headIconSize"
19-
>
20-
<path
21-
d="M96 768h832c17.673 0 32 14.327 32 32s-14.327 32-32 32H96c-17.673 0-32-14.327-32-32s14.327-32 32-32z"
22-
p-id="3419"
23-
:fill="headIconFill.normal"
24-
/>
25-
</svg>
10+
<el-icon><Minus /></el-icon>
2611
</a>
2712
</div>
2813
<div class="maximize option" @click="handleMaximizeWindow">
2914
<a v-show="!isAppFullScreen">
30-
<svg
31-
t="1634294452726"
32-
class="icon"
33-
viewBox="0 0 1024 1024"
34-
version="1.1"
35-
xmlns="http://www.w3.org/2000/svg"
36-
p-id="6288"
37-
:width="headIconSize"
38-
:height="headIconSize"
39-
>
40-
<path
41-
d="M339.432 63.594H99.944c-19.851 0-36 16.149-36 36v239.488c0 17.673 14.327 32 32 32s32-14.327 32-32V127.594h211.487c17.673 0 32-14.327 32-32 0.001-17.673-14.326-32-31.999-32zM339.432 895.503H127.944V684.016c0-17.673-14.327-32-32-32s-32 14.327-32 32v239.487c0 19.851 16.149 36 36 36h239.487c17.673 0 32-14.327 32-32s-14.326-32-31.999-32zM928 651.915c-17.673 0-32 14.327-32 32v211.487H684.513c-17.673 0-32 14.327-32 32s14.327 32 32 32H924c19.851 0 36-16.149 36-36V683.915c0-17.673-14.327-32-32-32zM924 64.151H684.513c-17.673 0-32 14.327-32 32s14.327 32 32 32H896v211.488c0 17.673 14.327 32 32 32s32-14.327 32-32V100.151c0-19.851-16.149-36-36-36z"
42-
:fill="headIconFill.normal"
43-
p-id="6289"
44-
/>
45-
</svg>
15+
<el-icon><FullScreen /></el-icon>
4616
</a>
4717
<a v-show="isAppFullScreen">
4818
<svg
@@ -68,22 +38,7 @@
6838
@click="handleCloseWindow(isSettingCloseDirect)"
6939
>
7040
<a>
71-
<svg
72-
t="1634297261959"
73-
class="icon"
74-
viewBox="0 0 1024 1024"
75-
version="1.1"
76-
xmlns="http://www.w3.org/2000/svg"
77-
p-id="1584"
78-
:width="headIconSize"
79-
:height="headIconSize"
80-
>
81-
<path
82-
d="M544.448 499.2l284.576-284.576a32 32 0 0 0-45.248-45.248L499.2 453.952 214.624 169.376a32 32 0 0 0-45.248 45.248l284.576 284.576-284.576 284.576a32 32 0 0 0 45.248 45.248l284.576-284.576 284.576 284.576a31.904 31.904 0 0 0 45.248 0 32 32 0 0 0 0-45.248L544.448 499.2z"
83-
p-id="1585"
84-
:fill="headIconFill.normal"
85-
/>
86-
</svg>
41+
<el-icon><Close /></el-icon>
8742
</a>
8843
</div>
8944
</div>
@@ -167,7 +122,7 @@ export default {
167122
@apply float-left;
168123
}
169124
.headOpArea .option a {
170-
@apply inline-block rounded-lg w-full h-full px-3 py-2 cursor-pointer mx-px;
125+
@apply inline-flex justify-center items-center rounded-lg w-full h-full px-3 py-2 cursor-pointer mx-px;
171126
}
172127
.headOpArea .option a:hover {
173128
@apply bg-opacity-20 bg-black dark:bg-opacity-20 dark:bg-white;

‎src/components/Frameworks/Navigation/index.vue‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,13 @@
66
v-show="isLogined"
77
:isDot="false"
88
/>
9+
<div class="shiftOperations">
10+
<span class="color-mode" @click="switchColorMode">
11+
<el-icon v-if="isMatchColorMode('light')"><Sunny /></el-icon>
12+
<el-icon v-else-if="isMatchColorMode('dark')"><Moon /></el-icon>
13+
<el-icon v-else-if="isMatchColorMode('system')"><Setting /></el-icon>
14+
</span>
15+
</div>
916
<router-link
1017
class="areaLink"
1118
tabindex="-1"
@@ -41,6 +48,7 @@
4148
<script>
4249
// @ is an alias to /src
4350
import UserAvatar from "@/components/UserAssets/Avatar/index.vue"
51+
const { ipcRenderer } = window.require("electron")
4452
4553
export default {
4654
name: "Navigation",
@@ -51,6 +59,7 @@ export default {
5159
data() {
5260
return {
5361
isLogined: false,
62+
colorMode: "light",
5463
signText: "登录",
5564
}
5665
},
@@ -67,12 +76,64 @@ export default {
6776
},
6877
mounted() {
6978
this.isLogined = !(localStorage.getItem("checkKey") == (undefined || null))
79+
this.initColorMode()
7080
},
7181
methods: {
82+
initColorMode: function () {
83+
if (window.matchMedia("(prefers-color-scheme: light)").matches)
84+
document.querySelector("html").classList.remove("dark")
85+
else document.querySelector("html").classList.add("dark")
86+
},
7287
handleOpenUserArea: function () {
7388
this.$router.push({ path: "/userArea" })
7489
},
7590
handleKeepDrag: () => false,
91+
isMatchColorMode: function (mode) {
92+
if (mode && this) return this.colorMode === mode
93+
return false
94+
},
95+
switchColorMode: function () {
96+
this.$conf.getConfPromise().then((data) => {
97+
switch (this.colorMode) {
98+
case "light": {
99+
data.data.userSetting.colorSchemeMode = "light"
100+
ipcRenderer.send("color-schemeMode-light")
101+
break
102+
}
103+
case "dark": {
104+
data.data.userSetting.colorSchemeMode = "dark"
105+
ipcRenderer.send("color-schemeMode-dark")
106+
break
107+
}
108+
case "system": {
109+
data.data.userSetting.colorSchemeMode = "system"
110+
ipcRenderer.send("color-schemeMode-system")
111+
break
112+
}
113+
default:
114+
break
115+
}
116+
if (this.colorMode === "light") {
117+
this.colorMode = "dark"
118+
} else if (this.colorMode === "dark") {
119+
this.colorMode = "system"
120+
} else if (this.colorMode === "system") {
121+
this.colorMode = "light"
122+
}
123+
this.handleStorgeSetting(data.data, () => {
124+
this.initColorMode()
125+
console.log(data.data.userSetting.colorSchemeMode)
126+
})
127+
})
128+
},
129+
handleStorgeSetting: function (setting, cb) {
130+
this.$conf.updateLocalConfig(setting, (err) => {
131+
if (err) {
132+
console.log(err)
133+
}
134+
})
135+
cb && cb()
136+
},
76137
},
77138
}
78139
</script>
@@ -98,6 +159,23 @@ export default {
98159
.avatar {
99160
@apply w-11 h-11 absolute left-2;
100161
}
162+
163+
.shiftOperations {
164+
@apply absolute right-4 inline-flex items-center;
165+
}
166+
167+
.shiftOperations .color-mode {
168+
@apply inline-flex items-center justify-center w-8 h-8 p-1.5
169+
hover:bg-gray-200 dark:hover:bg-gray-600 rounded-full cursor-pointer transition-all;
170+
}
171+
172+
.el-icon {
173+
@apply inline-flex items-center justify-center w-full h-full;
174+
}
175+
176+
.el-icon svg {
177+
@apply inline-block w-full h-full;
178+
}
101179
</style>
102180

103181
<style lang="postcss">

‎src/components/Setting/local/index.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -84,23 +84,23 @@ export default {
8484
{
8585
id: 0,
8686
value: "light",
87-
choice: "☀ 日间主题",
87+
choice: "日间主题",
8888
fn: () => {
8989
this.handleChangeAppTheme("light")
9090
},
9191
},
9292
{
9393
id: 1,
9494
value: "dark",
95-
choice: "🌙 夜间主题",
95+
choice: "夜间主题",
9696
fn: () => {
9797
this.handleChangeAppTheme("dark")
9898
},
9999
},
100100
{
101101
id: 2,
102102
value: "system",
103-
choice: "❤ 跟随系统",
103+
choice: "跟随系统",
104104
fn: () => {
105105
this.handleChangeAppTheme("system")
106106
},

0 commit comments

Comments
 (0)