Browse Source

refactor: 将样式放到组件同级

qufenxi
alan 6 years ago
parent
commit
3f31d0f210
  1. 18
      src/app/connection/left/item/left_item.less
  2. 4
      src/app/connection/left/item/left_item.ts
  3. 1
      src/app/connection/left/item/left_item_icon.ts
  4. 2
      src/app/connection/left/left.ts
  5. 6
      src/app/connection/more/item/more_link_item.less
  6. 6
      src/app/connection/more/item/more_link_item.ts
  7. 1
      src/app/connection/right/right.ts
  8. 2
      src/app/status/left/left.ts
  9. 9
      src/app/status/left/left_item.less
  10. 1
      src/app/status/left/left_item.ts
  11. 9
      src/app/status/right/right_card.less
  12. 4
      src/app/status/right/right_card.ts
  13. 7
      src/app/title/title.less
  14. 4
      src/app/title/title.ts
  15. 1
      src/less/index.less
  16. 1
      src/less/lib/background.less
  17. 1
      src/less/lib/color.less
  18. 39
      src/less/resource/common.less

18
src/app/connection/left/item/left_item.less

@ -0,0 +1,18 @@
@import '../../../../less/index.less';
.dec-webui-dcm-connection-left-item{
&-selected{
background-color: @background-color-blue-transparent;
.link-title{
color: @font-color-highlight;
}
}
&:hover{
background-color: @background-color-blue-transparent;
.link-item-icon{
visibility: visible;
}
}
.link-item-icon{
visibility: hidden;
}
}

4
src/app/connection/left/item/left_item.ts

