feat: add theme radius customization

This commit is contained in:
jxxghp
2026-06-05 23:06:10 +08:00
parent a73c28c1f7
commit f3c524b6b5
34 changed files with 231 additions and 52 deletions

View File

@@ -196,7 +196,7 @@ function submitSettings() {
position: relative;
overflow: hidden;
border: 1px solid rgba(var(--v-theme-on-surface), 0.1);
border-radius: 8px;
border-radius: var(--app-surface-radius);
background-color: rgba(var(--v-theme-surface-variant), 0.3);
cursor: pointer;
padding-block: 10px;

View File

@@ -118,7 +118,7 @@ function submitOrder() {
position: relative;
overflow: hidden;
border: 1px solid rgba(var(--v-theme-primary), 0.3);
border-radius: 8px;
border-radius: var(--app-surface-radius);
background-color: rgba(var(--v-theme-primary), 0.08);
cursor: grab;
padding-block: 10px;

View File

@@ -278,7 +278,7 @@ async function doDelete() {
position: relative;
overflow: hidden;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 8px;
border-radius: var(--app-surface-radius);
background-color: rgba(var(--v-theme-surface), 0.8);
block-size: 280px;
inline-size: 240px;
@@ -290,7 +290,7 @@ async function doDelete() {
.vue-flow__node {
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 8px;
border-radius: var(--app-surface-radius);
font-size: 10px;
&:hover {

View File

@@ -116,7 +116,7 @@ const colorTheme = computed(() => {
<style scoped>
.offline-dialog {
border-radius: 16px;
border-radius: var(--app-surface-radius);
}
.status-icon-wrapper {

View File

@@ -505,7 +505,7 @@ onMounted(() => {
.plugin-market-list-wrap {
flex: 1;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 8px;
border-radius: var(--app-surface-radius);
background: rgba(var(--v-theme-surface), 0.72);
min-block-size: 0;
overflow-y: auto;
@@ -563,7 +563,7 @@ onMounted(() => {
display: flex;
flex: 1;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 8px;
border-radius: var(--app-surface-radius);
background: rgba(var(--v-theme-surface), 0.72);
min-block-size: 0;
overflow: hidden;

View File

@@ -1914,7 +1914,7 @@ onUnmounted(() => {
.preview-note {
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 1rem;
border-radius: var(--app-surface-radius);
color: rgb(var(--v-theme-error));
font-size: 0.875rem;
line-height: 1.5;
@@ -1932,7 +1932,7 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 1rem;
border-radius: var(--app-surface-radius);
gap: 0.375rem;
min-inline-size: 0;
padding-block: 0.875rem;
@@ -1959,7 +1959,7 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 0.75rem;
border-radius: var(--app-surface-radius);
gap: 0.75rem;
padding-block: 0.875rem;
padding-inline: 1rem;
@@ -2052,7 +2052,7 @@ onUnmounted(() => {
flex: 0 0 auto;
flex-direction: column;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 1rem;
border-radius: var(--app-surface-radius);
margin-block-end: 1.5rem;
margin-inline: 1.5rem;
min-block-size: 0;

View File

@@ -698,7 +698,7 @@ onMounted(() => {
display: flex;
overflow: hidden;
flex-direction: column;
border-radius: 16px !important;
border-radius: var(--app-surface-radius) !important;
box-shadow: 0 12px 40px rgba(0, 0, 0, 12%) !important;
}

View File

@@ -394,7 +394,7 @@ watch(selectedFile, async newFile => {
.upload-zone {
padding: 2rem;
border: 2px dashed #ccc;
border-radius: 8px;
border-radius: var(--app-surface-radius);
text-align: center;
transition: all 0.3s ease;
}

View File

@@ -719,7 +719,7 @@ onMounted(() => {
.site-resource-card__meta-item {
border: 1px solid rgba(var(--v-border-color), calc(var(--v-border-opacity) * 0.7));
border-radius: 0.6rem;
border-radius: var(--app-surface-radius);
background: rgba(var(--v-theme-surface), 0.78);
min-block-size: 0;
padding-block: 0.55rem;

View File

@@ -392,7 +392,7 @@ onMounted(() => {
.stat-card {
padding: 16px;
border: 1px solid var(--v-border-color);
border-radius: 8px;
border-radius: var(--app-surface-radius);
background: var(--v-theme-surface);
min-inline-size: 100px;
text-align: center;

View File

@@ -602,7 +602,7 @@ const isMacOS = computed(() => {
flex-direction: column;
padding: 16px;
border: 1px solid rgb(var(--v-theme-primary));
border-radius: 8px;
border-radius: var(--app-surface-radius);
background-color: rgb(var(--v-theme-surface));
box-shadow: 0 8px 24px rgba(var(--v-shadow-key-umbra-color), 0.32);
gap: 14px;
@@ -656,7 +656,7 @@ const isMacOS = computed(() => {
.vue-flow__minimap {
overflow: hidden;
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 8px;
border-radius: var(--app-surface-radius);
background-color: rgba(var(--v-theme-surface), 0.8);
box-shadow: 0 4px 15px rgba(var(--v-shadow-key-umbra-color), 0.1);
inset-block-end: 20px;
@@ -687,7 +687,7 @@ const isMacOS = computed(() => {
// 自定义节点样式
.vue-flow__node {
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 12px;
border-radius: var(--app-surface-radius);
&:hover {
box-shadow: 0 8px 16px rgba(var(--v-shadow-key-umbra-color), 0.15) !important;