diff options
6 files changed, 125 insertions, 124 deletions
diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx index 94f85d429..756b37f99 100644 --- a/src/client/views/collections/CollectionCardDeckView.tsx +++ b/src/client/views/collections/CollectionCardDeckView.tsx @@ -540,11 +540,10 @@ export class CollectionCardView extends CollectionSubView() { height: `${100 / this.nativeScaling / fitContentScale}%`, width: `${100 / this.nativeScaling / fitContentScale}%`, transform: `scale(${this.nativeScaling * fitContentScale})`, - }}> - {this.flashCardUI(this.curDoc, this.docViewProps, this.answered)} - </div> + }}></div> </div> + {this.flashCardUI(this.curDoc, this.docViewProps, this.answered)} <div className="collectionCardView-cardSizeDragger" onPointerDown={this.cardSizerDown} diff --git a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx index 710c00841..a0d5f9f70 100644 --- a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx +++ b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx @@ -258,7 +258,6 @@ export class CollectionMasonryViewFieldRow extends ObservableReactComponent<CMVF const stackPad = showChrome ? `0px ${this._props.parent.xMargin}px` : `${this._props.parent.yMargin}px ${this._props.parent.xMargin}px 0px ${this._props.parent.xMargin}px `; return this.collapsed ? null : ( <div style={{ position: 'relative' }}> - {this._props.showHandle && this._props.parent._props.isContentActive() ? this._props.parent.columnDragger : null} {showChrome ? ( <div className="collectionStackingView-addDocumentButton" diff --git a/src/client/views/collections/CollectionStackingView.scss b/src/client/views/collections/CollectionStackingView.scss index 565536623..05ac52ff9 100644 --- a/src/client/views/collections/CollectionStackingView.scss +++ b/src/client/views/collections/CollectionStackingView.scss @@ -12,123 +12,123 @@ position: relative; height: 100%; width: 100%; -} - -// TODO:glr Turn this into a seperate class -.documentButtonMenu { - position: relative; - height: fit-content; - border-bottom: global.$standard-border; - display: flex; - justify-content: center; - flex-direction: column; - align-items: center; - align-content: center; - padding: 5px 0 5px 0; - .documentExplanation { - width: 90%; - margin: 5px; - font-size: 11px; - color: global.$medium-blue; - padding: 10px; - border-radius: 5px; - border: solid 0.5px global.$medium-blue; + .collectionStackingView-columnDragger { + width: 28; + height: 28; + position: absolute; + margin-left: -5; + z-index: 10; + > svg { + width: 100%; + height: 100%; + } } -} -.collectionStackingView, -.collectionMasonryView { - height: 100%; - width: 100%; - position: absolute; - top: 0; - overflow-y: auto; - overflow-x: hidden; - flex-wrap: wrap; - transition: top 0.5s; - - > div { + // TODO:glr Turn this into a seperate class + .documentButtonMenu { position: relative; - display: block; - } - - .collectionStackingViewFieldColumn { + height: fit-content; + border-bottom: global.$standard-border; display: flex; + justify-content: center; flex-direction: column; + align-items: center; + align-content: center; + padding: 5px 0 5px 0; + + .documentExplanation { + width: 90%; + margin: 5px; + font-size: 11px; + color: global.$medium-blue; + padding: 10px; + border-radius: 5px; + border: solid 0.5px global.$medium-blue; + } } - .collectionSchemaView-previewDoc { + .collectionStackingView, + .collectionMasonryView { height: 100%; + width: 100%; position: absolute; - } + top: 0; + overflow-y: auto; + overflow-x: hidden; + flex-wrap: wrap; + transition: top 0.5s; - .collectionStackingView-docView-container { - width: 45%; - margin: 5% 2.5%; - padding-left: 2.5%; - height: auto; - } + > div { + position: relative; + display: block; + } - .collectionStackingView-flexCont { - display: flex; - flex-direction: row; - flex-wrap: wrap; - align-items: center; - } + .collectionStackingViewFieldColumn { + display: flex; + flex-direction: column; + } - .collectionStackingView-masonrySingle, - .collectionStackingView-masonryGrid { - width: 100%; - display: grid; - top: 0; - left: 0; - } + .collectionSchemaView-previewDoc { + height: 100%; + position: absolute; + } - .collectionStackingView-masonrySingle { - height: 100%; - position: absolute; - } + .collectionStackingView-docView-container { + width: 45%; + margin: 5% 2.5%; + padding-left: 2.5%; + height: auto; + } - .collectionStackingView-masonryGrid { - margin: auto; - height: max-content; - position: relative; - grid-auto-rows: 0px; - } + .collectionStackingView-flexCont { + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: center; + } - .collectionStackingView-masonrySingle { - width: 100%; - height: 100%; - position: absolute; - display: flex; - flex-direction: column; - top: 0; - left: 0; - width: 100%; - position: absolute; - } + .collectionStackingView-masonrySingle, + .collectionStackingView-masonryGrid { + width: 100%; + display: grid; + top: 0; + left: 0; + } - .collectionStackingView-description { - font-size: 100%; - margin-bottom: 1vw; - padding: 10px; - height: 2vw; - width: 100%; - font-family: global.$sans-serif; - background: global.$dark-gray; - color: global.$white; - } + .collectionStackingView-masonrySingle { + height: 100%; + position: absolute; + } - .collectionStackingView-columnDragger { - width: 28; - height: 28; - position: absolute; - margin-left: -5; - z-index: 10; - > svg { + .collectionStackingView-masonryGrid { + margin: auto; + height: max-content; + position: relative; + grid-auto-rows: 0px; + } + + .collectionStackingView-masonrySingle { width: 100%; height: 100%; + position: absolute; + display: flex; + flex-direction: column; + top: 0; + left: 0; + width: 100%; + position: absolute; + } + + .collectionStackingView-description { + font-size: 100%; + margin-bottom: 1vw; + padding: 10px; + height: 2vw; + width: 100%; + font-family: global.$sans-serif; + background: global.$dark-gray; + color: global.$white; } } diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index 0a25882ff..e8fa8b01e 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -452,7 +452,7 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection }; @action onDividerMove = (e: PointerEvent) => { - this.Document._layout_columnWidth = Math.max(10, this.ScreenToLocalBoxXf().transformPoint(e.clientX, 0)[0] - this.xMargin); + this.Document._layout_columnWidth = Math.max(10, (this._props.DocumentView?.().screenToViewTransform().transformPoint(e.clientX, 0)[0] ?? 0) - this.xMargin); return false; }; @@ -606,26 +606,29 @@ export class CollectionStackingView extends CollectionSubView<Partial<collection } const rows = () => (!this.isStackingView ? 1 : Math.max(1, Math.min(docList.length, Math.floor((this._props.PanelWidth() - 2 * this.xMargin) / (this.columnWidth + this.gridGap))))); return ( - <div style={{ top: this.yMargin }}> - <CollectionMasonryViewFieldRow - showHandle={first} - Document={this.Document} - chromeHidden={this.chromeHidden} - pivotField={this.pivotField} - refList={this._refList} - key={heading ? heading.heading : ''} - rows={rows} - headings={this.headings} - heading={heading ? heading.heading : ''} - headingObject={heading} - docList={docList} - parent={this} - type={type} - createDropTarget={this.createDashEventsTarget} - screenToLocalTransform={this.ScreenToLocalBoxXf} - setDocHeight={this.setDocHeight} - /> - </div> + <> + {this._props.isContentActive() && !this.isStackingView ? this.columnDragger : null} + <div style={{ top: this.yMargin }}> + <CollectionMasonryViewFieldRow + showHandle={first} + Document={this.Document} + chromeHidden={this.chromeHidden} + pivotField={this.pivotField} + refList={this._refList} + key={heading ? heading.heading : ''} + rows={rows} + headings={this.headings} + heading={heading ? heading.heading : ''} + headingObject={heading} + docList={docList} + parent={this} + type={type} + createDropTarget={this.createDashEventsTarget} + screenToLocalTransform={this.ScreenToLocalBoxXf} + setDocHeight={this.setDocHeight} + /> + </div> + </> ); }; diff --git a/src/client/views/global/globalScripts.ts b/src/client/views/global/globalScripts.ts index b455f76e4..835c28daa 100644 --- a/src/client/views/global/globalScripts.ts +++ b/src/client/views/global/globalScripts.ts @@ -127,7 +127,7 @@ ScriptingGlobals.add(function setBackgroundColor(color?: string, checkResult?: b const contentFrameNumber = Cast(selView.Document?._currentFrame, 'number', layoutFrameNumber ?? null); // frame number that content is at which determines what content is displayed return CollectionFreeFormDocumentView.getStringValues(selView?.Document, contentFrameNumber)[fieldKey] || defaultFill(); } - setDefaultFill(color ?? 'transparent'); + !selectedViews.length && setDefaultFill(color ?? 'transparent'); selectedViews.forEach(dv => { const fieldKey = dv.Document._layout_isSvg ? 'fillColor' : 'backgroundColor'; const layoutFrameNumber = Cast(dv.containerViewPath?.().lastElement()?.Document?._currentFrame, 'number'); // frame number that container is at which determines layout frame values diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index b40ead03a..5f5dd1210 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -780,7 +780,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document transform: `scale(${this.uiBtnScaling})`, bottom: Number.isNaN(this.maxWidgetSize) ? undefined : this.maxWidgetSize, }}> - {this._props.DocumentView?.() ? <TagsView Views={[this._props.DocumentView?.()]} /> : null} + {this._props.DocumentView?.() && !this._props.docViewPath().slice(-2)[0].ComponentView?.isUnstyledView?.() ? <TagsView Views={[this._props.DocumentView?.()]} /> : null} </div> ) : ( <> |