study/uTools-quickcommand
1
0
Fork 0
mirror of https://github.com/fofolee/uTools-quickcommand.git synced 2025-10-10 07:23:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

背景颜色样式调整

Browse Source
This commit is contained in:
fofolee
2025-02-15 12:06:34 +08:00
parent c6b511696a
commit 4262182f63
10 changed files with 71 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/CommandCard.vue
View File

@@ -92,26 +92,6 @@ export default {
</script>
<style scoped>
.q-card.command {
cursor: pointer;
user-select: none;
transition: all 0.3s ease;
background: rgba(255, 255, 255, 0.3) !important;
backdrop-filter: blur(calc(var(--glass-effect-strength) * 1px)) !important;
-webkit-backdrop-filter: blur(
calc(var(--glass-effect-strength) * 1px)
) !important;
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.07);
}
.body--dark .q-card.command {
background: rgba(57, 57, 57, 0.09) !important;
border: 1px solid rgb(59 58 58 / 5%);
box-shadow: 0 1px 5px rgb(0 0 0 / 20%), 0 2px 2px rgb(0 0 0 / 14%),
0 3px 1px -2px rgb(69 67 67 / 12%);
}
.card-wrapper {
transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
will-change: transform, width;

8
src/components/card/CommandCardContent.vue
View File

@@ -61,7 +61,6 @@ export default {
</script>
<style scoped>
/* 保留卡片基础样式 */
.q-card.command {
cursor: pointer;
user-select: none;
@@ -74,4 +73,11 @@ export default {
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.07);
}
.body--dark .q-card.command {
background: rgba(57, 57, 57, 0.09) !important;
border: 1px solid rgb(59 58 58 / 5%);
box-shadow: 0 1px 5px rgb(0 0 0 / 20%), 0 2px 2px rgb(0 0 0 / 14%),
0 3px 1px -2px rgb(69 67 67 / 12%);
}
</style>

6
src/components/composer/CommandComposer.vue
View File

@@ -76,11 +76,7 @@ export default defineComponent({
display: flex;
flex-direction: column;
height: 100%;
background-color: #f4f4f4;
}
.body--dark .command-composer {
background-color: #303132;
background-color: var(--utools-bg-color);
}
.composer-body {

17
src/components/composer/ComposerCard.vue
View File

@@ -315,14 +315,6 @@ export default defineComponent({
position: relative;
}
.composer-card .q-card {
background-color: rgba(0, 0, 0, 0.02);
}
.body--dark .composer-card .q-card {
background-color: rgba(255, 255, 255, 0.05);
}
/* 控制流程组件样式 */
.control-component {
flex: 1;
@@ -340,6 +332,7 @@ export default defineComponent({
.command-item {
transition: all 0.3s ease;
background-color: var(--transparent-bg-color);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: inherit;
@@ -353,14 +346,6 @@ export default defineComponent({
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.body--dark .composer-card.drag-handle:hover::before {
background: rgba(255, 255, 255, 0.1);
}
.body--dark .composer-card.drag-handle:active::before {
background: rgba(255, 255, 255, 0.15);
}
/* 收起状态样式 */
.composer-card.collapsed {
transform-origin: top;

15
src/components/composer/ComposerList.vue
View File

@@ -294,7 +294,7 @@ export default defineComponent({
margin: 4px 8px;
padding: 0 8px;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
background: rgba(0, 0, 0, 0.02);
background: var(--transparent-bg-color);
cursor: grab;
font-size: 12px;
min-height: 40px;
@@ -315,8 +315,7 @@ export default defineComponent({
}
.command-item.q-item-type:hover {
background-color: rgba(0, 0, 0, 0.1);
transform: translateX(4px);
transform: translateX(3px);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
@@ -325,16 +324,6 @@ export default defineComponent({
transform: scale(0.95);
}
/* 暗色模式适配 */
.body--dark .command-item.q-item-type {
border-color: rgba(255, 255, 255, 0.05);
background: rgba(255, 255, 255, 0.05);
}
.body--dark .command-item.q-item-type:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.body--dark .section-header {
border-bottom-color: rgba(255, 255, 255, 0.05);
}

9
src/components/composer/flow/DropArea.vue
View File

@@ -64,14 +64,7 @@ export default defineComponent({
.drop-area:hover,
.drop-area-dragging {
border-color: #bdbdbd;
background-color: #f9f9f9;
}
.body--dark .drop-area:hover,
.body--dark .drop-area-dragging {
border: 2px dashed #676666;
background-color: #303132;
background-color: var(--utools-bg-color);
}
.drop-area-dragging {

13
src/components/popup/EditorHistory.vue
View File

@@ -339,6 +339,7 @@ export default {
height: 100vh;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
border-radius: 10px;
background-color: var(--utools-bg-color);
}
.history-layout {
@@ -361,7 +362,6 @@ export default {
.header-section {
padding: 16px 16px 8px;
position: relative;
background: #f4f4f4;
}
.preview-container {
@@ -371,7 +371,6 @@ export default {
align-items: stretch;
justify-content: stretch;
overflow: hidden;
background: #f4f4f4;
transition: all 0.3s ease;
position: relative;
}
@@ -386,7 +385,6 @@ export default {
.history-list {
flex: 1;
padding: 0;
background: #f4f4f4;
overflow-y: auto;
overflow-x: hidden;
height: calc(100vh - 64px); /* Subtract header height */
@@ -499,15 +497,6 @@ export default {
opacity: 0.3;
}
/* 暗色模式适配 */
.body--dark .history-card,
.body--dark .history-list-container,
.body--dark .header-section,
.body--dark .history-list,
.body--dark .preview-container {
background: #303133;
}
.history-btn {
color: #666;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

6
src/components/quickcommandUI/QuickCommand.vue
View File

@@ -371,10 +371,6 @@ export default {
<style>
.quickcommand-ui.q-card {
background-color: var(--utools-bright-bg);
}
.body--dark .quickcommand-ui.q-card {
background-color: var(--utools-dark-bg);
background-color: var(--utools-bg-color);
}
</style>