@ -1,3 +1,4 @@
import './left_item.less';
import {WidgetType, Icon, TextButton, LeftRightVerticalAdapt} from '@ui'; import {WidgetType, Icon, TextButton, LeftRightVerticalAdapt} from '@ui';
import ItemIcon from './left_item_icon'; import ItemIcon from './left_item_icon';
import Model from '../../link_set.model'; import Model from '../../link_set.model';
@ -8,6 +9,7 @@ const Widget: WidgetType = {
title: '', title: '',
id: '', id: '',
creator: '', creator: '',
baseCls: 'dec-webui-dcm-connection-left-item',
}, },
_store() { _store() {
return BI.Models.getModel(Model); return BI.Models.getModel(Model);
@ -17,7 +19,7 @@ const Widget: WidgetType = {
return { return {
type: LeftRightVerticalAdapt, type: LeftRightVerticalAdapt,
cls: `link-item cursor-pointer`, cls: `cursor-pointer`,
height: 24, height: 24,
items: { items: {
left: [ left: [

1
src/app/connection/left/item/left_item_icon.ts

@ -15,6 +15,7 @@ const Widget: WidgetType = {
if (value === ACTION_DELETE) { if (value === ACTION_DELETE) {
return { return {
type: BubbleCombo, type: BubbleCombo,
stopPropagation: true,
direction: 'bottom', direction: 'bottom',
ref () { ref () {
combo = this; combo = this;

2
src/app/connection/left/left.ts

@ -27,7 +27,7 @@ const Widget: WidgetType = {
return BI.map(linkList, (index: number, item: LinkType) => { return BI.map(linkList, (index: number, item: LinkType) => {
return { return {
type: LeftItem, type: LeftItem,
cls: item.isSelected ? 'left-item-selected' : '', cls: item.isSelected ? 'dec-webui-dcm-connection-left-item-selected' : '',
title: item.connectionName, title: item.connectionName,
id: item.connectionId, id: item.connectionId,
creator: item.creator, creator: item.creator,

6
src/app/connection/more/item/more_link_item.less

@ -0,0 +1,6 @@
@import '../../../../less/index.less';
.dec-webui-dcm-connection-more-link-item{
&:hover{
border: solid 1px @border-color-highlight;
}
}

6
src/app/connection/more/item/more_link_item.ts

@ -1,8 +1,12 @@
import './more_link_item.less';
import {WidgetType, Vertical, Img, Label, Layout, Absolute} from '@ui/index'; import {WidgetType, Vertical, Img, Label, Layout, Absolute} from '@ui/index';
import ModelName from './more_link_litem.model'; import ModelName from './more_link_litem.model';
const className = 'dec.dcm.component.linkSet.morelink.item'; const className = 'dec.dcm.component.linkSet.morelink.item';
const Widget: WidgetType = { const Widget: WidgetType = {
props: {
baseCls: 'dec-webui-dcm-connection-more-link-item',
},
_store() { _store() {
return BI.Models.getModel(ModelName); return BI.Models.getModel(ModelName);
}, },
@ -17,7 +21,7 @@ const Widget: WidgetType = {
return { return {
type: Vertical, type: Vertical,
cls: 'dcm-link-more bi-border cursor-pointer', cls: 'bi-border cursor-pointer',
width: 120, width: 120,
height: 117, height: 117,
items: [ items: [

1
src/app/connection/right/right.ts

@ -21,7 +21,6 @@ const Widget: WidgetType = {
render() { render() {
return { return {
type: ListView, type: ListView,
cls: 'dcm-link-form',
ref(_ref: any) { ref(_ref: any) {
rightContent = _ref; rightContent = _ref;
}, },

2
src/app/status/left/left.ts

@ -32,7 +32,7 @@ const Widget: WidgetType = {
return BI.map(linkList, (index: number, item: LinkType) => { return BI.map(linkList, (index: number, item: LinkType) => {
return { return {
type: LeftItem, type: LeftItem,
cls: item.connectionName === selectTitle ? 'left-item-selected' : '', cls: item.connectionName === selectTitle ? 'dec-webui-dcm-status-left-item-selected' : '',
title: item.connectionName, title: item.connectionName,
id: item.connectionId, id: item.connectionId,
creator: item.creator, creator: item.creator,

9
src/app/status/left/left_item.less

@ -0,0 +1,9 @@
@import '../../../less/index.less';
.dec-webui-dcm-status-left-item{
&-selected{
background-color: @background-color-blue-transparent;
.link-title{
color: @font-color-highlight;
}
}
}

1
src/app/status/left/left_item.ts

@ -1,3 +1,4 @@
import './left_item.less';
import {WidgetType, TextButton, VerticalAdapt} from '@ui'; import {WidgetType, TextButton, VerticalAdapt} from '@ui';
import Model from './left.model'; import Model from './left.model';
const className = 'dec.dcm.component.linkStatus.left.item'; const className = 'dec.dcm.component.linkStatus.left.item';

9
src/app/status/right/right_card.less

@ -0,0 +1,9 @@
@import '../../../less/index.less';
.dec-webui-dcm-status-right-card{
.card-font-success{
font-size: @font-size-30;
}
.card-font-heighlight{
font-size: @font-size-30;
}
}

4
src/app/status/right/right_card.ts

@ -1,6 +1,10 @@
import './right_card.less';
import {WidgetType, Left, Label, Vertical, FloatCenter, CenterAdapt, VerticalAdapt} from '@ui/index'; import {WidgetType, Left, Label, Vertical, FloatCenter, CenterAdapt, VerticalAdapt} from '@ui/index';
const className = 'dec.dcm.component.linkStatus.right.card'; const className = 'dec.dcm.component.linkStatus.right.card';
const Widget: WidgetType = { const Widget: WidgetType = {
props: {
baseCls: 'dec-webui-dcm-status-right-card',
},
render() { render() {
const {maxActive, maxIdle, numActive, numIdle} = this.options; const {maxActive, maxIdle, numActive, numIdle} = this.options;

7
src/app/title/title.less

@ -0,0 +1,7 @@
@import '../../less/index.less';
.dec-webui-dcm-title{
.title-item-selected{
color: @background-color-highlight;
border-bottom: solid 2px @border-color-highlight;
}
}

4
src/app/title/title.ts

@ -1,9 +1,13 @@
import './title.less';
import {WidgetType, IconButton, LeftRightVerticalAdapt} from '@ui/index'; import {WidgetType, IconButton, LeftRightVerticalAdapt} from '@ui/index';
import TitleItem from './item/title_item'; import TitleItem from './item/title_item';
import {isDesigner, closeWindow} from '@shared/crud/crud.request'; import {isDesigner, closeWindow} from '@shared/crud/crud.request';
import {TAB_LINK_SET, TAB_LINK_POOL} from '@private/constants'; import {TAB_LINK_SET, TAB_LINK_POOL} from '@private/constants';
const className = 'dec.dcm.title'; const className = 'dec.dcm.title';
const Widget: WidgetType = { const Widget: WidgetType = {
props: {
baseCls: 'dec-webui-dcm-title',
},
render() { render() {
const hideCloseButton = isDesigner(); const hideCloseButton = isDesigner();

1
src/less/index.less

@ -2,4 +2,3 @@
@import "lib/color"; @import "lib/color";
@import "resource/background"; @import "resource/background";
@import "resource/font"; @import "resource/font";
@import "resource/common";

1
src/less/lib/background.less

@ -1,4 +1,3 @@
@background-color-blue-transparent: @color-bi-blue-5;
@background-resources: "resources.png"; @background-resources: "resources.png";
@background-warning: "warning.png"; @background-warning: "warning.png";
@background-database-selected: "database-selected.png"; @background-database-selected: "database-selected.png";

1
src/less/lib/color.less

@ -1 +1,2 @@
@import "../../../node_modules/fineui/src/less/lib/colors"; @import "../../../node_modules/fineui/src/less/lib/colors";
@background-color-blue-transparent: @color-bi-blue-5;

39
src/less/resource/common.less

@ -1,39 +0,0 @@
.dec-webui-dcm-layout{
.title-item-selected{
color: @background-color-highlight;
border-bottom: solid 2px @border-color-highlight;
}
.dcm-link-left{
.link-item{
&:hover{
background-color: @background-color-blue-transparent;
.link-item-icon{
visibility: visible;
}
}
.link-item-icon{
visibility: hidden;
}
}
.left-item-selected{
background-color: @background-color-blue-transparent;
.link-title{
color: @font-color-highlight;
}
}
}
.dcm-link-form{
.card-font-success{
font-size: @font-size-30;
}
.card-font-heighlight{
font-size: @font-size-30;
}
}
.dcm-link-more{
&:hover{
border: solid 1px @border-color-highlight;
}
}
}
Loading…
Cancel
Save