mirror of
https://gitee.com/dromara/go-view.git
synced 2024-12-02 11:48:36 +08:00
fix：修改 @mixin 名称
This commit is contained in:
奔跑的面条
parent
bf4254719d
commit
621a302451
@ -15,6 +15,6 @@ onMounted(() => {
|
||||
@include go('reload') {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
@include filter-bg-color('background-color')
|
||||
@include fetch-bg-color('background-color')
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<router-view #default="{ Component, route }">
|
||||
<!-- todo 动画暂时不生效，待处理 -->
|
||||
<transition name="fade" mode="out-in" appear>
|
||||
<component
|
||||
v-if="route.noKeepAlive"
|
||||
|
||||
@ -18,7 +18,6 @@ const projectRoutes: RouteRecordRaw = {
|
||||
title: '项目',
|
||||
isRoot: true
|
||||
},
|
||||
// todo 可采用循环动态插入
|
||||
children: [
|
||||
{
|
||||
path: PageEnum.BASE_HOME_ITEMS,
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
}
|
||||
|
||||
//获取背景颜色
|
||||
@mixin filter-bg-color($target) {
|
||||
@mixin fetch-bg-color($target) {
|
||||
@include themeify {
|
||||
background-color: themed($target);
|
||||
}
|
||||
@ -66,7 +66,7 @@
|
||||
}
|
||||
|
||||
//设置边框颜色
|
||||
@mixin filter-border-color($target) {
|
||||
@mixin fetch-border-color($target) {
|
||||
@include themeify {
|
||||
border-color: themed($target);
|
||||
}
|
||||
|
||||
@ -49,14 +49,14 @@
|
||||
// 毛玻璃
|
||||
.go-background-filter {
|
||||
backdrop-filter: $--filter-blur-base;
|
||||
@include filter-bg-color('filter-color');
|
||||
@include fetch-bg-color('filter-color');
|
||||
box-shadow: $--border-shadow;
|
||||
}
|
||||
|
||||
// 毛玻璃
|
||||
.go-background-filter-shallow {
|
||||
backdrop-filter: $--filter-blur-base;
|
||||
@include filter-bg-color('filter-color-shallow');
|
||||
@include fetch-bg-color('filter-color-shallow');
|
||||
box-shadow: $--border-shadow;
|
||||
}
|
||||
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
import { nextTick } from 'vue'
|
||||
import { icon } from '@/plugins'
|
||||
import { DialogEnum } from '@/enums/pluginEnum'
|
||||
import { dialogIconSize } from '@/settings/designSetting'
|
||||
|
||||
@ -103,31 +103,31 @@ $topOrBottomHeight: 40px;
|
||||
margin: 1px;
|
||||
margin-bottom: 0;
|
||||
&.bg-depth0 {
|
||||
@include filter-bg-color('background-color1');
|
||||
@include fetch-bg-color('background-color1');
|
||||
.bottom,
|
||||
.top {
|
||||
@include filter-bg-color('background-color1');
|
||||
@include fetch-bg-color('background-color1');
|
||||
}
|
||||
}
|
||||
&.bg-depth1 {
|
||||
@include filter-bg-color('background-color1');
|
||||
@include fetch-bg-color('background-color1');
|
||||
.bottom,
|
||||
.top {
|
||||
@include filter-bg-color('background-color2');
|
||||
@include fetch-bg-color('background-color2');
|
||||
}
|
||||
}
|
||||
&.bg-depth2 {
|
||||
@include filter-bg-color('background-color2');
|
||||
@include fetch-bg-color('background-color2');
|
||||
.bottom,
|
||||
.top {
|
||||
@include filter-bg-color('background-color3');
|
||||
@include fetch-bg-color('background-color3');
|
||||
}
|
||||
}
|
||||
&.bg-depth3 {
|
||||
@include filter-bg-color('background-color3');
|
||||
@include fetch-bg-color('background-color3');
|
||||
.bottom,
|
||||
.top {
|
||||
@include filter-bg-color('background-color4');
|
||||
@include fetch-bg-color('background-color4');
|
||||
}
|
||||
}
|
||||
&.flex {
|
||||
@ -142,14 +142,14 @@ $topOrBottomHeight: 40px;
|
||||
height: $topOrBottomHeight;
|
||||
padding: 0 10px;
|
||||
border-top: 1px solid;
|
||||
@include filter-border-color('hover-border-color');
|
||||
@include fetch-border-color('hover-border-color');
|
||||
.mt-1 {
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
.top {
|
||||
border-bottom: 1px solid;
|
||||
@include filter-border-color('background-color1');
|
||||
@include fetch-border-color('background-color1');
|
||||
}
|
||||
|
||||
.content {
|
||||
|
||||
@ -70,7 +70,7 @@ $centerHeight: 100px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
border: 1px solid rgba(0, 0, 0, 0);
|
||||
@include filter-bg-color('background-color2');
|
||||
@include fetch-bg-color('background-color2');
|
||||
@extend .go-transition;
|
||||
&:hover {
|
||||
@include hover-border-color('background-color4');
|
||||
@ -83,7 +83,7 @@ $centerHeight: 100px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 2px 15px;
|
||||
@include filter-bg-color('background-color3');
|
||||
@include fetch-bg-color('background-color3');
|
||||
&-text {
|
||||
font-size: 12px;
|
||||
margin-left: 8px;
|
||||
|
||||
@ -118,7 +118,7 @@ $menuWidth: 65px;
|
||||
.chart-menu-width {
|
||||
width: $menuWidth;
|
||||
flex-shrink: 0;
|
||||
@include filter-bg-color('background-color2-shallow');
|
||||
@include fetch-bg-color('background-color2-shallow');
|
||||
}
|
||||
.chart-content-list {
|
||||
flex: 1;
|
||||
|
||||
@ -81,7 +81,7 @@ $topHeight: 40px;
|
||||
height: calc(100vh - #{$--header-height} - #{$topHeight});
|
||||
.menu-width {
|
||||
flex-shrink: 0;
|
||||
@include filter-bg-color('background-color2');
|
||||
@include fetch-bg-color('background-color2');
|
||||
}
|
||||
.menu-component-box {
|
||||
flex-shrink: 0;
|
||||
|
||||
@ -70,7 +70,7 @@ const selectTheme = (theme: ChartColorsNameType) => {
|
||||
cursor: pointer;
|
||||
margin-top: 15px;
|
||||
padding: 0;
|
||||
@include filter-bg-color('background-color4-shallow');
|
||||
@include fetch-bg-color('background-color4-shallow');
|
||||
border-radius: 23px;
|
||||
overflow: hidden;
|
||||
@include deep() {
|
||||
|
||||
@ -67,8 +67,8 @@ const rangeModelStyle = computed(() => {
|
||||
@include go(edit-range) {
|
||||
position: relative;
|
||||
transform-origin: left top;
|
||||
@include filter-border-color('hover-border-color');
|
||||
@include filter-bg-color('background-color2');
|
||||
@include fetch-border-color('hover-border-color');
|
||||
@include fetch-bg-color('background-color2');
|
||||
|
||||
@include go(edit-range-model) {
|
||||
z-index: -1;
|
||||
|
||||
@ -142,7 +142,7 @@ $asideBottom: 70px;
|
||||
border-radius: 25px;
|
||||
border: 1px solid;
|
||||
mix-blend-mode: luminosity;
|
||||
@include filter-border-color("hover-border-color-shallow");
|
||||
@include fetch-border-color("hover-border-color-shallow");
|
||||
&.aside {
|
||||
flex-direction: column-reverse;
|
||||
height: auto;
|
||||
|
||||
@ -67,7 +67,7 @@ $textSize: 10px;
|
||||
@extend .go-transition-quick;
|
||||
&.hover,
|
||||
&:hover {
|
||||
@include filter-bg-color('background-color4');
|
||||
@include fetch-bg-color('background-color4');
|
||||
}
|
||||
/* 选中 */
|
||||
&.select {
|
||||
|
||||
@ -38,7 +38,6 @@ const fetchProhectInfoById = () => {
|
||||
if (!routeParamsRes) return
|
||||
const { id } = routeParamsRes
|
||||
if (id.length) {
|
||||
// todo 从后端获取项目信息并存储
|
||||
return id[0]
|
||||
}
|
||||
return ''
|
||||
|
||||
@ -287,7 +287,7 @@ $carousel-image-height: 60vh;
|
||||
|
||||
&-card {
|
||||
@extend .go-background-filter;
|
||||
@include filter-bg-color('filter-color');
|
||||
@include fetch-bg-color('filter-color');
|
||||
box-shadow: 0 0 20px 5px rgba(40, 40, 40, 0.5);
|
||||
}
|
||||
|
||||
|
||||
@ -101,7 +101,6 @@ const {
|
||||
const emit = defineEmits(['delete', 'resize', 'edit'])
|
||||
|
||||
const props = defineProps({
|
||||
// todo 定义列表ITEN的 type
|
||||
cardData: Object as PropType<Chartype>
|
||||
})
|
||||
|
||||
|
||||
@ -73,7 +73,7 @@ $siderHeight: 100vh;
|
||||
|
||||
@include go(project) {
|
||||
&-sider {
|
||||
@include filter-bg-color('aside-background-color');
|
||||
@include fetch-bg-color('aside-background-color');
|
||||
&-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user