mirror of
https://github.com/anyproto/anytype-ts.git
synced 2025-06-08 05:57:02 +09:00
JS-5365: All content update
This commit is contained in:
Andrew Simachev
parent
4e7d535327
commit
1eeea83fb9
23 changed files with 472 additions and 487 deletions
|
|
@ -1,6 +1,6 @@
|
|||
html.anytypeWebclipper-iframe,
|
||||
html.anytypeWebclipper-popup {
|
||||
@import "~scss/font.scss";
|
||||
@import "~scss/font";
|
||||
@import "~scss/_mixins";
|
||||
|
||||
/* Text */
|
||||
|
|
@ -98,10 +98,10 @@ html.anytypeWebclipper-popup {
|
|||
--line-height-description: 26px;
|
||||
--letter-spacing-description: -0.28px;
|
||||
|
||||
@import "~scss/common.scss";
|
||||
@import "~scss/form/common.scss";
|
||||
@import "~scss/component/common.scss";
|
||||
@import "~scss/menu/common.scss";
|
||||
@import "~scss/common";
|
||||
@import "~scss/form/common";
|
||||
@import "~scss/component/common";
|
||||
@import "~scss/menu/common";
|
||||
@import "~scss/block/common";
|
||||
|
||||
* { box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; }
|
||||
|
|
|
|||
|
|
@ -161,6 +161,7 @@
|
|||
"commonMembers": "Members",
|
||||
"commonEntrySpace": "My First Space",
|
||||
"commonNothingFound": "Nothing found",
|
||||
"commonAllContent": "All content",
|
||||
|
||||
"pluralDay": "day|days",
|
||||
"pluralObject": "Object|Objects",
|
||||
|
|
@ -1748,8 +1749,6 @@
|
|||
"widgetEmptyLabelCreate": "There are no Objects here,<br/>create the first one",
|
||||
"widgetShowAll": "See all Objects",
|
||||
|
||||
"widgetButtonAllContent": "All content",
|
||||
|
||||
"phrasePlaceholder": "Please enter your Key",
|
||||
|
||||
"navigationAccount": "Spaces",
|
||||
|
|
|
|||
|
|
@ -30,8 +30,8 @@
|
|||
> .date.hide { opacity: 0; }
|
||||
}
|
||||
|
||||
@import "./chat/attachment.scss";
|
||||
@import "./chat/message.scss";
|
||||
@import "./chat/form.scss";
|
||||
@import "./chat/attachment";
|
||||
@import "./chat/message";
|
||||
@import "./chat/form";
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -108,30 +108,30 @@
|
|||
.block > .wrapMenu > .icon.dnd { opacity: 1; }
|
||||
}
|
||||
|
||||
@import "./markup.scss";
|
||||
@import "./bookmark.scss";
|
||||
@import "./cover.scss";
|
||||
@import "./dataview.scss";
|
||||
@import "./dataview/cell.scss";
|
||||
@import "./dataview/view/board.scss";
|
||||
@import "./dataview/view/common.scss";
|
||||
@import "./dataview/view/gallery.scss";
|
||||
@import "./dataview/view/grid.scss";
|
||||
@import "./dataview/view/list.scss";
|
||||
@import "./dataview/view/calendar.scss";
|
||||
@import "./dataview/view/graph.scss";
|
||||
@import "./div.scss";
|
||||
@import "./featured.scss";
|
||||
@import "./file.scss";
|
||||
@import "./iconPage.scss";
|
||||
@import "./iconUser.scss";
|
||||
@import "./layout.scss";
|
||||
@import "./link.scss";
|
||||
@import "./media.scss";
|
||||
@import "./relation.scss";
|
||||
@import "./table.scss";
|
||||
@import "./tableOfContents.scss";
|
||||
@import "./text.scss";
|
||||
@import "./type.scss";
|
||||
@import "./embed.scss";
|
||||
@import "./chat.scss";
|
||||
@import "./markup";
|
||||
@import "./bookmark";
|
||||
@import "./cover";
|
||||
@import "./dataview";
|
||||
@import "./dataview/cell";
|
||||
@import "./dataview/view/board";
|
||||
@import "./dataview/view/common";
|
||||
@import "./dataview/view/gallery";
|
||||
@import "./dataview/view/grid";
|
||||
@import "./dataview/view/list";
|
||||
@import "./dataview/view/calendar";
|
||||
@import "./dataview/view/graph";
|
||||
@import "./div";
|
||||
@import "./featured";
|
||||
@import "./file";
|
||||
@import "./iconPage";
|
||||
@import "./iconUser";
|
||||
@import "./layout";
|
||||
@import "./link";
|
||||
@import "./media";
|
||||
@import "./relation";
|
||||
@import "./table";
|
||||
@import "./tableOfContents";
|
||||
@import "./text";
|
||||
@import "./type";
|
||||
@import "./embed";
|
||||
@import "./chat";
|
||||
|
|
@ -202,5 +202,5 @@ a { color: var(--color-text-primary); }
|
|||
.icon.download { display: none; }
|
||||
}
|
||||
|
||||
@import "scss/debug.scss";
|
||||
@import "scss/font.scss";
|
||||
@import "scss/debug";
|
||||
@import "scss/font";
|
||||
|
|
@ -1,32 +1,32 @@
|
|||
@import "./cover.scss";
|
||||
@import "./deleted.scss";
|
||||
@import "./dragbox.scss";
|
||||
@import "./dragLayer.scss";
|
||||
@import "./dotIndicator.scss";
|
||||
@import "./editor.scss";
|
||||
@import "./emptySearch.scss";
|
||||
@import "./error.scss";
|
||||
@import "./footer.scss";
|
||||
@import "./frame.scss";
|
||||
@import "./header.scss";
|
||||
@import "./headSimple.scss";
|
||||
@import "./icon.scss";
|
||||
@import "./iconObject.scss";
|
||||
@import "./loader.scss";
|
||||
@import "./pager.scss";
|
||||
@import "./progress.scss";
|
||||
@import "./selection.scss";
|
||||
@import "./sidebar.scss";
|
||||
@import "./vault.scss";
|
||||
@import "./sync.scss";
|
||||
@import "./tag.scss";
|
||||
@import "./title.scss";
|
||||
@import "./toast.scss";
|
||||
@import "./tooltip.scss";
|
||||
@import "./navigation.scss";
|
||||
@import "./hightlight.scss";
|
||||
@import "./progressBar.scss";
|
||||
@import "./share.scss";
|
||||
@import "./cover";
|
||||
@import "./deleted";
|
||||
@import "./dragbox";
|
||||
@import "./dragLayer";
|
||||
@import "./dotIndicator";
|
||||
@import "./editor";
|
||||
@import "./emptySearch";
|
||||
@import "./error";
|
||||
@import "./footer";
|
||||
@import "./frame";
|
||||
@import "./header";
|
||||
@import "./headSimple";
|
||||
@import "./icon";
|
||||
@import "./iconObject";
|
||||
@import "./loader";
|
||||
@import "./pager";
|
||||
@import "./progress";
|
||||
@import "./selection";
|
||||
@import "./sidebar";
|
||||
@import "./vault";
|
||||
@import "./sync";
|
||||
@import "./tag";
|
||||
@import "./title";
|
||||
@import "./toast";
|
||||
@import "./tooltip";
|
||||
@import "./navigation";
|
||||
@import "./hightlight";
|
||||
@import "./progressBar";
|
||||
@import "./share";
|
||||
|
||||
@import "./preview/common.scss";
|
||||
@import "./media/common.scss";
|
||||
@import "./preview/common";
|
||||
@import "./media/common";
|
||||
|
|
@ -1,2 +1,2 @@
|
|||
@import "./audio.scss";
|
||||
@import "./video.scss";
|
||||
@import "./audio";
|
||||
@import "./video";
|
||||
|
|
@ -47,5 +47,5 @@
|
|||
.featured { @include text-very-small; color: var(--color-control-active); }
|
||||
}
|
||||
|
||||
@import "./link.scss";
|
||||
@import "./object.scss";
|
||||
@import "./link";
|
||||
@import "./object";
|
||||
|
|
@ -15,222 +15,17 @@
|
|||
#sidebarToggle.sidebarAnimation { transition: left $transitionSidebarTime linear; }
|
||||
#sidebarToggle:hover, #sidebarToggle.hover { background-color: var(--color-shape-highlight-medium); background-image: url('~img/icon/widget/toggle1.svg'); }
|
||||
|
||||
.sidebar { position: fixed; z-index: 21; user-select: none; transition: none; top: 0px; left: 0px; height: 100%; display: flex; }
|
||||
.sidebar { position: fixed; z-index: 21; user-select: none; transition: none; top: 0px; left: 0px; height: 100%; }
|
||||
.sidebar.anim { transition-property: width; transition-duration: $transitionSidebarTime; transition-timing-function: linear; }
|
||||
.sidebar.withVault { left: $vaultWidthCollapsed; }
|
||||
.sidebar.isClosed { left: 0px !important; }
|
||||
|
||||
.sidebar {
|
||||
> #containerWidget {
|
||||
height: 100%; display: flex; flex-direction: column; overflow: hidden; position: relative; z-index: 1; flex-shrink: 0;
|
||||
background-color: var(--color-shape-tertiary);
|
||||
}
|
||||
> #containerWidget {
|
||||
> .head {
|
||||
display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 0px 12px; height: 52px;
|
||||
gap: 0px 8px; overflow: hidden;
|
||||
}
|
||||
> .head {
|
||||
.status {
|
||||
@include text-small; font-weight: 500; @include text-overflow-nw; text-align: center; color: var(--color-text-secondary);
|
||||
display: inline-block; -webkit-app-region: no-drag;
|
||||
}
|
||||
@import "./sidebar/widget";
|
||||
@import "./sidebar/object";
|
||||
|
||||
|
||||
.icon { width: 28px; height: 28px; background-size: 20px; border-radius: 6px; cursor: default; -webkit-app-region: no-drag; }
|
||||
.icon:hover { background-color: var(--color-shape-highlight-medium); }
|
||||
.icon.toggle { background-image: url('~img/icon/widget/toggle0.svg'); }
|
||||
.icon.toggle:hover { background-image: url('~img/icon/widget/toggle1.svg'); }
|
||||
}
|
||||
|
||||
> .body { height: calc(100% - 52px); padding: 0px 12px 12px 12px; position: relative; flex-grow: 1; overflow: auto; overscroll-behavior: none; }
|
||||
> .body {
|
||||
@keyframes shake1 {
|
||||
0% { transform: rotate(-0.5deg); }
|
||||
100% { transform: rotate(0.5deg); }
|
||||
}
|
||||
|
||||
@keyframes shake2 {
|
||||
0% { transform: rotate(0.5deg); }
|
||||
100% { transform: rotate(-0.5deg); }
|
||||
}
|
||||
|
||||
.list { display: flex; flex-direction: column; gap: 12px 0px; }
|
||||
.list {
|
||||
> .buttons { display: flex; justify-content: center; width: 100%; gap: 0px 8px; }
|
||||
> .buttons {
|
||||
.button {
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2); border-radius: 8px; width: 100%; min-width: 60px; max-width: 200px; background-color: var(--color-bg-primary);
|
||||
color: var(--color-text-secondary); font-weight: 400; white-space: nowrap;
|
||||
}
|
||||
.button:hover { background-color: var(--color-shape-tertiary); }
|
||||
|
||||
.button.disabled { background: var(--color-shape-tertiary); max-width: 80px; }
|
||||
.button.grey {
|
||||
box-shadow: 0px 0px; background: var(--color-shape-highlight-medium); border-radius: 6px; @include text-common; color: var(--color-text-primary); line-height: 26px; width: auto;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
> .dropTarget.firstTarget,
|
||||
> .dropTarget.lastTarget
|
||||
{ position: relative; }
|
||||
|
||||
> .dropTarget.lastTarget { display: flex; flex-direction: column; gap: 12px 0px; }
|
||||
|
||||
> .dropTarget.firstTarget.isOver,
|
||||
> .dropTarget.lastTarget.isOver
|
||||
{ box-shadow: 0px 0px !important; }
|
||||
|
||||
> .dropTarget.firstTarget.isOver::before,
|
||||
> .dropTarget.lastTarget.isOver::before {
|
||||
content: ""; position: absolute; background: var(--color-system-accent-100); width: calc(100% - 28px); height: 2px; border-radius: 2px; left: 12px;
|
||||
}
|
||||
|
||||
> .dropTarget.firstTarget.isOver::before { bottom: -7px; }
|
||||
> .dropTarget.lastTarget.isOver::before { top: -7px; }
|
||||
|
||||
.widget.isEditable.isOver::before {
|
||||
content: ""; position: absolute; background: var(--color-system-accent-100); height: 2px; width: calc(100% - 24px); border-radius: 2px;
|
||||
left: 12px;
|
||||
}
|
||||
.widget.isEditable.isOver.top::before { top: -7px; }
|
||||
.widget.isEditable.isOver.bottom::before { bottom: -7px; }
|
||||
}
|
||||
|
||||
.list.isEditing {
|
||||
> .buttons { position: sticky; bottom: 0px; left: 0px; padding: 0px 16px; }
|
||||
|
||||
.widget:not(.isEditable) { opacity: 0.5; }
|
||||
.widget:not(.isEditable) {
|
||||
.dimmer { cursor: default; }
|
||||
}
|
||||
|
||||
.widget {
|
||||
.icon.remove { display: block; }
|
||||
}
|
||||
.widget {
|
||||
.dimmer { display: block; }
|
||||
}
|
||||
|
||||
.widget.widgetSpace:hover {
|
||||
.side.left { width: 100%; }
|
||||
.side.right { display: none; }
|
||||
}
|
||||
|
||||
.widget.isEditable:nth-child(2n + 1) { animation: shake1 0.2s linear infinite alternate; }
|
||||
.widget.isEditable:nth-child(2n + 2) { animation: shake2 0.2s linear infinite alternate; }
|
||||
.widget.isEditable:hover {
|
||||
.head {
|
||||
> .buttons { display: flex; }
|
||||
.iconWrap.options { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.widget.button { cursor: default; animation: none; }
|
||||
}
|
||||
|
||||
.list.isListPreview { overflow: hidden; height: 100%; }
|
||||
}
|
||||
}
|
||||
|
||||
> #containerObject {
|
||||
background-color: var(--color-bg-primary); border-right: 1px solid var(--color-shape-secondary); display: flex; flex-direction: column; width: 336px;
|
||||
}
|
||||
> #containerObject {
|
||||
> .head { padding: 12px 0px 0px 0px; display: flex; flex-direction: column; gap: 8px 0px; overflow: hidden; }
|
||||
> .head {
|
||||
.title { @include text-paragraph; font-weight: 600; padding: 0px 16px 0px 11px; }
|
||||
|
||||
.sides { display: flex; flex-direction: row; gap: 0px 8px; }
|
||||
.sides {
|
||||
.side.left { flex-grow: 1; }
|
||||
.side.right { flex-shrink: 0; }
|
||||
.side.right:empty { display: none; }
|
||||
}
|
||||
|
||||
.sides.sidesSort { padding: 0px 10px 0px 5px; }
|
||||
.sides.sidesFilter { padding: 0px 16px 0px 11px; }
|
||||
|
||||
.icon.sort { width: 28px; height: 28px; background-size: 20px; background-image: url('~img/icon/store/sort.svg'); border-radius: 6px; }
|
||||
.icon.sort:hover, .icon.sort.hover { background-color: var(--color-shape-highlight-medium); }
|
||||
|
||||
.select { border: 0px; padding: 4px 20px 4px 6px; font-weight: 500; }
|
||||
.select {
|
||||
.clickable {
|
||||
.icon { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.filter { padding: 0px 4px; border-radius: 6px; border: 1px solid var(--color-shape-secondary); }
|
||||
.filter {
|
||||
.inner { height: 26px; }
|
||||
.line { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
> .body { flex-grow: 1; overflow: hidden; }
|
||||
> .body {
|
||||
.ReactVirtualized__List { padding: 8px 8px 12px 3px; overscroll-behavior: none; }
|
||||
|
||||
.items { height: 100%; }
|
||||
|
||||
.item { padding: 8px; display: flex; flex-direction: row; align-items: center; gap: 0px 12px; position: relative; }
|
||||
.item {
|
||||
.iconObject { flex-shrink: 0; border-radius: 6px; }
|
||||
.iconObject.c48:not(.isTask) { background-color: var(--color-shape-tertiary); }
|
||||
|
||||
.info { width: 100%; display: flex; flex-direction: column; gap: 2px 0px; }
|
||||
.name { @include text-overflow-nw; width: 100%; }
|
||||
|
||||
.bottomWrap {
|
||||
display: flex; @include text-overflow-nw; width: 100%; @include text-small; color: var(--color-text-secondary); gap: 0px 6px;
|
||||
align-items: center;
|
||||
}
|
||||
.bottomWrap {
|
||||
.type { max-width: 40%; @include text-overflow-nw; flex-shrink: 0; }
|
||||
.descr { position: relative; @include text-overflow-nw; max-width: 100%; }
|
||||
.descr:empty { display: none; }
|
||||
.bullet { width: 2px; height: 2px; border-radius: 50%; background-color: var(--color-text-secondary); flex-shrink: 0; display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.item.withDescr {
|
||||
.bullet { display: block; }
|
||||
}
|
||||
|
||||
.item.withIcon {
|
||||
.info { width: calc(100% - 60px); }
|
||||
}
|
||||
|
||||
.item.isType, .item.isRelation { gap: 0px; }
|
||||
.item.isType, .item.isRelation {
|
||||
.info { width: calc(100% - 26px); }
|
||||
.nameWrap { display: flex; flex-direction: row; align-items: center; gap: 0px 8px; }
|
||||
.descrWrap {
|
||||
.type, .descr::before { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.item.isType.withIcon {
|
||||
.descrWrap { padding-left: 26px; }
|
||||
}
|
||||
.item.isRelation.withIcon {
|
||||
.descrWrap { padding-left: 28px; }
|
||||
}
|
||||
|
||||
.item.isFile {
|
||||
.iconObject { background-color: unset !important; }
|
||||
}
|
||||
|
||||
.item::before {
|
||||
content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(79,79,79,0); z-index: 1;
|
||||
pointer-events: none; border-radius: 6px;
|
||||
}
|
||||
.item:hover::before, .item.active::before { background: var(--color-shape-highlight-medium); }
|
||||
}
|
||||
}
|
||||
|
||||
.resize-h { width: 10px; height: 100%; cursor: col-resize; z-index: 2; flex-shrink: 0; position: relative; margin-left: -5px; }
|
||||
.resize-h { width: 10px; height: 100%; cursor: col-resize; z-index: 2; flex-shrink: 0; position: absolute; right: -5px; top: 0px; }
|
||||
.resize-h {
|
||||
.resize-handle {
|
||||
position: absolute; left: 6px; top: 50%; margin: -16px 0px 0px 0px; transition: $transitionAllCommon;
|
||||
|
|
|
|||
106
src/scss/component/sidebar/object.scss
Normal file
106
src/scss/component/sidebar/object.scss
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
> #containerObject { width: 100%; height: 100%; overflow: hidden; background-color: var(--color-shape-tertiary); padding: 52px 12px 12px 12px; }
|
||||
> #containerObject {
|
||||
> .inner { display: flex; flex-direction: column; width: 100%; height: 100%; background: var(--color-bg-primary); border-radius: 12px; }
|
||||
> .inner {
|
||||
> .head { display: flex; flex-direction: column; gap: 8px 0px; overflow: hidden; }
|
||||
> .head {
|
||||
.titleWrap {
|
||||
display: flex; flex-direction: row; align-items: center; gap: 0px 8px; width: 100%; padding: 20px 16px 8px 10px;
|
||||
}
|
||||
.titleWrap {
|
||||
.title { @include text-paragraph; font-weight: 600; flex-grow: 1; }
|
||||
.icon.back {
|
||||
width: 24px; height: 24px; border-radius: 4px; background-size: 20px; flex-shrink: 0; background-image: url('~img/icon/widget/back.svg');
|
||||
}
|
||||
.icon.back:hover { background-color: var(--color-shape-highlight-medium); }
|
||||
}
|
||||
|
||||
.sides { display: flex; flex-direction: row; gap: 0px 8px; }
|
||||
.sides {
|
||||
.side.left { flex-grow: 1; }
|
||||
.side.right { flex-shrink: 0; }
|
||||
.side.right:empty { display: none; }
|
||||
}
|
||||
|
||||
.sides.sidesSort { padding: 0px 10px; }
|
||||
.sides.sidesFilter { padding: 0px 16px; }
|
||||
|
||||
.icon.sort { width: 28px; height: 28px; background-size: 20px; background-image: url('~img/icon/store/sort.svg'); border-radius: 6px; }
|
||||
.icon.sort:hover, .icon.sort.hover { background-color: var(--color-shape-highlight-medium); }
|
||||
|
||||
.select { border: 0px; padding: 4px 20px 4px 6px; font-weight: 500; }
|
||||
.select {
|
||||
.clickable {
|
||||
.icon { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.filter { padding: 0px 4px; border-radius: 6px; border: 1px solid var(--color-shape-secondary); }
|
||||
.filter {
|
||||
.inner { height: 26px; }
|
||||
.line { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
> .body { flex-grow: 1; overflow: hidden; }
|
||||
> .body {
|
||||
.ReactVirtualized__List { padding: 8px; overscroll-behavior: none; }
|
||||
|
||||
.items { height: 100%; }
|
||||
|
||||
.item { padding: 8px; display: flex; flex-direction: row; align-items: center; gap: 0px 12px; position: relative; }
|
||||
.item {
|
||||
.iconObject { flex-shrink: 0; border-radius: 6px; }
|
||||
.iconObject.c48:not(.isTask) { background-color: var(--color-shape-tertiary); }
|
||||
|
||||
.info { width: 100%; display: flex; flex-direction: column; gap: 2px 0px; }
|
||||
.name { @include text-overflow-nw; width: 100%; }
|
||||
|
||||
.bottomWrap {
|
||||
display: flex; @include text-overflow-nw; width: 100%; @include text-small; color: var(--color-text-secondary); gap: 0px 6px;
|
||||
align-items: center;
|
||||
}
|
||||
.bottomWrap {
|
||||
.type { max-width: 40%; @include text-overflow-nw; flex-shrink: 0; }
|
||||
.descr { position: relative; @include text-overflow-nw; max-width: 100%; }
|
||||
.descr:empty { display: none; }
|
||||
.bullet { width: 2px; height: 2px; border-radius: 50%; background-color: var(--color-text-secondary); flex-shrink: 0; display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.item.withDescr {
|
||||
.bullet { display: block; }
|
||||
}
|
||||
|
||||
.item.withIcon {
|
||||
.info { width: calc(100% - 60px); }
|
||||
}
|
||||
|
||||
.item.isType, .item.isRelation { gap: 0px; }
|
||||
.item.isType, .item.isRelation {
|
||||
.info { width: calc(100% - 26px); }
|
||||
.nameWrap { display: flex; flex-direction: row; align-items: center; gap: 0px 8px; }
|
||||
.descrWrap {
|
||||
.type, .descr::before { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.item.isType.withIcon {
|
||||
.descrWrap { padding-left: 26px; }
|
||||
}
|
||||
.item.isRelation.withIcon {
|
||||
.descrWrap { padding-left: 28px; }
|
||||
}
|
||||
|
||||
.item.isFile {
|
||||
.iconObject { background-color: unset !important; }
|
||||
}
|
||||
|
||||
.item::before {
|
||||
content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(79,79,79,0); z-index: 1;
|
||||
pointer-events: none; border-radius: 6px;
|
||||
}
|
||||
.item:hover::before, .item.active::before { background: var(--color-shape-highlight-medium); }
|
||||
}
|
||||
}
|
||||
}
|
||||
111
src/scss/component/sidebar/widget.scss
Normal file
111
src/scss/component/sidebar/widget.scss
Normal file
|
|
@ -0,0 +1,111 @@
|
|||
> #containerWidget {
|
||||
height: 100%; width: 100%; display: flex; flex-direction: column; overflow: hidden; position: relative; z-index: 1; flex-shrink: 0;
|
||||
background-color: var(--color-shape-tertiary);
|
||||
}
|
||||
> #containerWidget {
|
||||
> .head {
|
||||
display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 0px 12px; height: 52px;
|
||||
gap: 0px 8px; overflow: hidden;
|
||||
}
|
||||
> .head {
|
||||
.status {
|
||||
@include text-small; font-weight: 500; @include text-overflow-nw; text-align: center; color: var(--color-text-secondary);
|
||||
display: inline-block; -webkit-app-region: no-drag;
|
||||
}
|
||||
|
||||
.icon { width: 28px; height: 28px; background-size: 20px; border-radius: 6px; cursor: default; -webkit-app-region: no-drag; }
|
||||
.icon:hover { background-color: var(--color-shape-highlight-medium); }
|
||||
.icon.toggle { background-image: url('~img/icon/widget/toggle0.svg'); }
|
||||
.icon.toggle:hover { background-image: url('~img/icon/widget/toggle1.svg'); }
|
||||
}
|
||||
|
||||
> .body { height: calc(100% - 52px); padding: 0px 12px 12px 12px; position: relative; flex-grow: 1; overflow: auto; overscroll-behavior: none; }
|
||||
> .body {
|
||||
@keyframes shake1 {
|
||||
0% { transform: rotate(-0.5deg); }
|
||||
100% { transform: rotate(0.5deg); }
|
||||
}
|
||||
|
||||
@keyframes shake2 {
|
||||
0% { transform: rotate(0.5deg); }
|
||||
100% { transform: rotate(-0.5deg); }
|
||||
}
|
||||
|
||||
.list { display: flex; flex-direction: column; gap: 12px 0px; }
|
||||
.list {
|
||||
> .buttons { display: flex; justify-content: center; width: 100%; gap: 0px 8px; }
|
||||
> .buttons {
|
||||
.button {
|
||||
box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2); border-radius: 8px; width: 100%; min-width: 60px; max-width: 200px; background-color: var(--color-bg-primary);
|
||||
color: var(--color-text-secondary); font-weight: 400; white-space: nowrap;
|
||||
}
|
||||
.button:hover { background-color: var(--color-shape-tertiary); }
|
||||
|
||||
.button.disabled { background: var(--color-shape-tertiary); max-width: 80px; }
|
||||
.button.grey {
|
||||
box-shadow: 0px 0px; background: var(--color-shape-highlight-medium); border-radius: 6px; @include text-common; color: var(--color-text-primary); line-height: 26px; width: auto;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
}
|
||||
|
||||
> .dropTarget.firstTarget,
|
||||
> .dropTarget.lastTarget
|
||||
{ position: relative; }
|
||||
|
||||
> .dropTarget.lastTarget { display: flex; flex-direction: column; gap: 12px 0px; }
|
||||
|
||||
> .dropTarget.firstTarget.isOver,
|
||||
> .dropTarget.lastTarget.isOver
|
||||
{ box-shadow: 0px 0px !important; }
|
||||
|
||||
> .dropTarget.firstTarget.isOver::before,
|
||||
> .dropTarget.lastTarget.isOver::before {
|
||||
content: ""; position: absolute; background: var(--color-system-accent-100); width: calc(100% - 28px); height: 2px; border-radius: 2px; left: 12px;
|
||||
}
|
||||
|
||||
> .dropTarget.firstTarget.isOver::before { bottom: -7px; }
|
||||
> .dropTarget.lastTarget.isOver::before { top: -7px; }
|
||||
|
||||
.widget.isEditable.isOver::before {
|
||||
content: ""; position: absolute; background: var(--color-system-accent-100); height: 2px; width: calc(100% - 24px); border-radius: 2px;
|
||||
left: 12px;
|
||||
}
|
||||
.widget.isEditable.isOver.top::before { top: -7px; }
|
||||
.widget.isEditable.isOver.bottom::before { bottom: -7px; }
|
||||
}
|
||||
|
||||
.list.isEditing {
|
||||
> .buttons { position: sticky; bottom: 0px; left: 0px; padding: 0px 16px; }
|
||||
|
||||
.widget:not(.isEditable) { opacity: 0.5; }
|
||||
.widget:not(.isEditable) {
|
||||
.dimmer { cursor: default; }
|
||||
}
|
||||
|
||||
.widget {
|
||||
.icon.remove { display: block; }
|
||||
}
|
||||
.widget {
|
||||
.dimmer { display: block; }
|
||||
}
|
||||
|
||||
.widget.widgetSpace:hover {
|
||||
.side.left { width: 100%; }
|
||||
.side.right { display: none; }
|
||||
}
|
||||
|
||||
.widget.isEditable:nth-child(2n + 1) { animation: shake1 0.2s linear infinite alternate; }
|
||||
.widget.isEditable:nth-child(2n + 2) { animation: shake2 0.2s linear infinite alternate; }
|
||||
.widget.isEditable:hover {
|
||||
.head {
|
||||
> .buttons { display: flex; }
|
||||
.iconWrap.options { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.widget.button { cursor: default; animation: none; }
|
||||
}
|
||||
|
||||
.list.isListPreview { overflow: hidden; height: 100%; }
|
||||
}
|
||||
}
|
||||
|
|
@ -1,12 +1,12 @@
|
|||
@import "./button.scss";
|
||||
@import "./drag.scss";
|
||||
@import "./filter.scss";
|
||||
@import "./input.scss";
|
||||
@import "./inputWithFile.scss";
|
||||
@import "./inputWithLabel.scss";
|
||||
@import "./phrase.scss";
|
||||
@import "./pin.scss";
|
||||
@import "./select.scss";
|
||||
@import "./switch.scss";
|
||||
@import "./textarea.scss";
|
||||
@import "./editable.scss";
|
||||
@import "./button";
|
||||
@import "./drag";
|
||||
@import "./filter";
|
||||
@import "./input";
|
||||
@import "./inputWithFile";
|
||||
@import "./inputWithLabel";
|
||||
@import "./phrase";
|
||||
@import "./pin";
|
||||
@import "./select";
|
||||
@import "./switch";
|
||||
@import "./textarea";
|
||||
@import "./editable";
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
@import "./object.scss";
|
||||
@import "./previewObject.scss";
|
||||
@import "./objectManager.scss";
|
||||
@import "./object";
|
||||
@import "./previewObject";
|
||||
@import "./objectManager";
|
||||
|
|
@ -259,45 +259,45 @@ html.platformWindows {
|
|||
}
|
||||
}
|
||||
|
||||
@import "./icon.scss";
|
||||
@import "./button.scss";
|
||||
@import "./help.scss";
|
||||
@import "./onboarding.scss";
|
||||
@import "./relation.scss";
|
||||
@import "./select.scss";
|
||||
@import "./smile.scss";
|
||||
@import "./type.scss";
|
||||
@import "./widget.scss";
|
||||
@import "./quickCapture.scss";
|
||||
@import "./syncStatus.scss";
|
||||
@import "./graph.scss";
|
||||
@import "./icon";
|
||||
@import "./button";
|
||||
@import "./help";
|
||||
@import "./onboarding";
|
||||
@import "./relation";
|
||||
@import "./select";
|
||||
@import "./smile";
|
||||
@import "./type";
|
||||
@import "./widget";
|
||||
@import "./quickCapture";
|
||||
@import "./syncStatus";
|
||||
@import "./graph";
|
||||
|
||||
@import "./search/object.scss";
|
||||
@import "./search/text.scss";
|
||||
@import "./search/object";
|
||||
@import "./search/text";
|
||||
|
||||
@import "./preview/object.scss";
|
||||
@import "./preview/object";
|
||||
|
||||
@import "./block/common.scss";
|
||||
@import "./block/add.scss";
|
||||
@import "./block/context.scss";
|
||||
@import "./block/cover.scss";
|
||||
@import "./block/latex.scss";
|
||||
@import "./block/link.scss";
|
||||
@import "./block/linkSettings.scss";
|
||||
@import "./block/mention.scss";
|
||||
@import "./block/relation.scss";
|
||||
@import "./block/common";
|
||||
@import "./block/add";
|
||||
@import "./block/context";
|
||||
@import "./block/cover";
|
||||
@import "./block/latex";
|
||||
@import "./block/link";
|
||||
@import "./block/linkSettings";
|
||||
@import "./block/mention";
|
||||
@import "./block/relation";
|
||||
|
||||
@import "./dataview/calendar.scss";
|
||||
@import "./dataview/common.scss";
|
||||
@import "./dataview/create/bookmark.scss";
|
||||
@import "./dataview/file.scss";
|
||||
@import "./dataview/filter.scss";
|
||||
@import "./dataview/group.scss";
|
||||
@import "./dataview/object.scss";
|
||||
@import "./dataview/option.scss";
|
||||
@import "./dataview/relation.scss";
|
||||
@import "./dataview/sort.scss";
|
||||
@import "./dataview/source.scss";
|
||||
@import "./dataview/text.scss";
|
||||
@import "./dataview/view.scss";
|
||||
@import "./dataview/template.scss";
|
||||
@import "./dataview/calendar";
|
||||
@import "./dataview/common";
|
||||
@import "./dataview/create/bookmark";
|
||||
@import "./dataview/file";
|
||||
@import "./dataview/filter";
|
||||
@import "./dataview/group";
|
||||
@import "./dataview/object";
|
||||
@import "./dataview/option";
|
||||
@import "./dataview/relation";
|
||||
@import "./dataview/sort";
|
||||
@import "./dataview/source";
|
||||
@import "./dataview/text";
|
||||
@import "./dataview/view";
|
||||
@import "./dataview/template";
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
@import "./auth.scss";
|
||||
@import "./main/edit.scss";
|
||||
@import "./main/graph.scss";
|
||||
@import "./main/history.scss";
|
||||
@import "./main/media.scss";
|
||||
@import "./main/navigation.scss";
|
||||
@import "./main/relation.scss";
|
||||
@import "./main/set.scss";
|
||||
@import "./main/store.scss";
|
||||
@import "./main/type.scss";
|
||||
@import "./main/archive.scss";
|
||||
@import "./main/graph.scss";
|
||||
@import "./main/navigation.scss";
|
||||
@import "./main/empty.scss";
|
||||
@import "./main/import.scss";
|
||||
@import "./main/invite.scss";
|
||||
@import "./main/membership.scss";
|
||||
@import "./main/chat.scss";
|
||||
@import "./auth";
|
||||
@import "./main/edit";
|
||||
@import "./main/graph";
|
||||
@import "./main/history";
|
||||
@import "./main/media";
|
||||
@import "./main/navigation";
|
||||
@import "./main/relation";
|
||||
@import "./main/set";
|
||||
@import "./main/store";
|
||||
@import "./main/type";
|
||||
@import "./main/archive";
|
||||
@import "./main/graph";
|
||||
@import "./main/navigation";
|
||||
@import "./main/empty";
|
||||
@import "./main/import";
|
||||
@import "./main/invite";
|
||||
@import "./main/membership";
|
||||
@import "./main/chat";
|
||||
|
|
@ -32,22 +32,22 @@ html.platformWindows {
|
|||
}
|
||||
}
|
||||
|
||||
@import "./about.scss";
|
||||
@import "./confirm.scss";
|
||||
@import "./export.scss";
|
||||
@import "./help.scss";
|
||||
@import "./invite.scss";
|
||||
@import "./membership.scss";
|
||||
@import "./migration.scss";
|
||||
@import "./objectManager.scss";
|
||||
@import "./page.scss";
|
||||
@import "./phrase.scss";
|
||||
@import "./pin.scss";
|
||||
@import "./preview.scss";
|
||||
@import "./prompt.scss";
|
||||
@import "./relation.scss";
|
||||
@import "./search.scss";
|
||||
@import "./settings.scss";
|
||||
@import "./shortcut.scss";
|
||||
@import "./usecase.scss";
|
||||
@import "./share.scss";
|
||||
@import "./about";
|
||||
@import "./confirm";
|
||||
@import "./export";
|
||||
@import "./help";
|
||||
@import "./invite";
|
||||
@import "./membership";
|
||||
@import "./migration";
|
||||
@import "./objectManager";
|
||||
@import "./page";
|
||||
@import "./phrase";
|
||||
@import "./pin";
|
||||
@import "./preview";
|
||||
@import "./prompt";
|
||||
@import "./relation";
|
||||
@import "./search";
|
||||
@import "./settings";
|
||||
@import "./shortcut";
|
||||
@import "./usecase";
|
||||
@import "./share";
|
||||
|
|
|
|||
|
|
@ -322,11 +322,11 @@ html.themeDark {
|
|||
.icon.close { background-color: var(--color-bg-secondary); }
|
||||
}
|
||||
|
||||
@import "./menu.scss";
|
||||
@import "./popup.scss";
|
||||
@import "./page.scss";
|
||||
@import "./block.scss";
|
||||
@import "./widget.scss";
|
||||
@import "./menu";
|
||||
@import "./popup";
|
||||
@import "./page";
|
||||
@import "./block";
|
||||
@import "./widget";
|
||||
}
|
||||
|
||||
html.platformWindows.themeDark, html.platformLinux.themeDark {
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@
|
|||
.head > .flex > .clickable { width: calc(100% - 36px); }
|
||||
}
|
||||
|
||||
@import "./space.scss";
|
||||
@import "./buttons.scss";
|
||||
@import "./tree.scss";
|
||||
@import "./view/common.scss";
|
||||
@import "./space";
|
||||
@import "./buttons";
|
||||
@import "./tree";
|
||||
@import "./view/common";
|
||||
|
|
@ -40,9 +40,9 @@
|
|||
}
|
||||
|
||||
.widget.widgetView {
|
||||
@import "./board.scss";
|
||||
@import "./calendar.scss";
|
||||
@import "./gallery.scss";
|
||||
@import "./list.scss";
|
||||
@import "./graph.scss";
|
||||
@import "./board";
|
||||
@import "./calendar";
|
||||
@import "./gallery";
|
||||
@import "./list";
|
||||
@import "./graph";
|
||||
}
|
||||
|
|
@ -50,11 +50,10 @@ const Sidebar = observer(class Sidebar extends React.Component {
|
|||
id="sidebar"
|
||||
className={cn.join(' ')}
|
||||
>
|
||||
<SidebarWidget {...this.props} />
|
||||
{showObject ? <SidebarObject {...this.props} /> : <SidebarWidget {...this.props} />}
|
||||
<div className="resize-h" draggable={true} onDragStart={this.onResizeStart}>
|
||||
<div className="resize-handle" onClick={this.onHandleClick} />
|
||||
</div>
|
||||
{showObject ? <SidebarObject {...this.props} /> : ''}
|
||||
</div>
|
||||
</React.Fragment>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -82,75 +82,80 @@ const SidebarObject = observer(class SidebarObject extends React.Component<{}, S
|
|||
id="containerObject"
|
||||
ref={ref => this.node = ref}
|
||||
>
|
||||
<div className="head">
|
||||
<Title text="Library" />
|
||||
|
||||
<div className="sides sidesSort">
|
||||
<div className="side left">
|
||||
<Select
|
||||
id="object-select-type"
|
||||
ref={ref => this.refSelect = ref}
|
||||
value=""
|
||||
options={typeOptions}
|
||||
onChange={this.onSwitchType}
|
||||
menuParam={{
|
||||
className: 'fixed',
|
||||
classNameWrap: 'fromSidebar',
|
||||
}}
|
||||
/>
|
||||
<div className="inner">
|
||||
<div className="head">
|
||||
<div className="titleWrap">
|
||||
<Icon className="back" onClick={() => sidebar.objectContainerToggle()} />
|
||||
<Title text={translate('commonAllContent')} />
|
||||
</div>
|
||||
<div className="side right">
|
||||
<Icon id="button-object-sort" className="sort" onClick={this.onSort} />
|
||||
|
||||
<div className="sides sidesSort">
|
||||
<div className="side left">
|
||||
<Select
|
||||
id="object-select-type"
|
||||
ref={ref => this.refSelect = ref}
|
||||
value=""
|
||||
options={typeOptions}
|
||||
onChange={this.onSwitchType}
|
||||
menuParam={{
|
||||
className: 'fixed',
|
||||
classNameWrap: 'fromSidebar',
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="side right">
|
||||
<Icon id="button-object-sort" className="sort" onClick={this.onSort} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="sides sidesFilter">
|
||||
<div className="side left">
|
||||
<Filter
|
||||
ref={ref => this.refFilter = ref}
|
||||
icon="search"
|
||||
placeholder={translate('commonSearch')}
|
||||
onChange={this.onFilterChange}
|
||||
onClear={this.onFilterClear}
|
||||
/>
|
||||
</div>
|
||||
<div className="side right">
|
||||
{isAllowedObject ? <Button color="blank" className="c28" text={translate('commonNew')} onClick={this.onAdd} /> : ''}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="sides sidesFilter">
|
||||
<div className="side left">
|
||||
<Filter
|
||||
ref={ref => this.refFilter = ref}
|
||||
icon="search"
|
||||
placeholder={translate('commonSearch')}
|
||||
onChange={this.onFilterChange}
|
||||
onClear={this.onFilterClear}
|
||||
/>
|
||||
</div>
|
||||
<div className="side right">
|
||||
{isAllowedObject ? <Button color="blank" className="c28" text={translate('commonNew')} onClick={this.onAdd} /> : ''}
|
||||
</div>
|
||||
<div className="body">
|
||||
{this.cache && items.length && !isLoading ? (
|
||||
<div className="items">
|
||||
<InfiniteLoader
|
||||
rowCount={items.length + 1}
|
||||
loadMoreRows={this.loadMoreRows}
|
||||
isRowLoaded={({ index }) => !!items[index]}
|
||||
threshold={LIMIT}
|
||||
>
|
||||
{({ onRowsRendered }) => (
|
||||
<AutoSizer className="scrollArea">
|
||||
{({ width, height }) => (
|
||||
<List
|
||||
ref={ref => this.refList = ref}
|
||||
width={width}
|
||||
height={height}
|
||||
deferredMeasurmentCache={this.cache}
|
||||
rowCount={items.length}
|
||||
rowHeight={HEIGHT}
|
||||
rowRenderer={rowRenderer}
|
||||
onRowsRendered={onRowsRendered}
|
||||
overscanRowCount={10}
|
||||
scrollToAlignment="center"
|
||||
/>
|
||||
)}
|
||||
</AutoSizer>
|
||||
)}
|
||||
</InfiniteLoader>
|
||||
</div>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="body">
|
||||
{this.cache && items.length && !isLoading ? (
|
||||
<div className="items">
|
||||
<InfiniteLoader
|
||||
rowCount={items.length + 1}
|
||||
loadMoreRows={this.loadMoreRows}
|
||||
isRowLoaded={({ index }) => !!items[index]}
|
||||
threshold={LIMIT}
|
||||
>
|
||||
{({ onRowsRendered }) => (
|
||||
<AutoSizer className="scrollArea">
|
||||
{({ width, height }) => (
|
||||
<List
|
||||
ref={ref => this.refList = ref}
|
||||
width={width}
|
||||
height={height}
|
||||
deferredMeasurmentCache={this.cache}
|
||||
rowCount={items.length}
|
||||
rowHeight={HEIGHT}
|
||||
rowRenderer={rowRenderer}
|
||||
onRowsRendered={onRowsRendered}
|
||||
overscanRowCount={10}
|
||||
scrollToAlignment="center"
|
||||
/>
|
||||
)}
|
||||
</AutoSizer>
|
||||
)}
|
||||
</InfiniteLoader>
|
||||
</div>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
@ -172,7 +177,6 @@ const SidebarObject = observer(class SidebarObject extends React.Component<{}, S
|
|||
|
||||
this.refSelect.setOptions(this.getTypeOptions());
|
||||
this.refSelect.setValue(this.type);
|
||||
this.rebind();
|
||||
this.load(true);
|
||||
};
|
||||
|
||||
|
|
@ -188,28 +192,6 @@ const SidebarObject = observer(class SidebarObject extends React.Component<{}, S
|
|||
|
||||
componentWillUnmount(): void {
|
||||
window.clearTimeout(this.timeoutFilter);
|
||||
this.unbind();
|
||||
};
|
||||
|
||||
unbind () {
|
||||
$(window).off('click.sidebarContainerObject');
|
||||
};
|
||||
|
||||
rebind () {
|
||||
this.unbind();
|
||||
|
||||
$(window).on('click.sidebarContainerObject', (e: any) => {
|
||||
const target = $(e.target);
|
||||
|
||||
if (
|
||||
!target.parents('#containerObject').length &&
|
||||
!target.parents('#header').length &&
|
||||
!target.parents('.menus').length &&
|
||||
!target.parents('.popups').length
|
||||
) {
|
||||
sidebar.objectContainerToggle();
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
load (clear: boolean, callBack?: (message: any) => void) {
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ const WidgetButtons = observer(class WidgetSpace extends React.Component<I.Widge
|
|||
getItems () {
|
||||
const space = U.Space.getSpaceview();
|
||||
const ret = [
|
||||
{ id: 'all', name: translate('widgetButtonAllContent') },
|
||||
{ id: 'all', name: translate('commonAllContent') },
|
||||
//{ id: 'store', name: translate('commonLibrary') },
|
||||
{ id: 'bin', name: translate('commonBin') },
|
||||
];
|
||||
|
|
|
|||
|
|
@ -13,8 +13,6 @@ class Sidebar {
|
|||
isClosed: false,
|
||||
};
|
||||
obj: JQuery<HTMLElement> = null;
|
||||
containerWidget: JQuery<HTMLElement> = null;
|
||||
containerObject: JQuery<HTMLElement> = null;
|
||||
page: JQuery<HTMLElement> = null;
|
||||
header: JQuery<HTMLElement> = null;
|
||||
footer: JQuery<HTMLElement> = null;
|
||||
|
|
@ -57,8 +55,6 @@ class Sidebar {
|
|||
|
||||
initObjects () {
|
||||
this.obj = $('#sidebar');
|
||||
this.containerWidget = this.obj.find('#containerWidget');
|
||||
this.containerObject = this.obj.find('#containerObject');
|
||||
this.page = $('#page.isFull');
|
||||
this.header = this.page.find('#header');
|
||||
this.footer = this.page.find('#footer');
|
||||
|
|
@ -75,8 +71,6 @@ class Sidebar {
|
|||
return;
|
||||
};
|
||||
|
||||
S.Common.showObjectSet(false);
|
||||
|
||||
this.obj.addClass('anim');
|
||||
this.setElementsWidth(width);
|
||||
this.setAnimating(true);
|
||||
|
|
@ -134,8 +128,8 @@ class Sidebar {
|
|||
};
|
||||
|
||||
setElementsWidth (width: any): void {
|
||||
this.containerWidget.find('> .head').css({ width });
|
||||
this.containerWidget.find('> .body').css({ width });
|
||||
this.obj.find('> .head').css({ width });
|
||||
this.obj.find('> .body').css({ width });
|
||||
};
|
||||
|
||||
setWidth (w: number): void {
|
||||
|
|
@ -287,7 +281,7 @@ class Sidebar {
|
|||
|
||||
const width = v.isClosed ? 0 : v.width;
|
||||
|
||||
this.containerWidget.css({ width });
|
||||
this.obj.css({ width });
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -330,7 +324,6 @@ class Sidebar {
|
|||
|
||||
objectContainerToggle () {
|
||||
S.Common.showObjectSet(!S.Common.showObject);
|
||||
requestAnimationFrame(() => this.resizePage(null, false));
|
||||
};
|
||||
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue