opentiny
/
tiny-engine
0
0
Fork 9
Code Issues Pull Requests 3 Packages Projects Releases Wiki Activity

feat: variable convergence(block, i18n, bridge, datasource, help, robot) (#1078)

This commit is contained in:
xuanlid 2025-02-13 01:30:17 -08:00 committed by GitHub
parent bdbae55e51
commit fdfc1bb0b6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
54 changed files with 404 additions and 274 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/plugins/block/index.js
View File

@ -14,6 +14,7 @@ import entry, { api } from './src/Main.vue'
import metaData from './meta.js'
import { BlockService } from './src/composable'
import SaveNewBlock from './src/SaveNewBlock.vue'
import './src/styles/vars.less'
export default {
...metaData,

14
packages/plugins/block/src/BlockConfig.vue
View File

@ -314,18 +314,18 @@ export default {
.block-tag-create {
.tag-button {
color: var(--ti-lowcode-block-config-tag-color);
background-color: var(--ti-lowcode-block-config-tag-bg);
color: var(--te-block-config-tag-text-color);
background-color: var(--te-block-config-tag-bg-color);
border: none;
height: 28px;
:deep(.tiny-tag__close) {
fill: var(--ti-lowcode-block-config-tag-close-color);
fill: var(--te-block-config-tag-close-icon-color);
}
&:hover {
color: var(--ti-lowcode-block-config-tag-hover-color);
background-color: var(--ti-lowcode-block-config-tag-hover-bg);
color: var(--te-block-config-tag-color-hover);
background-color: var(--te-block-config-tag-bg-hover);
:deep(.tiny-tag__close) {
fill: var(--ti-lowcode-block-config-tag-close-hover-color);
fill: var(--te-block-config-tag-close-icon-color-hover);
}
}
}
@ -335,7 +335,7 @@ export default {
line-height: 20px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid var(--te-common-border-default);
border: 1px solid var(--te-block-config-new-tag-border-color);
}
.tiny-input {

2
packages/plugins/block/src/BlockEvent.vue
View File

@ -58,7 +58,7 @@ export default {
<style lang="less" scoped>
.block-alert {
color: var(--ti-lowcode-life-cycle-alert-color);
color: var(--te-block-alert-text-color);
height: 28px;
padding: 6px;
border: 0;

2
packages/plugins/block/src/BlockEventForm.vue
View File

@ -89,6 +89,6 @@ export default {
.linked-info {
margin-top: 10px;
padding: 15px 0px;
border-top: 1px solid var(--ti-lowcode-tabs-border-color);
border-top: 1px solid var(--te-block-event-link-border-color);
}
</style>

6
packages/plugins/block/src/BlockEventList.vue
View File

@ -66,7 +66,7 @@ export default {
.item-text {
flex: 1;
color: var(--te-common-text-primary);
color: var(--te-block-event-list-text-color);
}
.item-text.active {
font-weight: 700;
@ -77,11 +77,11 @@ export default {
}
.add-button {
:deep(.tiny-button) {
border: 1px solid var(--te-common-border-default);
border: 1px solid var(--te-block-event-list-btn-border-color);
}
.icon-plus {
margin-right: 6px;
stroke: var(--te-common-text-weaken);
stroke: var(--te-block-event-list-btn-icon-color);
}
}
</style>

10
packages/plugins/block/src/BlockGroupArrange.vue
View File

@ -48,11 +48,11 @@ export default {
<style lang="less" scoped>
.footer-toolbar {
border-radius: 4px;
background-color: var(--te-common-bg-container);
background-color: var(--te-block-panel-footer-btn-bg-color);
.icon-wrap {
width: 24px;
height: 24px;
color: var(--te-common-text-weaken);
color: var(--te-block-panel-footer-btn-icon-color);
font-size: 16px;
cursor: pointer;
display: inline-flex;
@ -60,10 +60,10 @@ export default {
align-items: center;
transition: 0.3s;
&.active {
border: 1px solid var(--te-common-border-active);
color: var(--te-common-text-primary);
border: 1px solid var(--te-block-panel-footer-btn-border-color-active);
color: var(--te-block-panel-footer-btn-color-active);
border-radius: 4px;
background-color: var(--te-common-bg-default);
background-color: var(--te-block-panel-footer-btn-bg-color-active);
}
}
}

2
packages/plugins/block/src/BlockProperty.vue
View File

@ -46,7 +46,7 @@ export default {
</script>
<style lang="less" scoped>
.block-alert {
color: var(--ti-lowcode-life-cycle-alert-color);
color: var(--te-block-alert-text-color);
height: 28px;
padding: 6px;
border: 0;

7
packages/plugins/block/src/BlockPropertyForm.vue
View File

@ -258,6 +258,7 @@ export default {
.property-title {
margin-bottom: 12px;
cursor: pointer;
fill: currentcolor;
}
.property-form {
@ -270,7 +271,7 @@ export default {
display: inline-block;
margin-top: 6px;
font-size: 12px;
color: var(--te-common-text-checked);
color: var(--te-block-property-add-item-text-color);
cursor: pointer;
.text {
@ -296,8 +297,8 @@ export default {
width: 280px;
height: 100%;
padding: 20px;
background-color: var(--te-common-bg-default);
border-right: 1px solid var(--te-common-border-default);
background-color: var(--te-block-property-config-item-bg-color);
border-right: 1px solid var(--te-block-property-config-item-border-color);
}
.config-list {

19
packages/plugins/block/src/BlockPropertyList.vue
View File

@ -90,25 +90,6 @@ export default {
padding: 0 12px;
width: 66px;
margin-right: 5px;
border: 1px solid var(--te-common-border-default);
}
.plus-icon {
width: 16px;
height: 16px;
}
.editorWarp {
display: inline-block;
}
.icon-plus {
margin-right: 6px;
stroke: var(--te-common-text-weaken);
}
}
.opt-button {
color: var(--te-common-icon-secondary);
width: auto;
&:last-child {
margin-right: var(--te-base-space-3x);
}
}
</style>

2
packages/plugins/block/src/BlockSetting.vue
View File

@ -361,7 +361,7 @@ export default {
margin-right: 3px;
}
color: var(--ti-lowcode-block-video-tip-color);
color: var(--te-block-video-tip-text-color);
}
}
:deep(.tiny-collapse-item__content) {

36
packages/plugins/block/src/Main.vue
View File

@ -460,7 +460,7 @@ export default {
}
.app-manage-search {
padding: 0 10px 12px 10px;
border-bottom: 1px solid var(--ti-lowcode-plugin-panel-header-border-bottom-color);
border-bottom: 1px solid var(--te-block-panel-header-border-color);
}
.block-popper {
.block-group-option-item {
@ -495,18 +495,18 @@ export default {
left: -6px;
right: 0;
padding: 8px 16px;
border-top: 1px solid var(--te-common-border-divider);
background-color: var(--te-common-bg-default);
color: var(--te-common-text-primary);
border-top: 1px solid var(--te-block-panel-footer-border-color);
background-color: var(--te-block-panel-footer-bg-color);
color: var(--te-block-panel-footer-text-color);
display: flex;
justify-content: space-between;
:deep(.tiny-dropdown) {
color: var(--te-common-text-primary);
color: var(--te-block-panel-footer-text-color);
.tiny-dropdown__trigger:not(.tiny-dropdown__caret-button):not(.is-disabled):hover {
color: var(--te-common-text-primary);
color: var(--te-block-panel-footer-text-color);
}
.tiny-dropdown__suffix-inner {
color: var(--te-common-icon-secondary);
color: var(--te-block-panel-footer-icon-color);
height: 10px;
}
}
@ -515,12 +515,12 @@ export default {
}
.footer-layout {
font-size: 12px;
color: var(--te-common-text-primary);
color: var(--te-block-panel-footer-text-color);
.tiny-svg {
cursor: pointer;
margin-left: 8px;
&.active {
color: var(--ti-lowcode-icon-bind-color);
color: var(--te-block-panel-footer-bind-icon-color);
}
}
}
@ -537,8 +537,8 @@ export default {
&:not(.is-disabled):active,
&:not(.is-disabled):hover,
&:focus {
background-color: var(--te-common-bg-container);
color: var(--te-common-text-primary);
background-color: var(--te-block-panel-footer-bg-color-active);
color: var(--te-block-panel-footer-text-color);
}
}
:deep(.tiny-dropdown-menu.tiny-popper[x-placement^='top']) {
@ -551,27 +551,17 @@ export default {
width: 220px;
height: 108px;
box-sizing: border-box;
background-color: var(--ti-lowcode-materials-block-group-delete-popover-bg-color);
padding: 6px;
&[x-placement^='right'] {
.popper__arrow {
&,
&::after {
border-right-color: var(--te-common-bg-container);
}
}
}
.popper-confirm-header {
font-size: var(--te-base-font-size-1);
color: var(--te-common-text-primary);
color: var(--te-block-popper-title-text-color);
font-weight: var(--te-base-font-weight-7);
margin-bottom: 12px;
}
.popper-confirm-content {
font-size: 12px;
color: var(--te-common-text-secondary);
color: var(--te-block-popper-content-text-color);
}
.popper-confirm-footer {
text-align: right;

2
packages/plugins/block/src/SaveNewBlock.vue
View File

@ -136,6 +136,6 @@ export default {
<style scoped lang="less">
.block-tip {
color: var(--te-common-color-error);
color: var(--te-block-tip-color-error);
}
</style>

40
packages/plugins/block/src/styles/vars.less Normal file
View File

@ -0,0 +1,40 @@
.block-manage {
--te-block-alert-text-color: var(--te-common-text-weaken);
--te-block-tip-color-error: var(--te-common-color-error);
// 区块列表 - 面板
--te-block-panel-header-border-color: var(--te-common-border-divider);
--te-block-panel-footer-bg-color: var(--te-common-bg-default);
--te-block-panel-footer-border-color: var(--te-common-border-divider);
--te-block-panel-footer-text-color: var(--te-common-text-primary);
--te-block-panel-footer-icon-color: var(--te-common-icon-secondary);
// 绑定时icon图标颜色
--te-block-panel-footer-bind-icon-color: var(--te-common-text-checked);
--te-block-panel-footer-bg-color-active: var(--te-common-bg-secondary);
// 区块 - 删除分组气泡框
--te-block-popper-title-text-color: var(--te-common-text-primary);
--te-block-popper-content-text-color: var(--te-common-text-secondary);
// 区块列表 - 列表状态切换图标
--te-block-panel-footer-btn-bg-color: var(--te-common-bg-container);
--te-block-panel-footer-btn-icon-color: var(--te-common-icon-secondary);
--te-block-panel-footer-btn-color-active: var(--te-common-icon-primary);
--te-block-panel-footer-btn-border-color-active: var(--te-common-border-active);
--te-block-panel-footer-btn-bg-color-active: var(--te-common-bg-default);
// 区块设置 - 标签
--te-block-config-tag-text-color: var(--te-common-text-primary);
--te-block-config-tag-bg-color: var(--te-common-bg-disabled);
--te-block-config-tag-color-hover: var(--te-common-text-primary);
--te-block-config-tag-bg-hover: var(--te-common-bg-disabled);
--te-block-config-tag-close-icon-color: var(--te-common-icon-secondary);
--te-block-config-tag-close-icon-color-hover: var(--te-common-icon-primary);
--te-block-config-new-tag-border-color: var(--te-common-border-default);
--te-block-event-link-border-color: var(--te-common-border-default);
--te-block-event-list-text-color: var(--te-common-text-primary);
--te-block-event-list-btn-border-color: var(--te-common-border-default);
--te-block-event-list-btn-icon-color: var(--te-common-text-weaken);
// 区块设置 - 属性设置
--te-block-property-add-item-text-color: var(--te-common-text-checked);
--te-block-property-config-item-bg-color: var(--te-common-bg-default);
--te-block-property-config-item-border-color: var(--te-common-border-default);
// 查看指引视频
--te-block-video-tip-text-color: var(--te-common-text-link);
}

1
packages/plugins/bridge/index.js
View File

@ -12,6 +12,7 @@
import entry from './src/Main.vue'
import metaData from './meta.js'
import './src/styles/vars.less'
export default {
...metaData,

8
packages/plugins/bridge/src/BridgeManage.vue
View File

@ -144,7 +144,7 @@ export default {
.list {
flex: 1;
border-top: 1px solid var(--ti-lowcode-tabs-border-color);
border-top: 1px solid var(--te-bridge-list-border-color);
overflow: auto;
padding: 12px 0;
}
@ -158,13 +158,13 @@ export default {
align-items: center;
padding: 0 12px;
position: relative;
color: var(--ti-lowcode-bridge-list-color);
color: var(--te-bridge-list-text-color);
cursor: pointer;
font-size: 12px;
&:hover,
&.active {
background: var(--ti-lowcode-bridge-list-bg);
background: var(--te-bridge-list-bg-color);
.setting-icon {
display: grid;
}
@ -174,7 +174,7 @@ export default {
display: none;
}
.list-item-icon {
color: var(--te-common-icon-secondary);
color: var(--te-bridge-list-icon-color);
margin-right: 8px;
}
}

24
packages/plugins/bridge/src/BridgeSetting.vue
View File

@ -300,7 +300,7 @@ export default {
font-size: 11px;
line-height: 18px;
margin-top: 8px;
color: var(--ti-lowcode-datasource-tip-color);
color: var(--te-bridge-setting-tip-text-color);
}
:deep(.tiny-form-item__label) {
.cdn-tips-icon {
@ -312,10 +312,10 @@ export default {
.title-wrap {
font-size: 12px;
font-weight: 700;
color: var(--te-common-text-primary);
color: var(--te-bridge-setting-title-text-color);
.help-link {
display: inline-block;
color: var(--te-common-text-link);
color: var(--te-bridge-setting-link-text-color);
font-size: 12px;
margin-left: 16px;
&:hover {
@ -339,19 +339,7 @@ export default {
.monaco-editor {
height: 500px;
margin-top: 8px;
border: 1px solid var(--ti-lowcode-birdge-editor-border-color);
}
.resource-form-footer {
padding: 12px 0 12px 80px;
.tiny-svg {
margin-right: 6px;
}
.del:hover {
background-color: var(--te-common-color-error);
}
border: 1px solid var(--te-bridge-editor-border-color);
}
.cdn-label-wrap {
display: flex;
@ -362,8 +350,8 @@ export default {
.code-preview {
font-size: 12px;
line-height: 20px;
background: var(--te-common-bg-container);
color: var(--te-common-text-weaken);
background: var(--te-bridge-setting-code-bg-color);
color: var(--te-bridge-setting-code-text-color);
border-radius: 4px;
& .pre-title {

2
packages/plugins/bridge/src/Main.vue
View File

@ -1,5 +1,5 @@
<template>
<plugin-panel title="资源管理" :isCloseLeft="false" @close="closePanel">
<plugin-panel title="资源管理" class="bridge-manage" :isCloseLeft="false" @close="closePanel">
<template #header>
<svg-button name="add-utils" placement="left" :tips="tips" @click="addResource('npm')"></svg-button>
</template>

13
packages/plugins/bridge/src/styles/vars.less Normal file
View File

@ -0,0 +1,13 @@
.bridge-manage {
// 资源管理
--te-bridge-list-text-color: var(--te-common-text-primary);
--te-bridge-list-bg-color: var(--te-common-bg-container);
--te-bridge-list-icon-color: var(--te-common-icon-secondary);
--te-bridge-list-border-color: var(--te-common-border-default);
--te-bridge-editor-border-color: var(--te-common-border-divider);
--te-bridge-setting-tip-text-color: var(--te-common-text-weaken);
--te-bridge-setting-title-text-color: var(--te-common-text-primary);
--te-bridge-setting-link-text-color: var(--te-common-text-link);
--te-bridge-setting-code-text-color: var(--te-common-text-weaken);
--te-bridge-setting-code-bg-color: var(--te-common-bg-container);
}

1
packages/plugins/datasource/index.js
View File

@ -14,6 +14,7 @@ import { fetchDataSourceList, fetchDataSourceDetail } from './src/js/http'
import entry from './src/Main.vue'
import metaData from './meta.js'
import { DataSourceService } from './src/composable'
import './src/styles/vars.less'
export default {
...metaData,

12
packages/plugins/datasource/src/DataSourceField.vue
View File

@ -142,7 +142,7 @@ export default {
<style lang="less" scoped>
.right-item {
margin-top: 8px;
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
.title {
display: flex;
@ -151,7 +151,7 @@ export default {
line-height: 22px;
font-weight: normal;
margin-bottom: 10px;
color: var(--ti-lowcode-datasource-label-color);
color: var(--te-datasource-label-text-color);
:deep(.tiny-button--text:hover) {
text-decoration: underline;
@ -165,7 +165,7 @@ export default {
.section {
margin-top: 12px;
svg {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
.group {
@ -189,10 +189,10 @@ export default {
align-items: center;
&.field-row-add {
color: var(--ti-lowcode-datasource-json-border-color);
color: var(--te-datasource-json-border-color);
svg {
color: var(--ti-lowcode-datasource-json-border-color);
color: var(--te-datasource-json-border-color);
}
}
}
@ -212,7 +212,7 @@ export default {
margin-left: 5px;
.description {
color: var(--ti-lowcode-datasource-input-icon-color);
color: var(--te-datasource-input-icon-color);
margin-left: 5px;
}
}

2
packages/plugins/datasource/src/DataSourceFieldCheck.vue
View File

@ -61,7 +61,7 @@ export default {
<style scoped lang="less">
.collection-field-item {
.tiny-checkbox {
color: var(--ti-lowcode-datasource-dialog-font-color);
color: var(--te-datasource-dialog-font-text-color);
}
}
</style>

2
packages/plugins/datasource/src/DataSourceFieldCheckMultipleLine.vue
View File

@ -32,7 +32,7 @@ export default {
<style lang="less" scoped>
.collection-field-item {
.tiny-radio {
color: var(--ti-lowcode-datasource-dialog-font-color);
color: var(--te-datasource-dialog-font-text-color);
}
}
</style>

4
packages/plugins/datasource/src/DataSourceFieldCheckRanger.vue
View File

@ -52,7 +52,7 @@ export default {
width: 50%;
.field-item-tip {
padding-left: 5px;
color: var(--ti-lowcode-datasource-description-error-color);
color: var(--te-datasource-description-text-color-error);
padding-right: 5px;
padding-top: 5px;
font-size: 12px;
@ -62,7 +62,7 @@ export default {
margin-right: 12px;
}
.collection-field-item-label {
color: var(--ti-lowcode-datasource-dialog-font-color);
color: var(--te-datasource-dialog-font-text-color);
}
.collection-field-num {
display: flex;

12
packages/plugins/datasource/src/DataSourceFieldForm.vue
View File

@ -176,7 +176,7 @@ export default {
<style lang="less" scoped>
.step-select-second {
border: 1px solid var(--ti-lowcode-datasource-border-color);
border: 1px solid var(--te-datasource-common-border-color);
border-radius: 4px;
padding: 12px;
margin-bottom: 16px;
@ -189,7 +189,7 @@ export default {
justify-content: space-between;
align-items: center;
.tiny-button {
border: 1px solid var(--ti-lowcode-datasource-color);
border: 1px solid var(--te-datasource-common-text-color-primary);
margin-right: 0px;
}
}
@ -208,20 +208,20 @@ export default {
font-weight: bold;
font-size: var(--te-base-font-size-base);
.description {
color: var(--ti-lowcode-datasource-input-icon-color);
color: var(--te-datasource-input-icon-color);
margin-left: 5px;
}
}
}
svg {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
}
#default-item {
height: 24px;
padding: 0;
border: none;
border-top: 1px solid var(--ti-lowcode-datasource-border-color);
border-top: 1px solid var(--te-datasource-common-border-color);
margin-bottom: 0;
border-radius: 0;
.field-row {
@ -234,6 +234,6 @@ export default {
}
#default-item:last-child {
border-bottom: 1px solid var(--ti-lowcode-datasource-border-color);
border-bottom: 1px solid var(--te-datasource-common-border-color);
}
</style>

8
packages/plugins/datasource/src/DataSourceFieldList.vue
View File

@ -138,15 +138,15 @@ export default {
.field-cell-name {
margin-left: 5px;
.field-name {
color: var(--ti-lowcode-datasource-color);
color: var(--te-datasource-common-text-color-primary);
}
.description {
color: var(--ti-lowcode-datasource-tip-color);
color: var(--te-datasource-tip-text-color);
margin-left: 5px;
}
}
svg {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
}
}
@ -159,7 +159,7 @@ export default {
}
}
.form-item-border:hover {
background: var(--ti-lowcode-datasource-box-bg);
background: var(--te-datasource-box-bg-color);
.field-operation {
display: flex;
justify-content: space-between;

14
packages/plugins/datasource/src/DataSourceFieldType.vue
View File

@ -67,12 +67,12 @@ export default {
<style lang="less" scoped>
.step-select-first {
border: 1px solid var(--ti-lowcode-datasource-border-color);
border: 1px solid var(--te-datasource-common-border-color);
border-radius: 4px;
padding: 12px;
margin-bottom: 46px;
svg {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
}
.field-row {
@ -81,7 +81,7 @@ export default {
margin-bottom: 12px;
-webkit-box-shadow: none;
box-shadow: none;
border-bottom: 2px solid var(--ti-lowcode-datasource-dialog-demo-border-color);
border-bottom: 2px solid var(--te-datasource-dialog-demo-border-color);
justify-content: space-between;
align-items: center;
&.field-row-border-bottom-none {
@ -98,13 +98,13 @@ export default {
.field-cell-name {
margin-left: 5px;
.description {
color: var(--ti-lowcode-datasource-input-icon-color);
color: var(--te-datasource-input-icon-color);
margin-left: 5px;
}
}
}
.btn {
color: var(--ti-lowcode-datasource-color);
color: var(--te-datasource-common-text-color-primary);
font-size: 12px;
cursor: pointer;
}
@ -123,9 +123,9 @@ export default {
justify-content: space-between;
flex-direction: column;
cursor: pointer;
background-color: var(--ti-lowcode-datasource-box-bg);
background-color: var(--te-datasource-box-bg-color);
border-radius: 4px;
color: var(--ti-lowcode-datasource-dialog-font-color);
color: var(--te-datasource-dialog-font-text-color);
.type-icon {
font-size: 20px;
}

2
packages/plugins/datasource/src/DataSourceForm.vue
View File

@ -259,7 +259,7 @@ export default {
}
.del:hover {
background-color: var(--ti-lowcode-datasource-delete-button-hover-bg);
background-color: var(--te-datasource-delete-button-bg-color-hover);
}
}
</style>

12
packages/plugins/datasource/src/DataSourceList.vue
View File

@ -132,21 +132,21 @@ export default {
.datasource-list {
flex-grow: 1;
padding-top: 12px;
border-top: 1px solid var(--ti-lowcode-datasource-border-color);
border-top: 1px solid var(--te-datasource-common-border-color);
}
.datasource-list-item {
box-shadow: var(--ti-lowcode-datasource-tabs-border-color) 0, -1px;
box-shadow: var(--te-datasource-tabs-border-color) 0, -1px;
height: 24px;
line-height: 24px;
align-items: center;
display: grid;
padding: 0 12px;
position: relative;
color: var(--ti-lowcode-datasource-common-text-main-color);
color: var(--te-datasource-list-main-text-color);
cursor: pointer;
&:hover,
&.active {
background: var(--ti-lowcode-datasource-list-hover-color);
background: var(--te-datasource-list-text-color-hover);
.item-handler {
display: inline-block;
}
@ -157,13 +157,13 @@ export default {
display: flex;
align-items: center;
justify-content: space-between;
color: var(--te-common-text-primary);
color: var(--te-datasource-list-item-text-color);
.item-name {
display: flex;
align-items: center;
}
.plugin-icon-data {
color: var(--te-common-icon-secondary);
color: var(--te-datasource-list-item-icon-color);
margin-right: 8px;
}
}

6
packages/plugins/datasource/src/DataSourceRecordForm.vue
View File

@ -248,19 +248,19 @@ export default {
.record-form-content {
padding: 24px 10px 12px;
.dot-tip {
color: var(--ti-lowcode-datasource-description-error-color);
color: var(--te-datasource-description-text-color-error);
margin-right: 4px;
vertical-align: middle;
}
.record-form-footer {
padding: 12px 0;
border-top: 1px solid var(--ti-lowcode-datasource-tabs-border-color);
border-top: 1px solid var(--te-datasource-tabs-border-color);
.tiny-svg {
margin-right: 6px;
}
.del:hover {
background-color: var(--ti-lowcode-datasource-delete-button-hover-bg);
background-color: var(--te-datasource-delete-button-bg-color-hover);
}
}
}

23
packages/plugins/datasource/src/DataSourceRecordList.vue
View File

@ -307,7 +307,7 @@ export default {
const messageSaved = {
render: () => (
<span>
<span style="color:var(--ti-lowcode-datasource-modal-text-color)">{'您确定要删除该条数据吗?'}</span>
<span style="color:var(--te-datasource-modal-text-color)">您确定要删除该条数据吗?</span>
</span>
)
}
@ -602,10 +602,11 @@ export default {
font-size: 12px;
text-align: left;
padding: 0;
margin-left: 8px;
&:hover {
text-decoration: underline;
}
color: var(--te-common-text-primary);
color: var(--te-datasource-common-text-color-primary);
.icon-download {
margin: 0 1px 4px 0;
font-size: 16px;
@ -617,13 +618,13 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
color: var(--ti-lowcode-datasource-common-text-color-5);
color: var(--te-datasource-common-text-color-weaken);
.empty-icon {
width: 50px;
height: 50px;
}
.add-column {
color: var(--ti-lowcode-datasource-json-border-color);
color: var(--te-datasource-json-border-color);
cursor: pointer;
}
}
@ -635,7 +636,7 @@ export default {
align-items: center;
.svg-icon {
margin-right: 10px;
color: var(--te-common-icon-secondary);
color: var(--te-datasource-list-item-icon-color);
}
}
}
@ -648,25 +649,25 @@ export default {
padding-right: 8px;
.tiny-pager__pages {
li.is-active {
background-color: var(--ti-lowcode-datasource-dialog-demo-border-color);
background-color: var(--te-datasource-list-pager-bg-color);
}
li {
&:not(.dot):not(.is-active):hover {
background-color: var(--ti-lowcode-datasource-common-hover-bg-1);
color: var(--ti-lowcode-datasource-common-primary-text-color);
background-color: var(--te-datasource-common-bg-color-hover);
color: var(--te-datasource-common-text-color-primary);
}
}
}
.tiny-pager__pull-left {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
}
.tiny-pager__btn-next,
.tiny-pager__btn-prev {
&:not([disabled]):hover {
background-color: var(--ti-lowcode-datasource-icon-hover-bg);
background-color: var(--te-datasource-icon-bg-color-hover);
svg {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
}
}

2
packages/plugins/datasource/src/DataSourceRecordUpload.vue
View File

@ -186,6 +186,6 @@ export default {
margin-left: 10px;
}
.confirm {
color: var(--ti-lowcode-datasource-common-error-color);
color: var(--te-datasource-common-color-error);
}
</style>

4
packages/plugins/datasource/src/DataSourceRemoteAutoload.vue
View File

@ -43,11 +43,11 @@ export default {
margin-top: 12px;
.use-service {
color: var(--ti-lowcode-datasource-color);
color: var(--te-datasource-common-text-color-primary);
font-size: 12px;
span {
color: var(--ti-lowcode-datasource-description-warning-color);
color: var(--te-datasource-description-text-color-warning);
}
}
}

2
packages/plugins/datasource/src/DataSourceRemoteDataAdapter.vue
View File

@ -110,7 +110,7 @@ export default {
}
.life-cycle-alert {
font-size: var(--te-base-font-size-base);
color: var(--te-common-text-weaken);
color: var(--te-datasource-common-tip-text-color);
}
}
</style>

10
packages/plugins/datasource/src/DataSourceRemoteDataResult.vue
View File

@ -93,12 +93,12 @@ export default {
.life-cycle-alert {
font-size: var(--te-base-font-size-base);
color: var(--te-common-text-weaken);
color: var(--te-datasource-common-tip-text-color);
}
.title {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
display: inline-block;
border-bottom: 1px solid var(--ti-lowcode-datasource-tabs-border-color);
border-bottom: 1px solid var(--te-datasource-tabs-border-color);
width: 100%;
padding-bottom: 8px;
}
@ -115,7 +115,7 @@ export default {
z-index: 9999;
.tiny-button {
border-radius: 4px;
border-color: var(--te-common-border-secondary);
border-color: var(--te-datasource-common-btn-border-color);
& + .tiny-button {
margin-left: 4px;
}
@ -125,7 +125,7 @@ export default {
.monaco-editor {
height: 120px;
margin-top: 8px;
border: 1px solid var(--te-common-border-divider);
border: 1px solid var(--te-datasource-common-border-color-divider);
border-radius: 4px;
}
}

6
packages/plugins/datasource/src/DataSourceRemoteForm.vue
View File

@ -84,12 +84,12 @@ export default {
<style lang="less" scoped>
.create-form {
.error-tip {
color: var(--ti-lowcode-datasource-error-tip-color);
color: var(--te-datasource-error-text-color);
margin-top: 4px;
font-size: 12px;
}
:deep(.tiny-form-item__label) {
color: var(--ti-lowcode-datasource-label-color);
color: var(--te-datasource-label-text-color);
}
.textarea-warp {
display: flex;
@ -109,7 +109,7 @@ export default {
}
:deep(.tiny-input-group__append) {
border: none;
background: var(--ti-lowcode-datasource-respones-color-bg);
background: var(--te-datasource-respones-bg-color);
}
:deep(.border-input) {
input {

8
packages/plugins/datasource/src/DataSourceRemoteMapping.vue
View File

@ -120,13 +120,13 @@ export default {
margin-bottom: 10px;
span {
display: inline-block;
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
}
.dot {
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--ti-lowcode-datasource-success-border-color);
background: var(--te-datasource-common-border-color-success);
margin-right: 8px;
line-height: 16px;
}
@ -138,11 +138,11 @@ export default {
grid-template-columns: 3fr 3fr 1.5fr;
column-gap: 10px;
:deep(.tiny-input .tiny-input__inner) {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
}
.tip {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
padding-left: 3px;
font-size: 12px;
}

18
packages/plugins/datasource/src/DataSourceRemotePanel.vue
View File

@ -246,30 +246,30 @@ export default {
justify-content: space-between;
align-items: center;
padding: 8px 12px;
background: var(--ti-lowcode-datasource-toolbar-bg);
border-top: 1px solid var(--ti-lowcode-datasource-tabs-border-color);
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
background: var(--te-datasource-toolbar-bg-color);
border-top: 1px solid var(--te-datasource-tabs-border-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
}
.send {
}
.tip-dot {
padding-left: 4px;
color: var(--ti-lowcode-datasource-description-error-color);
color: var(--te-datasource-description-text-color-error);
}
.use-service {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
font-size: 12px;
margin-top: 10px;
span {
color: var(--ti-lowcode-datasource-description-error-color);
color: var(--te-datasource-description-text-color-error);
}
}
:deep(.send-service) {
text-align: right;
border-top: 1px solid var(--ti-lowcode-datasource-tabs-border-color);
border-top: 1px solid var(--te-datasource-tabs-border-color);
padding: 12px 0px 0px;
.use-service {
@ -296,7 +296,7 @@ export default {
:deep(.tiny-tabs.tiny-tabs--button-card .tiny-tabs__item) {
border-radius: 4px;
&:hover {
color: var(--te-common-text-primary);
color: var(--te-datasource-common-text-color-primary);
}
}
:deep(.tiny-tabs__content) {
@ -304,7 +304,7 @@ export default {
}
:deep(.is-active) {
.tiny-tabs__item__title {
color: var(--te-common-text-primary);
color: var(--te-datasource-common-text-color-primary);
}
}
}

2
packages/plugins/datasource/src/DataSourceRemoteParameter.vue
View File

@ -43,7 +43,7 @@ export default {
.monaco-editor {
height: 180px;
margin-top: 8px;
border: 1px solid var(--te-common-border-divider);
border: 1px solid var(--te-datasource-common-border-color-divider);
border-radius: 4px;
}
</style>

18
packages/plugins/datasource/src/DataSourceTemplate.vue
View File

@ -57,13 +57,13 @@ export default {
<style lang="less" scoped>
.right-item {
padding: 16px 12px;
color: var(--ti-lowcode-datasource-toolbar-icon-color);
border-bottom: 1px solid var(--ti-lowcode-datasource-tabs-border-color);
color: var(--te-datasource-toolbar-icon-color);
border-bottom: 1px solid var(--te-datasource-tabs-border-color);
.tips {
margin-bottom: 16px;
font-size: 12px;
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
span {
&::before {
content: '';
@ -79,11 +79,11 @@ export default {
}
}
.blue::before {
border: 1px solid var(--ti-lowcode-datasource-json-border-color);
border: 1px solid var(--te-datasource-json-border-color);
}
.green::before {
border: 1px solid var(--ti-lowcode-datasource-tree-border-color);
border: 1px solid var(--te-datasource-tree-border-color);
}
}
.title {
@ -103,16 +103,16 @@ export default {
}
.tiny-button {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
&.tiny-button--primary {
border-color: var(--ti-lowcode-datasource-common-border-primary-color);
border-color: var(--te-datasource-common-border-color-primary);
}
&.tiny-button--success {
border-color: var(--ti-lowcode-datasource-success-border-color);
border-color: var(--te-datasource-common-border-color-success);
}
&:hover {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
background-color: transparent;
}
}

12
packages/plugins/datasource/src/DataSourceType.vue
View File

@ -65,7 +65,7 @@ export default {
<style lang="less" scoped>
.right-item {
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
display: flex;
flex-direction: column;
.title {
@ -76,12 +76,12 @@ export default {
line-height: 22px;
font-weight: normal;
margin-bottom: 10px;
color: var(--ti-lowcode-datasource-label-color);
color: var(--te-datasource-label-text-color);
}
.item-type {
font-size: 12px;
color: var(--ti-lowcode-datasource-input-icon-color);
color: var(--te-datasource-input-icon-color);
display: inline-flex;
align-items: center;
cursor: pointer;
@ -95,14 +95,14 @@ export default {
}
&.is-checked {
color: var(--ti-lowcode-datasource-toolbar-breadcrumb-color);
color: var(--te-datasource-toolbar-breadcrumb-text-color);
.svg-icon {
color: var(--ti-lowcode-datasource-common-border-primary-color);
color: var(--te-datasource-common-border-color-primary);
}
}
.svg-icon {
font-size: 24px;
color: var(--ti-lowcode-datasource-input-icon-color);
color: var(--te-datasource-input-icon-color);
margin-right: 8px;
}
}

6
packages/plugins/datasource/src/RemoteDataAdapterForm.vue
View File

@ -58,19 +58,19 @@ export default {
font-size: var(--te-base-font-size-base);
div {
color: var(--te-common-text-primary);
color: var(--te-datasource-common-text-color-primary);
}
.icon-del {
cursor: pointer;
color: var(--ti-lowcode-datasource-toolbar-icon-color);
color: var(--te-datasource-toolbar-icon-color);
}
}
.monaco-editor {
min-height: 120px;
height: 100%;
border: 1px solid var(--te-common-border-divider);
border: 1px solid var(--te-datasource-common-border-color-divider);
border-radius: 4px;
}
</style>

37
packages/plugins/datasource/src/styles/vars.less Normal file
View File

@ -0,0 +1,37 @@
:root {
--te-datasource-toolbar-icon-color: var(--te-common-text-primary);
--te-datasource-tabs-border-color: var(--te-common-border-default);
--te-datasource-toolbar-breadcrumb-text-color: var(--te-common-text-primary);
--te-datasource-json-border-color: var(--te-common-border-checked);
--te-datasource-tree-border-color: var(--te-common-color-success);
--te-datasource-common-border-color-primary: var(--te-common-border-checked);
--te-datasource-common-border-color-success: var(--te-common-color-success);
--te-datasource-input-icon-color: var(--te-common-text-secondary);
--te-datasource-dialog-demo-border-color: var(--te-common-text-secondary);
--te-datasource-dialog-font-text-color: var(--te-common-text-secondary);
--te-datasource-toolbar-bg-color: var(--te-common-bg-container);
--te-datasource-description-text-color-error: var(--te-common-color-error);
--te-datasource-list-main-text-color: var(--te-common-text-secondary);
--te-datasource-toolbar-more-text-color-hover: var(--te-common-text-weaken);
--te-datasource-delete-button-bg-color-hover: var(--te-common-color-error);
--te-datasource-common-text-color-weaken: var(--te-common-text-weaken);
--te-datasource-common-bg-color-hover: var(--te-common-bg-container);
--te-datasource-common-text-color-primary: var(--te-common-text-primary);
--te-datasource-icon-bg-color-hover: var(--te-common-bg-container);
--te-datasource-common-color-error: var(--te-common-color-error);
--te-datasource-description-text-color-warning: var(--te-common-color-warning);
--te-datasource-error-text-color: var(--te-common-color-error);
--te-datasource-label-text-color: var(--te-common-text-secondary);
--te-datasource-list-text-color-hover: var(--te-common-bg-container);
--te-datasource-modal-text-color: var(--te-common-text-primary);
--te-datasource-respones-bg-color: var(--te-common-bg-primary-checked);
--te-datasource-common-border-color: var(--te-common-border-default);
--te-datasource-box-bg-color: var(--te-common-bg-container);
--te-datasource-tip-text-color: var(--te-common-text-weaken);
--te-datasource-list-item-text-color: var(--te-common-text-primary);
--te-datasource-list-item-icon-color: var(--te-common-icon-secondary);
--te-datasource-list-pager-bg-color: var(--te-common-bg-container);
--te-datasource-common-tip-text-color: var(--te-common-text-weaken);
--te-datasource-common-btn-border-color: var(--te-common-border-secondary);
--te-datasource-common-border-color-divider: var(--te-common-border-divider);
}

1
packages/plugins/help/index.js
View File

@ -12,6 +12,7 @@
import metaData from './meta.js'
import { HelpService } from './src/composable'
import './src/styles/vars.less'
export default {
...metaData,

16
packages/plugins/help/src/HelpIcon.vue
View File

@ -266,7 +266,7 @@ div.tiny-guide.shepherd-element {
.shepherd-title {
font-size: 16px;
line-height: 24px;
color: var(--ti-lowcode-help-guide-title-text-color);
color: var(--te-help-guide-title-text-color);
}
.shepherd-cancel-icon {
@ -281,12 +281,12 @@ div.tiny-guide.shepherd-element {
line-height: 20px;
padding-top: 0;
padding-bottom: 20px;
color: var(--ti-lowcode-help-guide-content-text-color);
color: var(--te-help-guide-content-text-color);
}
.shepherd-footer {
.progress-style {
color: var(--ti-lowcode-help-guide-progress-style-text-color);
color: var(--te-help-guide-progress-style-text-color);
}
.shepherd-button {
@ -304,7 +304,7 @@ div.tiny-guide.shepherd-element {
text-align: right;
}
&-title {
color: var(--ti-lowcode-help-box-title-text-color);
color: var(--te-help-box-title-text-color);
font-size: 12px;
font-weight: 600;
line-height: 18px;
@ -323,8 +323,8 @@ div.tiny-guide.shepherd-element {
font-size: 12px;
margin: 0 -16px;
padding: 0 16px;
color: var(--te-common-text-primary);
fill: var(--te-common-icon-primary);
color: var(--te-help-box-item-text-color);
fill: currentcolor;
span {
display: flex;
align-items: center;
@ -334,13 +334,13 @@ div.tiny-guide.shepherd-element {
}
}
&-item:hover {
background: var(--ti-lowcode-help-box-item-hover-bg-color);
background: var(--te-help-box-item-hover-bg-color);
}
&-ques {
&-title {
padding-top: 8px;
border-top: 1px solid var(--ti-lowcode-help-box-question-border-top);
border-top: 1px solid var(--te-help-box-question-border-color);
}
}

10
packages/plugins/help/src/styles/vars.less Normal file
View File

@ -0,0 +1,10 @@
#help-plugin {
--te-help-guide-content-text-color: var(--te-common-text-secondary);
--te-help-guide-title-text-color: var(--te-common-text-primary);
--te-help-guide-progress-style-text-color: var(--te-common-text-primary);
--te-help-box-title-text-color: var(--te-common-text-primary);
--te-help-box-item-text-color: var(--te-common-text-primary);
--te-help-box-question-border-color: var(--te-common-border-divider);
--te-help-box-item-hover-bg-color: var(--te-common-bg-container);
}

1
packages/plugins/i18n/index.js
View File

@ -12,6 +12,7 @@
import entry from './src/Main.vue'
import metaData from './meta.js'
import { TranslateService } from './src/composable'
import './src/styles/vars.less'
export default {
...metaData,

54
packages/plugins/i18n/src/Main.vue
View File

@ -41,7 +41,7 @@
<span id="boxeight" class="i18n-loading"></span><span>正在导入，请稍后...</span>
</p>
</div>
<div class="language-plugin-table">
<div class="language-plugin-table lowcode-scrollbar">
<tiny-grid
ref="i18nTable"
:data="langList"
@ -434,7 +434,7 @@ export default {
<style lang="less" scoped>
.plugin-panel-i18n {
box-shadow: 6px 0px 3px 0px var(--te-base-box-shadow-rgba-3);
box-shadow: 6px 0px 3px 0px var(--te-i18n-panel-shadow-color);
}
.stripe-tiny-grid {
word-wrap: break-word;
@ -453,11 +453,11 @@ export default {
.i18n-loading {
:deep(.tiny-loading__spinner) {
svg {
color: var(--ti-lowcode-i18n-loading-svg-color);
color: var(--te-i18n-loading-icon-color);
}
}
:deep(.tiny-loading__text) {
color: var(--ti-lowcode-i18n-loading-text-color);
color: var(--te-i18n-loading-text-color);
}
}
}
@ -483,7 +483,7 @@ export default {
}
.btn-box {
color: var(--ti-lowcode-i18n-button-color);
color: var(--te-i18n-button-text-color);
font-size: 12px;
margin-bottom: 12px;
padding: 0 12px;
@ -492,7 +492,7 @@ export default {
column-gap: 8px;
.btn-icon {
font-size: 16px;
color: var(--te-common-icon-secondary);
color: var(--te-i18n-button-icon-color);
margin-right: 4px;
}
.middle-btn {
@ -508,7 +508,7 @@ export default {
margin-top: 13px;
}
:deep(.path) {
stroke: var(--te-common-text-secondary);
stroke: var(--te-i18n-common-tip-text-color);
}
}
.download-btn {
@ -518,12 +518,12 @@ export default {
font-size: 12px;
text-align: left;
padding: 0;
color: var(--te-common-text-primary);
color: var(--te-i18n-button-text-color);
svg {
font-size: 16px;
}
.tiny-button.tiny-button--text {
color: var(--te-common-text-primary);
color: var(--te-i18n-button-text-color);
}
&:hover {
text-decoration: underline;
@ -535,14 +535,8 @@ export default {
height: calc(100% - 48px);
flex: 1;
padding: 12px;
border-top: 1px solid var(--ti-lowcode-i18n-border-color);
border-top: 1px solid var(--te-i18n-border-color);
overflow-y: scroll;
&::-webkit-scrollbar-thumb {
background-color: var(--te-common-border-default);
}
&::-webkit-scrollbar-thumb:hover {
background-color: var(--te-common-border-hover);
}
.operation-column {
display: flex;
@ -555,38 +549,12 @@ export default {
}
}
.delete-popover-container {
padding: 20px;
svg {
font-size: 20px;
color: var(--te-common-color-warning);
}
.delete-tip {
margin-left: 5px;
}
.i18n-item {
display: flex;
margin-bottom: 10px;
align-items: center;
label {
width: 80px;
}
display: flex;
}
.i18n-btns {
margin-top: 24px;
text-align: center;
}
}
.stripe-tiny-grid {
.i18n-opera {
display: flex;
justify-content: space-between;
:deep(.icon) {
color: var(--te-common-icon-secondary);
color: var(--te-i18n-grid-opt-icon-color);
svg {
font-size: 16px;
}

15
packages/plugins/i18n/src/styles/vars.less Normal file
View File

@ -0,0 +1,15 @@
.plugin-panel-i18n {
// 国际化表格加载中字体颜色
--te-i18n-loading-text-color: var(--te-common-text-weaken);
// 国际化表格加载中图标颜色
--te-i18n-loading-icon-color: var(--te-common-icon-primary);
// 国际化按钮字体颜色
--te-i18n-button-text-color: var(--te-common-text-primary);
// 国际化按钮图标颜色
--te-i18n-button-icon-color: var(--te-common-icon-secondary);
--te-i18n-common-text-color: var(--te-common-icon-primary);
--te-i18n-common-tip-text-color: var(--te-common-text-secondary);
--te-i18n-border-color: var(--te-common-border-divider);
--te-i18n-grid-opt-icon-color: var(--te-common-icon-secondary);
--te-i18n-panel-shadow-color: var(--te-common-shadow-panel);
}

1
packages/plugins/robot/index.js
View File

@ -12,6 +12,7 @@
import entry from './src/Main.vue'
import metaData from './meta.js'
import './src/styles/vars.less'
export default {
...metaData,

83
packages/plugins/robot/src/Main.vue
View File

@ -1,5 +1,5 @@
<template>
<div>
<div class="robot">
<div title="AI对话框" class="robot-img">
<svg-icon name="AI" @click="openAIRobot"></svg-icon>
</div>
@ -409,16 +409,16 @@ export default {
right: 40px;
bottom: 40px;
background-image: linear-gradient(
var(--ti-lowcode-chat-bg-top-color),
var(--ti-lowcode-chat-bg-mid-color),
var(--ti-lowcode-chat-bg-bottom-color)
var(--te-chat-bg-top-color),
var(--te-chat-bg-mid-color),
var(--te-chat-bg-bottom-color)
);
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);
padding: 16px;
border-radius: 12px;
}
.common-svg {
color: var(--ti-lowcode-chat-model-common-icon);
color: var(--te-chat-model-common-icon);
}
.chat-title-icons {
@ -429,7 +429,7 @@ export default {
float: right;
margin: 0 6px;
cursor: pointer;
color: var(--ti-lowcode-chat-model-icon);
color: var(--te-chat-model-icon);
&:hover {
opacity: 0.8;
}
@ -443,7 +443,7 @@ export default {
top: 16px;
left: 28px;
font-weight: bold;
color: var(--ti-lowcode-chat-model-text);
color: var(--te-chat-model-text);
.chat-title-dropdown {
display: flex;
align-items: center;
@ -451,29 +451,30 @@ export default {
}
.chat-title-label,
.ml8 {
color: var(--ti-lowcode-chat-model-text);
color: var(--te-chat-model-text);
font-weight: 700;
font-size: 16px;
}
.ml8 {
color: var(--te-common-icon-secondary);
color: var(--te-chat-model-dropdown-icon);
fill: currentcolor;
margin-left: 10px;
}
}
.robot-dialog-content {
background: var(--ti-lowcode-chat-model-bg);
background: var(--te-chat-model-bg);
border-radius: 6px;
padding: 16px;
&-top {
margin-bottom: 30px;
&-title {
color: var(--ti-lowcode-chat-model-helper-text);
color: var(--te-chat-model-helper-text);
font-size: 12px;
margin-bottom: 12px;
}
&-icon {
color: var(--ti-lowcode-chat-model-text);
color: var(--te-chat-model-text);
}
.icon-ai {
width: 16px;
@ -484,7 +485,7 @@ export default {
text-align: left;
font-size: 12px;
margin-top: 10px;
color: var(--ti-lowcode-chat-model-tips-text);
color: var(--te-chat-model-tips-text);
span {
display: inline-block;
height: 28px;
@ -492,10 +493,10 @@ export default {
padding: 0 8px;
margin-right: 8px;
border-radius: 4px;
background: var(--ti-lowcode-chat-model-tips-bg);
background: var(--te-chat-model-tips-bg);
cursor: pointer;
&:hover {
border-color: var(--ti-lowcode-chat-model-text);
border-color: var(--te-chat-model-text);
}
}
}
@ -505,7 +506,7 @@ export default {
overflow: scroll;
.chat-avatar-wrap {
width: 40px;
color: var(--ti-lowcode-chat-model-avatar-border);
color: var(--te-chat-model-avatar-border);
.chat-avatar {
width: 24px;
height: 24px;
@ -527,8 +528,8 @@ export default {
padding: 12px;
&.chat-content-user {
background-color: var(--ti-lowcode-chat-model-user-text-bg);
color: var(--ti-lowcode-chat-model-user-text);
background-color: var(--te-chat-model-user-text-bg);
color: var(--te-chat-model-user-text);
}
}
.chat-message-row {
@ -543,15 +544,15 @@ export default {
}
.chat-content-ai {
background-color: var(--ti-lowcode-chat-model-ai-text-bg);
border: 1px solid var(--ti-lowcode-chat-model-ai-text-border);
color: var(--ti-lowcode-chat-model-ai-text);
background-color: var(--te-chat-model-ai-text-bg);
border: 1px solid var(--te-chat-model-ai-text-border);
color: var(--te-chat-model-ai-text);
}
.chat-content-ai-unconnected {
background-color: var(--ti-lowcode-chat-model-ai-fail-text-bg);
border: 1px solid var(--ti-lowcode-chat-model-ai-fail-text-border);
color: var(--ti-lowcode-chat-model-ai-fail-text);
background-color: var(--te-chat-model-ai-fail-text-bg);
border: 1px solid var(--te-chat-model-ai-fail-text-border);
color: var(--te-chat-model-ai-fail-text);
}
.chat-submit {
@ -561,17 +562,17 @@ export default {
.tiny-input {
.tiny-input__inner {
padding-left: 12px;
color: var(--ti-lowcode-chat-model-helper-text);
color: var(--te-chat-model-helper-text);
height: 40px;
border: 2px solid var(--ti-lowcode-chat-model-input-border);
border: 2px solid var(--te-chat-model-input-border);
border-radius: 8px;
padding-right: 44px;
}
.tiny-input__inner:hover {
border-color: var(--ti-lowcode-chat-model-input-border);
border-color: var(--te-chat-model-input-border);
}
.tiny-input__inner:focus {
border-color: var(--ti-lowcode-chat-model-input-border);
border-color: var(--te-chat-model-input-border);
}
.tiny-input__prefix,
.tiny-input__suffix {
@ -587,12 +588,12 @@ export default {
margin-left: 12px;
background-image: linear-gradient(
to bottom right,
var(--ti-lowcode-chat-model-button-bg-1),
var(--ti-lowcode-chat-model-button-bg-2),
var(--ti-lowcode-chat-model-button-bg-3)
var(--te-chat-model-button-bg-1),
var(--te-chat-model-button-bg-2),
var(--te-chat-model-button-bg-3)
);
border: none;
color: var(--ti-lowcode-chat-model-button-text) !important;
color: var(--te-chat-model-button-text) !important;
font-size: 14px;
height: 40px;
width: 40px;
@ -602,7 +603,7 @@ export default {
padding: 0;
transition: all 0.1s linear;
.svg-icon {
fill: var(--ti-lowcode-chat-model-button-text);
fill: var(--te-chat-model-button-text);
margin-right: 0;
}
span {
@ -627,25 +628,25 @@ export default {
}
.chat-loading .tiny-loading__spinner svg {
fill: var(--ti-lowcode-chat-loading-svg-color);
fill: var(--te-chat-loading-svg-color);
}
.chat-loading .tiny-loading__spinner .tiny-loading__text {
color: var(--ti-lowcode-chat-loading-text-color);
color: var(--te-chat-loading-text-color);
}
.chat-model-popover.chat-model-popover {
width: 220px;
background-color: var(--te-common-bg-default);
background-color: var(--te-chat-model-popover-bg);
.tiny-dropdown-item {
color: var(--te-common-text-primary);
color: var(--te-chat-model-popover-color);
max-width: 220px;
&:hover {
color: var(--te-common-text-primary);
background-color: var(--te-common-bg-container);
color: var(--te-chat-model-popover-color);
background-color: var(--te-chat-model-popover-active-bg);
}
}
.selected-model {
color: var(--te-common-text-primary);
background-color: var(--te-common-bg-container);
color: var(--te-chat-model-popover-color);
background-color: var(--te-chat-model-popover-active-bg);
}
}
</style>

67
packages/plugins/robot/src/styles/vars.less Normal file
View File

@ -0,0 +1,67 @@
:root {
// chatGPT聊天窗问题模板文字颜色
--te-chat-model-text: #191919;
// chatGPT聊天窗问题模板下拉图标颜色
--te-chat-model-dropdown-icon: #808080;
// chatGPT聊天窗右上角图标颜色
--te-chat-model-icon: #191919;
// chatGPT聊天窗问题模板文字边框颜色
--te-chat-model-text-border: #cbcbcb;
// chatGPT聊天窗用户头像边框色
--te-chat-model-avatar-border: #dfe1e6;
// chatGPT聊天窗AI聊天文字背景
--te-chat-model-ai-text-bg: #ffffff;
// chatGPT聊天窗AI聊天文字背景边框
--te-chat-model-ai-text-border: #dbdbdb;
// chatGPT聊天窗AI聊天文字
--te-chat-model-ai-text: #191919;
// chatGPT聊天窗AI连接失败文字背景
--te-chat-model-ai-fail-text-bg: #feeaeb;
// chatGPT聊天窗AI连接失败文字背景边框
--te-chat-model-ai-fail-text-border: #dc544f;
// chatGPT聊天窗AI连接失败文字
--te-chat-model-ai-fail-text: #191919;
// chatGPT聊天窗用户聊天文字背景
--te-chat-model-user-text-bg: rgba(20, 118, 255, 0.12);
// chatGPT聊天窗用户聊天文字边框
--te-chat-model-user-text-border: #dbdbdb;
// chatGPT聊天窗用户聊天文字
--te-chat-model-user-text: #191919;
// chatGPT聊天窗标题文字
--te-chat-model-title: #333333;
// chatGPT聊天窗基础图标
--te-chat-model-common-icon: #8a887b;
// chatGPT聊天窗输入框背景
--te-chat-model-input-bg: #eeeeee;
// chatGPT聊天窗输入框背景
--te-chat-model-input-border: rgb(129, 168, 255);
// chatGPT聊天窗发送按钮背景渐变色
--te-chat-model-button-bg-1: rgba(96, 140, 255, 0.8);
--te-chat-model-button-bg-2: rgba(169, 117, 255, 0.8);
--te-chat-model-button-bg-3: rgba(177, 136, 255, 0.8);
// chatGPT聊天窗发送按钮边框
--te-chat-model-button-border: #1476ff;
// chatGPT聊天窗发送按钮文字
--te-chat-model-button-text: #ffffff;
// chatGPT背景渐变色
--te-chat-bg-top-color: rgb(227, 236, 255);
--te-chat-bg-mid-color: rgb(236, 245, 255);
--te-chat-bg-bottom-color: rgb(255, 255, 255);
// chatGPT聊天窗背景色
--te-chat-model-bg: #ffffff;
// chatGPT聊天窗小助手文字颜色
--te-chat-model-helper-text: #808080;
// chatGPT聊天窗问题提示字体颜色
--te-chat-model-tips-text: #595959;
// chatGPT聊天窗问题提示背景颜色
--te-chat-model-tips-bg: #f5f5f5;
// chatGPT加载
--te-chat-loading-svg-color: #1476ff;
--te-chat-loading-text-color: #595959;
// chatGPT model-popover
--te-chat-model-popover-bg: #fff;
--te-chat-model-popover-color: #191919;
--te-chat-model-popover-active-bg: #f5f5f5;
}

1
packages/theme/base/src/base.less
View File

@ -242,6 +242,7 @@
--te-base-box-shadow-rgba-1: rgba(25, 25, 25, 0.15);
--te-base-box-shadow-rgba-2: rgba(0, 0, 0, 0.16);
--te-base-box-shadow-rgba-3: rgba(0, 0, 0, 0.1);
--te-base-box-shadow-rgba-4: rgba(0, 0, 0, 0.2);
/**
* 1.1 行高

8
packages/theme/base/src/common.less
View File

@ -54,6 +54,10 @@
--te-common-bg-popover: var(--te-base-gray-0); // 对话框/tooltip/popover背景 #fff
--te-common-bg-text-emphasize: var(--te-base-blue-150); // 强调性文字背景色 rgba(20, 118, 255, 0.1)
--te-common-bg-info: var(--te-base-blue-20); // 提示框info背景色 #deecff
--te-common-bg-scroll: var(--te-base-gray-40); // 滚动条默认背景色#dbdbdb
--te-common-bg-scroll-hover: var(--te-base-gray-50); // 滚动条默认背景色#c2c2c2
--te-common-shadow-panel: var(--te-base-box-shadow-rgba-3); // 面板阴影 rgba(0, 0, 0, 0.1)
// 通用间距
--te-common-vertical-item-spacing-normal: 12px; // 表单元素之间的距离，标题和列表之间的距离、一个独立元素的padding等等
@ -113,6 +117,10 @@
--te-common-bg-popover: var(--te-base-gray-100); // 对话框/tooltip/popover背景 #333333
--te-common-bg-text-emphasize: var(--te-base-blue-160); // 强调性文字背景色 rgba(49, 122, 247, 0.1)
--te-common-bg-info: var(--te-base-blue-120); // 提示框info背景色 #0A1831
--te-common-bg-scroll: var(--te-base-gray-110); // 滚动条默认背景色#262626
--te-common-bg-scroll-hover: var(--te-base-gray-100); // 滚动条默认背景色#333333
--te-common-shadow-panel: var(--te-base-box-shadow-rgba-4); // 面板阴影 rgba(0, 0, 0, 0.2)
// 通用间距
--te-common-vertical-item-spacing-normal: 12px; // 表单元素之间的距离，标题和列表之间的距离、一个独立元素的padding等等

7
packages/theme/base/src/component-common.less
View File

@ -397,7 +397,7 @@
text-decoration: none;
}
}
&.is-disabled {
&.is-disabled.is-disabled.is-disabled.is-disabled.is-disabled {
background-color: var(--te-common-bg-disabled);
color: var(--te-common-text-disabled);
border-color: var(--te-common-border-disabled);
@ -590,6 +590,9 @@
box-shadow: 0 -2px 12px 0 var(--te-base-box-shadow-rgba-2);
height: auto;
.popper__arrow {
background: var(--te-common-bg-popover);
}
}
// 13、tag标签
@ -895,7 +898,7 @@
.tiny-grid-resizable.is__line {
color: var(--te-common-border-hover);
height: 10px;
margin-bottom: 9px;
margin-bottom: 11px;
}
}
}