Skip to content

Commit 15ae005

Browse files
namedgraphclaude
andcommitted
Add CSS for 3D graph overlay panels
Panels need position:absolute to overlay the ForceGraph3D WebGL canvas instead of stacking below it (which gets clipped by overflow:hidden). Adds rules for tooltip, info-panel, show-panel, and zoom button. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
1 parent 358ebfe commit 15ae005

1 file changed

Lines changed: 11 additions & 0 deletions

File tree

  • src/main/webapp/static/com/atomgraph/linkeddatahub/css

src/main/webapp/static/com/atomgraph/linkeddatahub/css/bootstrap.css

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -175,6 +175,17 @@ object { display: block; margin: auto; max-height: 400px; overflow: hidden; widt
175175
.chart-canvas { width: 100%; height: 400px; }
176176
.chart-canvas .google-visualization-table { width: 100%; }
177177
.graph-3d-canvas { width: 100%; height: 600px; overflow: hidden; background: #141414; position: relative; }
178+
.graph-3d-tooltip { display: none; position: absolute; background: rgba(0,0,0,0.75); color: #fff; padding: 4px 8px; border-radius: 4px; pointer-events: none; font-size: 12px; z-index: 10; }
179+
.graph-3d-info-panel { position: absolute; top: 10px; right: 10px; z-index: 10; background: rgba(0,0,0,0.7); color: #fff; padding: 8px 12px; border-radius: 4px; max-width: 280px; font-size: 12px; }
180+
.graph-3d-info-panel h4 { margin: 0 0 4px; font-size: 13px; }
181+
.graph-3d-info-panel dl { margin: 0; }
182+
.graph-3d-info-panel dt { font-weight: bold; margin-top: 4px; }
183+
.graph-3d-info-panel dd { margin: 0; word-break: break-all; }
184+
.graph-3d-info-panel a { color: #8cf; }
185+
.graph-3d-show-panel { position: absolute; bottom: 30px; left: 10px; z-index: 10; background: rgba(0,0,0,0.7); color: #fff; padding: 8px 12px; border-radius: 4px; font-size: 12px; }
186+
.graph-3d-show-panel label { display: block; cursor: pointer; }
187+
.graph-3d-show-panel label.sub-option { margin-left: 16px; }
188+
.graph-3d-zoom { position: absolute; top: 10px; left: 10px; z-index: 10; }
178189
.table { display: table; }
179190
.row { display: table-row ; }
180191
.cell { display: table-cell ; }

0 commit comments

Comments
 (0)