diff --git a/dist/img/icon/relation/big/select.svg b/dist/img/icon/relation/big/select.svg new file mode 100644 index 0000000000..17da610656 --- /dev/null +++ b/dist/img/icon/relation/big/select.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/dist/img/icon/relation/big/status.svg b/dist/img/icon/relation/big/status.svg deleted file mode 100644 index b334e597ff..0000000000 --- a/dist/img/icon/relation/big/status.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/dist/img/icon/relation/small/multiselect.svg b/dist/img/icon/relation/small/multiselect.svg index cef5aec49d..5549b4f727 100644 --- a/dist/img/icon/relation/small/multiselect.svg +++ b/dist/img/icon/relation/small/multiselect.svg @@ -1,8 +1,8 @@ - - - - - - + + + + + + \ No newline at end of file diff --git a/dist/img/icon/relation/small/select.svg b/dist/img/icon/relation/small/select.svg new file mode 100644 index 0000000000..0365b9ba1c --- /dev/null +++ b/dist/img/icon/relation/small/select.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/dist/img/icon/relation/small/status.svg b/dist/img/icon/relation/small/status.svg deleted file mode 100644 index 3fb069b7fd..0000000000 --- a/dist/img/icon/relation/small/status.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/dist/img/icon/relation/small/tag.svg b/dist/img/icon/relation/small/tag.svg deleted file mode 100644 index 02b2de1162..0000000000 --- a/dist/img/icon/relation/small/tag.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/src/json/text.json b/src/json/text.json index a3ed0c3d21..b27bdd6c49 100644 --- a/src/json/text.json +++ b/src/json/text.json @@ -224,7 +224,7 @@ "relationName0": "Text", "relationName1": "Short text", "relationName2": "Number", - "relationName3": "Status", + "relationName3": "Select", "relationName4": "Date", "relationName5": "File & Media", "relationName6": "Checkbox", @@ -232,7 +232,7 @@ "relationName8": "Email", "relationName9": "Phone", "relationName10": "Icon", - "relationName11": "Tag", + "relationName11": "Multi-select", "relationName100": "Object", "relationName101": "Relations", "relationCheckboxLabel0": "%s is unchecked", diff --git a/src/scss/block/dataview/cell.scss b/src/scss/block/dataview/cell.scss index 5f4b85079f..32cd0e5407 100644 --- a/src/scss/block/dataview/cell.scss +++ b/src/scss/block/dataview/cell.scss @@ -24,7 +24,7 @@ .icon.clear:hover { background-image: url('~img/icon/clear1.svg'); } } -.cell.isEditing.c-select.isStatus { +.cell.isEditing.c-select.isSelect { .icon.clear { display: block; } .over { display: inline-block; vertical-align: top; font-size: 0px; width: calc(100% - 30px); } } diff --git a/src/scss/block/relation.scss b/src/scss/block/relation.scss index 08bbd53f79..cb2162706d 100644 --- a/src/scss/block/relation.scss +++ b/src/scss/block/relation.scss @@ -59,7 +59,7 @@ .placeholder { padding: 6px 8px } #entry { margin-top: 4px; } } - .cell.isEditing.c-select.isStatus { + .cell.isEditing.c-select.isSelect { .over { width: calc(100% - 26px); } } diff --git a/src/scss/common.scss b/src/scss/common.scss index fade34becb..668bd7b7f4 100644 --- a/src/scss/common.scss +++ b/src/scss/common.scss @@ -150,31 +150,31 @@ search.active { background: orange !important; } .bgColor-teal { background: #d6f5f3 !important; } .bgColor-lime { background: #e3f7d0 !important; } -.isTag.archive { color: $colorTextSecondary; background: $colorShapeTertiary; } -.isTag.tagColor-default { color: $colorTextPrimary !important; background: $colorBgPrimary !important; box-shadow: 0px 0px 0px 1px $colorShapeSecondary inset; } -.isTag.tagColor-grey { color: #8c9ea5 !important; background: #ebeff1 !important; } -.isTag.tagColor-yellow { color: #b2a616 !important; background: #fbf5b8 !important; } -.isTag.tagColor-orange { color: #d3720d !important; background: #ffEcc8 !important; } -.isTag.tagColor-red { color: #e2400c !important; background: #ffe5de !important; } -.isTag.tagColor-pink { color: #ca1b8e !important; background: #fddcf2 !important; } -.isTag.tagColor-purple { color: #9e30c4 !important; background: #f1dbf8 !important; } -.isTag.tagColor-blue { color: $colorBlue !important; background: #dce1fb !important; } -.isTag.tagColor-ice { color: #1c8bca !important; background: #cfedfe !important; } -.isTag.tagColor-teal { color: #0caaa3 !important; background: #d4f5f3 !important; } -.isTag.tagColor-lime { color: #64b90f !important; background: #e3f7d0 !important; } +.isMultiSelect.archive { color: $colorTextSecondary; background: $colorShapeTertiary; } +.isMultiSelect.tagColor-default { color: $colorTextPrimary !important; background: $colorBgPrimary !important; box-shadow: 0px 0px 0px 1px $colorShapeSecondary inset; } +.isMultiSelect.tagColor-grey { color: #8c9ea5 !important; background: #ebeff1 !important; } +.isMultiSelect.tagColor-yellow { color: #b2a616 !important; background: #fbf5b8 !important; } +.isMultiSelect.tagColor-orange { color: #d3720d !important; background: #ffEcc8 !important; } +.isMultiSelect.tagColor-red { color: #e2400c !important; background: #ffe5de !important; } +.isMultiSelect.tagColor-pink { color: #ca1b8e !important; background: #fddcf2 !important; } +.isMultiSelect.tagColor-purple { color: #9e30c4 !important; background: #f1dbf8 !important; } +.isMultiSelect.tagColor-blue { color: $colorBlue !important; background: #dce1fb !important; } +.isMultiSelect.tagColor-ice { color: #1c8bca !important; background: #cfedfe !important; } +.isMultiSelect.tagColor-teal { color: #0caaa3 !important; background: #d4f5f3 !important; } +.isMultiSelect.tagColor-lime { color: #64b90f !important; background: #e3f7d0 !important; } -.isStatus.tagColor-default { color: $colorTextPrimary !important; } -.isStatus.tagColor-black { color: $colorTextPrimary !important; } -.isStatus.tagColor-grey { color: $colorControlActive !important; } -.isStatus.tagColor-yellow { color: $colorYellow !important; } -.isStatus.tagColor-orange { color: $colorOrange !important; } -.isStatus.tagColor-red { color: $colorRed !important; } -.isStatus.tagColor-pink { color: $colorPink !important; } -.isStatus.tagColor-purple { color: $colorPurple !important; } -.isStatus.tagColor-blue { color: $colorBlue !important; } -.isStatus.tagColor-ice { color: $colorIce !important; } -.isStatus.tagColor-teal { color: $colorTeal !important; } -.isStatus.tagColor-lime { color: $colorLime !important; } +.isSelect.tagColor-default { color: $colorTextPrimary !important; } +.isSelect.tagColor-black { color: $colorTextPrimary !important; } +.isSelect.tagColor-grey { color: $colorControlActive !important; } +.isSelect.tagColor-yellow { color: $colorYellow !important; } +.isSelect.tagColor-orange { color: $colorOrange !important; } +.isSelect.tagColor-red { color: $colorRed !important; } +.isSelect.tagColor-pink { color: $colorPink !important; } +.isSelect.tagColor-purple { color: $colorPurple !important; } +.isSelect.tagColor-blue { color: $colorBlue !important; } +.isSelect.tagColor-ice { color: $colorIce !important; } +.isSelect.tagColor-teal { color: $colorTeal !important; } +.isSelect.tagColor-lime { color: $colorLime !important; } .brokenMedia { @include text-common; position: relative; width: 100%; line-height: 20px; padding: 11px 13px; border-radius: 6px; border: solid 1px $colorShapeSecondary; diff --git a/src/scss/component/icon.scss b/src/scss/component/icon.scss index 314b9aa3cd..5d9f2729cc 100644 --- a/src/scss/component/icon.scss +++ b/src/scss/component/icon.scss @@ -23,8 +23,8 @@ .icon.relation.c-shortText { background-image: url('~img/icon/relation/small/shortText.svg'); } .icon.relation.c-number { background-image: url('~img/icon/relation/small/number.svg'); } .icon.relation.c-date { background-image: url('~img/icon/relation/small/date.svg'); } -.icon.relation.c-select.isTag { background-image: url('~img/icon/relation/small/tag.svg'); } -.icon.relation.c-select.isStatus { background-image: url('~img/icon/relation/small/status.svg'); } +.icon.relation.c-select.isMultiSelect { background-image: url('~img/icon/relation/small/multiSelect.svg'); } +.icon.relation.c-select.isSelect { background-image: url('~img/icon/relation/small/select.svg'); } .icon.relation.c-object { background-image: url('~img/icon/relation/small/object.svg'); } .icon.relation.c-file { background-image: url('~img/icon/relation/small/file.svg'); } .icon.relation.c-checkbox { background-image: url('~img/icon/relation/small/checkbox.svg'); } diff --git a/src/scss/component/tag.scss b/src/scss/component/tag.scss index c6de288cb5..a28f1d62c7 100644 --- a/src/scss/component/tag.scss +++ b/src/scss/component/tag.scss @@ -14,7 +14,7 @@ } } .tagItem.canEdit { padding-right: 18px; } -.tagItem.isStatus { padding: 0px; @include text-common; line-height: 18px; box-shadow: 0px 0px !important; } -.tagItem.isStatus { +.tagItem.isSelect { padding: 0px; @include text-common; line-height: 18px; box-shadow: 0px 0px !important; } +.tagItem.isSelect { .tagRemove { display: none; } } \ No newline at end of file diff --git a/src/scss/menu/block/relation.scss b/src/scss/menu/block/relation.scss index 409313c715..5d0296ae35 100644 --- a/src/scss/menu/block/relation.scss +++ b/src/scss/menu/block/relation.scss @@ -117,7 +117,7 @@ .cellContent { padding: 5px 8px; } .placeholder { padding: 5px 8px; } } - .cell.isEditing.c-select.isStatus { + .cell.isEditing.c-select.isSelect { .over { width: calc(100% - 26px); } } diff --git a/src/scss/theme/dark/common.scss b/src/scss/theme/dark/common.scss index 652e09f0be..e12b4fb417 100644 --- a/src/scss/theme/dark/common.scss +++ b/src/scss/theme/dark/common.scss @@ -39,20 +39,20 @@ html.themeDark { .bgColor-teal { background: rgba(15, 200, 186, 0.25) !important; } .bgColor-lime { background: rgba(93, 212, 0, 0.25) !important; } - .isTag.archive { background-color: $colorShapeHighlightMedium; color: $colorTextSecondary; } - .isTag.tagColor-default { color: $colorTextPrimary !important; background: unset !important; box-shadow: 0px 0px 0px 1px $colorShapePrimary inset; } - .isTag.tagColor-grey { color: #8c9ea5 !important; background: rgba(140, 158, 165, 0.25) !important; } - .isTag.tagColor-yellow { color: $colorYellow !important; background: rgba(236, 217, 27, 0.25) !important; } - .isTag.tagColor-orange { color: $colorOrange !important; background: rgba(255, 181, 34, 0.25) !important; } - .isTag.tagColor-red { color: $colorRed !important; background: rgba(245, 85, 34, 0.25) !important; } - .isTag.tagColor-pink { color: $colorPink !important; background: rgba(229, 28, 160, 0.25) !important; } - .isTag.tagColor-purple { color: $colorPurple !important; background: rgba(171, 80, 204, 0.25) !important; } - .isTag.tagColor-blue { color: $colorBlue !important; background: rgba(62, 88, 235, 0.25) !important; } - .isTag.tagColor-ice { color: $colorIce !important; background: rgba(42, 167, 238, 0.25) !important; } - .isTag.tagColor-teal { color: $colorTeal !important; background: rgba(15, 200, 186, 0.25) !important; } - .isTag.tagColor-lime { color: $colorLime !important; background: rgba(93, 212, 0, 0.25) !important; } + .isMultiSelect.archive { background-color: $colorShapeHighlightMedium; color: $colorTextSecondary; } + .isMultiSelect.tagColor-default { color: $colorTextPrimary !important; background: unset !important; box-shadow: 0px 0px 0px 1px $colorShapePrimary inset; } + .isMultiSelect.tagColor-grey { color: #8c9ea5 !important; background: rgba(140, 158, 165, 0.25) !important; } + .isMultiSelect.tagColor-yellow { color: $colorYellow !important; background: rgba(236, 217, 27, 0.25) !important; } + .isMultiSelect.tagColor-orange { color: $colorOrange !important; background: rgba(255, 181, 34, 0.25) !important; } + .isMultiSelect.tagColor-red { color: $colorRed !important; background: rgba(245, 85, 34, 0.25) !important; } + .isMultiSelect.tagColor-pink { color: $colorPink !important; background: rgba(229, 28, 160, 0.25) !important; } + .isMultiSelect.tagColor-purple { color: $colorPurple !important; background: rgba(171, 80, 204, 0.25) !important; } + .isMultiSelect.tagColor-blue { color: $colorBlue !important; background: rgba(62, 88, 235, 0.25) !important; } + .isMultiSelect.tagColor-ice { color: $colorIce !important; background: rgba(42, 167, 238, 0.25) !important; } + .isMultiSelect.tagColor-teal { color: $colorTeal !important; background: rgba(15, 200, 186, 0.25) !important; } + .isMultiSelect.tagColor-lime { color: $colorLime !important; background: rgba(93, 212, 0, 0.25) !important; } - .isStatus.tagColor-default { color: $colorTextPrimary !important; } + .isSelect.tagColor-default { color: $colorTextPrimary !important; } .selectable.isSelectionSelected::after, .block.isSelectionSelected > .wrapContent > .selectable::after diff --git a/src/ts/component/block/bookmark.tsx b/src/ts/component/block/bookmark.tsx index e23180c350..f55042c640 100644 --- a/src/ts/component/block/bookmark.tsx +++ b/src/ts/component/block/bookmark.tsx @@ -87,7 +87,7 @@ const BlockBookmark = observer(class BlockBookmark extends React.Component{translate('blockLinkArchived')}; + archive =
{translate('blockLinkArchived')}
; }; element = ( diff --git a/src/ts/component/block/dataview/cell/index.tsx b/src/ts/component/block/dataview/cell/index.tsx index 85aaaa7db9..cf354d88cf 100644 --- a/src/ts/component/block/dataview/cell/index.tsx +++ b/src/ts/component/block/dataview/cell/index.tsx @@ -71,8 +71,8 @@ const Cell = observer(class Cell extends React.Component { CellComponent = CellText; break; - case I.RelationType.Status: - case I.RelationType.Tag: + case I.RelationType.Select: + case I.RelationType.MultiSelect: CellComponent = CellSelect; break; @@ -274,8 +274,8 @@ const Cell = observer(class Cell extends React.Component { break; }; - case I.RelationType.Status: - case I.RelationType.Tag: { + case I.RelationType.Select: + case I.RelationType.MultiSelect: { param = Object.assign(param, { width: width, commonFilter: true, diff --git a/src/ts/component/block/dataview/cell/select.tsx b/src/ts/component/block/dataview/cell/select.tsx index 73caa83153..fffadd520a 100644 --- a/src/ts/component/block/dataview/cell/select.tsx +++ b/src/ts/component/block/dataview/cell/select.tsx @@ -39,7 +39,7 @@ const CellSelect = observer(class CellSelect extends React.Component this.onContextMenu(e, item)} {...UtilCommon.dataProps({ id: item.id, index: i })} > @@ -89,7 +89,7 @@ const CellSelect = observer(class CellSelect extends React.Component { this.onValueRemove(item.id); }} /> @@ -113,7 +113,7 @@ const CellSelect = observer(class CellSelect extends React.Component - {isStatus ? : ''} + {isSelect ? : ''} ); } else { diff --git a/src/ts/component/block/dataview/view/board.tsx b/src/ts/component/block/dataview/view/board.tsx index 8b96226a27..7ae97500d7 100644 --- a/src/ts/component/block/dataview/view/board.tsx +++ b/src/ts/component/block/dataview/view/board.tsx @@ -153,7 +153,7 @@ const ViewBoard = observer(class ViewBoard extends React.Component { filter.value = value; break; - case I.RelationType.Status: + case I.RelationType.Select: filter.condition = value ? I.FilterCondition.Equal : I.FilterCondition.Empty; filter.value = value ? value : null; break; - case I.RelationType.Tag: + case I.RelationType.MultiSelect: value = Relation.getArrayValue(value); filter.condition = value.length ? I.FilterCondition.ExactIn : I.FilterCondition.Empty; filter.value = value.length ? value : null; diff --git a/src/ts/component/block/featured.tsx b/src/ts/component/block/featured.tsx index 8b33aae343..b7166683ec 100644 --- a/src/ts/component/block/featured.tsx +++ b/src/ts/component/block/featured.tsx @@ -722,8 +722,8 @@ const BlockFeatured = observer(class BlockFeatured extends React.Component{translate('blockLinkArchived')}; + archive =
{translate('blockLinkArchived')}
; }; if (cardStyle == I.LinkCardStyle.Text) { diff --git a/src/ts/component/menu/dataview/filter/values.tsx b/src/ts/component/menu/dataview/filter/values.tsx index d92b1b99fe..e0b5a1de02 100644 --- a/src/ts/component/menu/dataview/filter/values.tsx +++ b/src/ts/component/menu/dataview/filter/values.tsx @@ -94,8 +94,8 @@ const MenuDataviewFilterValues = observer(class MenuDataviewFilterValues extends switch (relation.format) { - case I.RelationType.Tag: - case I.RelationType.Status: { + case I.RelationType.MultiSelect: + case I.RelationType.Select: { Item = (element: any) => { return (
{item.children.map((action: any, i: number) => { if (action.isBgColor) { - action.inner =
; + action.inner =
; action.icon = 'color'; action.checkbox = action.value == this.color; }; @@ -149,7 +149,7 @@ const MenuGroupEdit = observer(class MenuGroupEdit extends React.Component it.id == groupId); const value = Relation.getArrayValue(group.value); diff --git a/src/ts/component/menu/dataview/option/edit.tsx b/src/ts/component/menu/dataview/option/edit.tsx index 459352e967..95f43f0774 100644 --- a/src/ts/component/menu/dataview/option/edit.tsx +++ b/src/ts/component/menu/dataview/option/edit.tsx @@ -25,7 +25,7 @@ const MenuOptionEdit = observer(class MenuOptionEdit extends React.Component {item.children.map((action: any, i: number) => { if (action.isBgColor) { - action.inner =
; + action.inner =
; action.icon = 'color'; action.checkbox = action.value == this.color; }; diff --git a/src/ts/component/menu/dataview/option/list.tsx b/src/ts/component/menu/dataview/option/list.tsx index b139d3ffc4..da4b7100ad 100644 --- a/src/ts/component/menu/dataview/option/list.tsx +++ b/src/ts/component/menu/dataview/option/list.tsx @@ -319,7 +319,7 @@ const MenuOptionList = observer(class MenuOptionList extends React.Component it.relationKey == relation.relationKey); @@ -338,7 +338,7 @@ const MenuOptionList = observer(class MenuOptionList extends React.Component= 0) { + if ([ I.RelationType.Select, I.RelationType.MultiSelect ].indexOf(v) >= 0) { c = 'select ' + this.selectClassName(v); }; return 'c-' + c; @@ -51,8 +51,8 @@ class Relation { break; case I.RelationType.Object: - case I.RelationType.Status: - case I.RelationType.Tag: + case I.RelationType.Select: + case I.RelationType.MultiSelect: ret = ret.concat([ { id: I.FilterCondition.In, name: translate('filterConditionInArray') }, { id: I.FilterCondition.AllIn, name: translate('filterConditionAllIn') }, @@ -212,9 +212,9 @@ class Relation { break; }; - case I.RelationType.Status: + case I.RelationType.Select: case I.RelationType.File: - case I.RelationType.Tag: + case I.RelationType.MultiSelect: case I.RelationType.Object: case I.RelationType.Relations: { value = this.getArrayValue(UtilCommon.objectCopy(value)); @@ -243,9 +243,9 @@ class Relation { break; }; - case I.RelationType.Status: + case I.RelationType.Select: case I.RelationType.File: - case I.RelationType.Tag: + case I.RelationType.MultiSelect: case I.RelationType.Object: case I.RelationType.Relations: { ret = value.length ? true : false; @@ -344,7 +344,7 @@ class Relation { switch (type) { default: { - formats = [ I.RelationType.Status, I.RelationType.Tag, I.RelationType.Checkbox ]; + formats = [ I.RelationType.Select, I.RelationType.MultiSelect, I.RelationType.Checkbox ]; break; }; @@ -362,11 +362,11 @@ class Relation { const f1 = c1.format; const f2 = c2.format; - if ((f1 == I.RelationType.Status) && (f2 != I.RelationType.Status)) return -1; - if ((f1 != I.RelationType.Status) && (f2 == I.RelationType.Status)) return 1; + if ((f1 == I.RelationType.Select) && (f2 != I.RelationType.Select)) return -1; + if ((f1 != I.RelationType.Select) && (f2 == I.RelationType.Select)) return 1; - if ((f1 == I.RelationType.Tag) && (f2 != I.RelationType.Tag)) return -1; - if ((f1 != I.RelationType.Tag) && (f2 == I.RelationType.Tag)) return 1; + if ((f1 == I.RelationType.MultiSelect) && (f2 != I.RelationType.MultiSelect)) return -1; + if ((f1 != I.RelationType.MultiSelect) && (f2 == I.RelationType.MultiSelect)) return 1; if ((f1 == I.RelationType.Checkbox) && (f2 != I.RelationType.Checkbox)) return -1; if ((f1 != I.RelationType.Checkbox) && (f2 == I.RelationType.Checkbox)) return 1; diff --git a/src/ts/lib/util/menu.ts b/src/ts/lib/util/menu.ts index 00d08fe0b4..de90157a67 100644 --- a/src/ts/lib/util/menu.ts +++ b/src/ts/lib/util/menu.ts @@ -298,8 +298,8 @@ class UtilMenu { { id: I.RelationType.Object }, { id: I.RelationType.LongText }, { id: I.RelationType.Number }, - { id: I.RelationType.Status }, - { id: I.RelationType.Tag }, + { id: I.RelationType.Select }, + { id: I.RelationType.MultiSelect }, { id: I.RelationType.Date }, { id: I.RelationType.File }, { id: I.RelationType.Checkbox },