aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/documents/Documents.ts4
-rw-r--r--src/client/views/EditableView.tsx2
-rw-r--r--src/client/views/collections/CollectionDockingView.tsx2
-rw-r--r--src/client/views/collections/CollectionFreeFormView.scss6
-rw-r--r--src/client/views/collections/CollectionFreeFormView.tsx6
-rw-r--r--src/client/views/collections/CollectionSchemaView.scss73
-rw-r--r--src/client/views/collections/CollectionSchemaView.tsx7
-rw-r--r--src/client/views/nodes/CollectionFreeFormDocumentView.tsx2
-rw-r--r--src/client/views/nodes/FormattedTextBox.scss4
-rw-r--r--src/client/views/nodes/FormattedTextBox.tsx6
-rw-r--r--src/client/views/nodes/ImageBox.scss6
11 files changed, 58 insertions, 60 deletions
diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 4c5f26fbd..2dfff6235 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -128,8 +128,8 @@ export namespace Documents {
// example of custom display string for an image that shows a caption.
function EmbeddedCaption() {
- return `<div style="position:absolute; height:100%">
- <div style="position:relative; margin:auto; width:85%; margin:auto" >`
+ return `<div style="height:100%">
+ <div style="position:relative; margin:auto; height:85%;" >`
+ ImageBox.LayoutString() +
`</div>
<div style="position:relative; overflow:auto; height:15%; text-align:center; ">`
diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx
index 3d1c2ebf4..8d9a47eaa 100644
--- a/src/client/views/EditableView.tsx
+++ b/src/client/views/EditableView.tsx
@@ -30,7 +30,7 @@ export class EditableView extends React.Component<EditableProps> {
style={{ width: "100%" }}></input>
} else {
return (
- <div style={{ alignItems: "center", display: "flex", height: "100%", maxHeight: `${this.props.height}` }}
+ <div className="editableView-container-editing" style={{ display: "flex", height: "100%", maxHeight: `${this.props.height}` }}
onClick={action(() => this.editing = true)}
>
{this.props.contents}
diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx
index 86dc66e39..2230ec14f 100644
--- a/src/client/views/collections/CollectionDockingView.tsx
+++ b/src/client/views/collections/CollectionDockingView.tsx
@@ -285,7 +285,7 @@ export class DockedFrameRenderer extends React.Component<DockedFrameProps> {
if (!this._document)
return (null);
var content =
- <div ref={this._mainCont}>
+ <div className="collectionDockingView-content" ref={this._mainCont}>
<DocumentView key={this._document.Id} Document={this._document}
AddDocument={undefined}
RemoveDocument={undefined}
diff --git a/src/client/views/collections/CollectionFreeFormView.scss b/src/client/views/collections/CollectionFreeFormView.scss
index e682b9815..d583a8218 100644
--- a/src/client/views/collections/CollectionFreeFormView.scss
+++ b/src/client/views/collections/CollectionFreeFormView.scss
@@ -8,6 +8,12 @@
border-radius: 5px;
background-color: rgba(0,0,0,.5);
}
+
+ .collectionfreeformview > .jsx-parser{
+ position:absolute;
+ height: 100%;
+ }
+
border-style: solid;
box-sizing: border-box;
position: relative;
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index cb6668634..c40da6eaa 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -217,12 +217,6 @@ export class CollectionFreeFormView extends CollectionViewBase {
render() {
const panx: number = this.props.Document.GetNumber(KeyStore.PanX, 0);
const pany: number = this.props.Document.GetNumber(KeyStore.PanY, 0);
- var overlay = this.overlayView ?
- <div style={{ position: "absolute", width: "100%", height: "100%" }}>
- {this.overlayView}
- </div>
- :
- (null);
return (
<div className="collectionfreeformview-container"
onPointerDown={this.onPointerDown}
diff --git a/src/client/views/collections/CollectionSchemaView.scss b/src/client/views/collections/CollectionSchemaView.scss
index ba9afee62..3bf84f3cd 100644
--- a/src/client/views/collections/CollectionSchemaView.scss
+++ b/src/client/views/collections/CollectionSchemaView.scss
@@ -14,16 +14,6 @@
background-color: rgba(0,0,0,.5);
}
- .collectionfreeformview-container {
- border-width: 0px;
- .collectionfreeformview > .jsx-parser{
- position:absolute
- }
- }
- .imageBox-cont {
- position:relative;
- max-height:100%;
- }
.ReactTable {
position: absolute;
// display: inline-block;
@@ -32,23 +22,40 @@
height: 100%;
background: white;
box-sizing: border-box;
- }
- .ReactTable .rt-table {
- overflow-y: auto;
- overflow-x: auto;
- height: 100%;
+ .rt-table {
+ overflow-y: auto;
+ overflow-x: auto;
+ height: 100%;
- display: -webkit-inline-box;
- direction: ltr;
- // direction:rtl;
- // display:block;
- }
- .ReactTable .rt-tbody {
- //direction: ltr;
- direction: rtl;
- }
- .ReactTable .rt-tr-group {
- direction: ltr;
+ display: -webkit-inline-box;
+ direction: ltr;
+ // direction:rtl;
+ // display:block;
+ }
+ .rt-tbody {
+ //direction: ltr;
+ direction: rtl;
+ }
+ .rt-tr-group {
+ direction: ltr;
+ }
+ .rt-td {
+ border-width: 1;
+ border-right-color: #aaa;
+ .imageBox-cont {
+ position:relative;
+ max-height:100%;
+ }
+ .imageBox-cont img {
+ object-fit: contain;
+ max-width: 100%;
+ height: 100%
+ }
+ }
+ .rt-tr-group {
+ border-width: 1;
+ border-bottom-color: #aaa
+ }
}
.ReactTable .rt-thead.-header {
background:grey;
@@ -61,24 +68,10 @@
border-bottom-style: solid;
border-bottom-width: 1;
}
- .ReactTable .rt-td {
- border-width: 1;
- border-right-color: #aaa
- }
- .ReactTable .rt-tr-group {
- border-width: 1;
- border-bottom-color: #aaa
- }
- .imageBox-cont img {
- object-fit: contain;
- height: 100%
- }
.documentView-node:first-child {
background: grey;
.imageBox-cont img {
object-fit: contain;
- max-width: 100%;
- height: 100%
}
}
}
diff --git a/src/client/views/collections/CollectionSchemaView.tsx b/src/client/views/collections/CollectionSchemaView.tsx
index d2db93120..dc952ef82 100644
--- a/src/client/views/collections/CollectionSchemaView.tsx
+++ b/src/client/views/collections/CollectionSchemaView.tsx
@@ -16,6 +16,8 @@ import "./CollectionSchemaView.scss";
import { COLLECTION_BORDER_WIDTH } from "./CollectionView";
import { CollectionViewBase } from "./CollectionViewBase";
+// bcz: need to add drag and drop of rows and columns. This seems like it might work for rows: https://codesandbox.io/s/l94mn1q657
+
@observer
export class CollectionSchemaView extends CollectionViewBase {
private _mainCont = React.createRef<HTMLDivElement>();
@@ -140,7 +142,7 @@ export class CollectionSchemaView extends CollectionViewBase {
let content = this._selectedIndex == -1 || !selected ? (null) : (
<Measure onResize={this.setScaling}>
{({ measureRef }) =>
- <div ref={measureRef}>
+ <div className="collectionSchemaView-content" ref={measureRef}>
<DocumentView Document={selected}
AddDocument={this.props.addDocument} RemoveDocument={this.props.removeDocument}
isTopMost={false}
@@ -173,7 +175,8 @@ export class CollectionSchemaView extends CollectionViewBase {
}))}
column={{
...ReactTableDefaults.column,
- Cell: this.renderCell
+ Cell: this.renderCell,
+
}}
getTrProps={this.getTrProps}
/>
diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
index 17123bf52..d7243421a 100644
--- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
+++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx
@@ -88,7 +88,7 @@ export class CollectionFreeFormDocumentView extends React.Component<DocumentView
render() {
return (
- <div ref={this._mainCont} style={{
+ <div className="collectionFreeFormDocumentView-container" ref={this._mainCont} style={{
transformOrigin: "left top",
transform: this.transform,
width: this.width,
diff --git a/src/client/views/nodes/FormattedTextBox.scss b/src/client/views/nodes/FormattedTextBox.scss
index 226456fab..0389a3f85 100644
--- a/src/client/views/nodes/FormattedTextBox.scss
+++ b/src/client/views/nodes/FormattedTextBox.scss
@@ -11,4 +11,8 @@
.formattedTextBox-cont {
background: beige;
padding: 0;
+ overflow-y: scroll;
+ overflow-x: hidden;
+ color: initial;
+ height: 100%;
} \ No newline at end of file
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index c0969a8c3..60ee0b5e1 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -112,12 +112,8 @@ export class FormattedTextBox extends React.Component<FieldViewProps> {
}
}
render() {
+ var val = this.props.doc.Get(this.props.fieldKey);
return (<div className="formattedTextBox-cont"
- style={{
- color: "initial",
- whiteSpace: "initial",
- height: "auto"
- }}
onPointerDown={this.onPointerDown}
ref={this._ref} />)
}
diff --git a/src/client/views/nodes/ImageBox.scss b/src/client/views/nodes/ImageBox.scss
index 5b15b3329..ea459b911 100644
--- a/src/client/views/nodes/ImageBox.scss
+++ b/src/client/views/nodes/ImageBox.scss
@@ -4,12 +4,14 @@
position: relative;
text-align: center;
width: 100%;
+ height: auto;
max-width: 100%;
max-height: 100%
}
+
.imageBox-cont img {
- max-width: 100%;
- max-height: 100%
+ object-fit: contain;
+ height: 100%;
}
.imageBox-button {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 17:49:30 +0000