diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/PropertiesView.scss | 38 | ||||
| -rw-r--r-- | src/client/views/PropertiesView.tsx | 40 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx | 4 |
3 files changed, 59 insertions, 23 deletions
diff --git a/src/client/views/PropertiesView.scss b/src/client/views/PropertiesView.scss index 554f137cb..b75e7182c 100644 --- a/src/client/views/PropertiesView.scss +++ b/src/client/views/PropertiesView.scss @@ -2,6 +2,7 @@ .propertiesView { height: 100%; + width: 250; font-family: "Roboto"; cursor: auto; @@ -836,3 +837,40 @@ .properties-flyout { grid-column: 2/4; } + +.propertiesView-linking { + padding: 5%; +} + +.propertiesView-section { + padding: 10px 0; +} + +.propertiesView-input { + padding: 4px 8px; + + .text { + width: 100%; + } + + &.first { + padding-top: 6px; + } + + &.inline { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + } +} + +.propertiesView-label { + font-weight: bold; + font-size: 12.5px; + padding: 4px; + display: flex; + color: white; + padding-left: 8px; + background-color: rgb(51, 51, 51); +}
\ No newline at end of file diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx index 334a44b3b..b5bae6652 100644 --- a/src/client/views/PropertiesView.tsx +++ b/src/client/views/PropertiesView.tsx @@ -1111,25 +1111,25 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <div className="propertiesView-title"> Linking </div> - <div className="properties-grid col propertiesView-textInfo"> - Information - <div className="row" id="propertiesView-label"> + <div className="propertiesView-section"> + <p className="propertiesView-label">Information</p> + <div className="propertiesView-input first" id="propertiesView-label"> <p>Label</p> - <input type="text" /> + <input className="text" type="text" /> </div> - <div className="row" id="propertiesView-category"> - <p>Label</p> - <input type="text" /> + <div className="propertiesView-input" id="propertiesView-category"> + <p>Category</p> + <input className="text" type="text" /> </div> - <div className="row" id="propertiesView-description"> + <div className="propertiesView-input" id="propertiesView-description"> <p>Description</p> - <input type="text" /> + <input className="text" type="text" /> </div> </div> - <div className="propertiesView-behavior"> - Behavior - <div id="propertiesView-follow"> - Follow + <div className="propertiesView-section"> + <p className="propertiesView-label">Behavior</p> + <div className="propertiesView-input inline first" id="propertiesView-follow"> + <p>Follow</p> <select name="selectList" id="selectList"> <option value="default">Default</option> <option value="newLeft">Open in new left pane</option> @@ -1140,22 +1140,22 @@ export class PropertiesView extends React.Component<PropertiesViewProps> { <option value="openTab">Open in new tab</option> </select> </div> - <div id="propertiesView-anchor"> - Auto-move anchor + <div className="propertiesView-input inline" id="propertiesView-anchor"> + <p>Auto-move anchor</p> <button - style={{ backgroundColor: this.selectedDoc.anchor ? 'blue' : 'white', width: 50, height: 50 }} + style={{ backgroundColor: this.selectedDoc.anchor ? 'blue' : 'white', width: '2rem', height: '2rem' }} onClick={this.toggleAnchor} /> </div> - <div id="propertiesView-arrow"> - Auto-move arrow + <div className="propertiesView-input inline" id="propertiesView-arrow"> + <p>Auto-move arrow</p> <button - style={{ backgroundColor: this.selectedDoc.arrow ? 'blue' : 'white', width: 50, height: 50 }} + style={{ backgroundColor: this.selectedDoc.arrow ? 'blue' : 'white', width: '2rem', height: '2rem' }} onClick={this.toggleArrow} /> </div> </div> - </div>; + </div >; } if (this.selectedDoc && !this.isPres) { return <div className="propertiesView" style={{ diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx index d4ef76221..5391061b1 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx @@ -215,9 +215,7 @@ export class CollectionFreeFormLinkView extends React.Component<CollectionFreeFo return !a.width || !b.width || ((!this.props.LinkDocs[0].linkDisplay) && !aActive && !bActive) ? (null) : (<> <path className="collectionfreeformlinkview-linkLine" style={{ pointerEvents: "all", opacity: this._opacity, stroke: SelectionManager.SelectedSchemaDoc() === this.props.LinkDocs[0] ? "red" : stroke, strokeWidth }} onClick={this.onClickLine} - onPointerOver={() => { - console.log(this.props.LinkDocs[0].directed) - }} /> + d={`M ${pt1[0]} ${pt1[1]} C ${pt1[0] + pt1norm[0]} ${pt1[1] + pt1norm[1]}, ${pt2[0] + pt2norm[0]} ${pt2[1] + pt2norm[1]}, ${pt2[0]} ${pt2[1]}`} /> {textX === undefined ? (null) : <text className="collectionfreeformlinkview-linkText" x={textX} y={textY} onPointerDown={this.pointerDown} > {Field.toString(this.props.LinkDocs[0].description as any as Field)} </text>} |