Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2026-04-23 22:09:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 代码格式化

Browse Source
This commit is contained in:
BTMuli
2023-06-26 20:56:08 +08:00
parent 8e8c01c40c
commit 2591e86e2e
54 changed files with 437 additions and 437 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/components/overlay/to-calendar.vue
View File

@@ -95,30 +95,30 @@ function toDetail(item: TGApp.App.Calendar.Item) {
.box-div {
height: 200px;
background: rgb(255 255 255 / 30%);
align-items: center;
padding: 10px;
border-radius: 5px;
background: rgb(255 255 255 / 30%);
color: #faf7e8;
align-items: center;
}
.toc-top {
height: 100px;
width: 100%;
display: flex;
width: 100%;
height: 100px;
}
.toc-icon {
height: 100px;
width: 100px;
height: 100px;
}
.toc-material-grid {
display: grid;
margin-left: 10px;
font-family: Genshin, serif;
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 10px;
grid-template-columns: repeat(2, 1fr);
}
.toc-line {
@@ -127,13 +127,13 @@ function toDetail(item: TGApp.App.Calendar.Item) {
}
.toc-bottom {
background: rgb(0 0 0 / 30%);
padding: 3px 10px;
width: 420px;
border-radius: 5px;
display: flex;
justify-content: space-between;
width: 420px;
align-items: center;
justify-content: space-between;
padding: 3px 10px;
border-radius: 5px;
background: rgb(0 0 0 / 30%);
}
.toc-bottom img {
@@ -142,20 +142,20 @@ function toDetail(item: TGApp.App.Calendar.Item) {
}
.toc-src-box {
display: flex;
width: 300px;
height: 50px;
display: flex;
justify-content: left;
align-items: center;
justify-content: left;
}
.toc-src-text {
height: 50px;
font-size: 20px;
font-family: Genshin-Light, serif;
display: flex;
justify-content: center;
height: 50px;
align-items: center;
justify-content: center;
font-family: Genshin-Light, serif;
font-size: 20px;
}
.toc-btn-img {
@@ -164,22 +164,22 @@ function toDetail(item: TGApp.App.Calendar.Item) {
}
.close-div {
height: 60px;
width: 100%;
display: flex;
justify-content: center;
width: 100%;
height: 60px;
align-items: center;
justify-content: center;
}
.close-btn {
border-radius: 50%;
display: flex;
width: 30px;
height: 30px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgb(255 255 255 / 30%);
color: #faf7e8;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
</style>

34
src/components/overlay/to-channel.vue
View File

@@ -105,32 +105,32 @@ function toChannel(link: string) {
}
.toc-top {
padding: 10px;
border-radius: 5px;
background: rgb(255 255 255 / 30%);
padding: 10px;
}
.toc-title {
color: var(--common-color-blue);
font-family: var(--font-title);
font-size: 20px;
color: var(--common-color-blue);
}
.toc-list {
margin-top: 10px;
display: grid;
grid-template-columns: repeat(2, 1fr);
margin-top: 10px;
grid-gap: 10px;
grid-template-columns: repeat(2, 1fr);
}
.toc-list-item {
cursor: pointer;
display: flex;
background: rgb(0 0 0 / 20%);
border-radius: 5px;
align-items: center;
justify-content: start;
border-radius: 5px;
background: rgb(0 0 0 / 20%);
color: var(--common-color-black);
cursor: pointer;
transition: all 0.5s linear;
}
@@ -142,34 +142,34 @@ function toChannel(link: string) {
.toc-list-item img {
width: 45px;
height: 45px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
margin-right: 10px;
border-bottom-left-radius: 5px;
border-top-left-radius: 5px;
}
.toc-list-item span {
margin-right: 10px;
font-family: var(--font-title);
font-size: 16px;
margin-right: 10px;
}
.toc-close {
height: 60px;
width: 100%;
display: flex;
justify-content: center;
width: 100%;
height: 60px;
align-items: center;
justify-content: center;
}
.toc-close-btn {
border-radius: 50%;
display: flex;
width: 30px;
height: 30px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgb(255 255 255 / 30%);
color: #faf7e8;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
}
</style>

50
src/components/overlay/to-confirm.vue
View File

@@ -97,83 +97,83 @@ const onConfirm = () => {
<style scoped>
.confirm-div {
position: absolute;
width: 40vw;
height: 20vh;
top: 40vh;
left: 30vw;
background: var(--content-bg-2);
border-radius: 10px;
padding: 10px;
display: flex;
width: 40vw;
height: 20vh;
flex-direction: column;
align-items: center;
padding: 10px;
border-radius: 10px;
background: var(--content-bg-2);
}
.confirm-box {
border-radius: 10px;
width: 100%;
height: 100%;
border-radius: 10px;
}
.confirm-title {
font-family: Genshin, serif;
text-align: center;
height: 20%;
width: 100%;
color: var(--content-text-2);
height: 20%;
margin: 10px;
color: var(--content-text-2);
font-family: Genshin, serif;
font-size: 30px;
text-align: center;
}
.confirm-subtitle {
border-top: 1px solid var(--btn-bg-2);
font-family: Genshin-Light, serif;
text-align: center;
height: 20%;
width: 100%;
height: 20%;
border-top: 1px solid var(--btn-bg-2);
color: var(--content-text-2);
font-family: Genshin-Light, serif;
font-size: 20px;
text-align: center;
}
.confirm-input {
font-family: Genshin-Light, serif;
text-align: center;
height: 20%;
width: 100%;
height: 20%;
color: var(--content-text-2);
font-family: Genshin-Light, serif;
font-size: 20px;
text-align: center;
}
.confirm-btn-box {
position: absolute;
height: 40%;
width: 100%;
display: flex;
justify-content: space-around;
width: 100%;
height: 40%;
align-items: flex-end;
justify-content: space-around;
}
.confirm-btn {
display: flex;
width: 30%;
min-width: 150px;
min-height: 30px;
align-items: center;
border-radius: 50px;
background: var(--btn-bg-2);
color: var(--btn-text-1);
border-radius: 50px;
display: flex;
align-items: center;
}
.btn-icon {
margin: 5px;
width: 25px;
height: 25px;
margin: 5px;
}
.btn-text {
width: calc(100% - 70px);
text-align: center;
font-family: Genshin-Light, serif;
font-size: 20px;
text-align: center;
}
</style>

30
src/components/overlay/to-loading.vue
View File

@@ -56,54 +56,54 @@ watch(
min-width: 800px;
min-height: 300px;
padding: 15px;
border-radius: 15px;
background: rgb(255 255 255 / 5%);
box-shadow: 0 0 10px rgb(0 0 0 / 50%);
border-radius: 15px;
}
.tol-box {
width: 100%;
padding: 10px;
display: flex;
width: 100%;
box-sizing: content-box;
border: #f4d8a8 1px solid;
color: #f4d8a8;
border-radius: 5px;
flex-direction: column;
justify-content: center;
align-items: center;
justify-content: center;
padding: 10px;
border: #f4d8a8 1px solid;
border-radius: 5px;
color: #f4d8a8;
}
.tol-title {
display: flex;
width: 100%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
font-size: 2rem;
justify-content: center;
font-family: Genshin, serif;
font-size: 2rem;
font-weight: 600;
}
.tol-subtitle {
width: 100%;
text-align: center;
font-size: 1rem;
height: 25px;
font-family: Genshin-Light, serif;
font-size: 1rem;
text-align: center;
}
.tol-img {
display: flex;
width: 100%;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
justify-content: center;
}
.tol-img:deep(img) {
max-height: 200px;
max-width: 100%;
max-height: 200px;
border-radius: 5px;
}
</style>