gru/rustpad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes in ux

Browse Source
This commit is contained in:
Mateusz Gruszczyński
2026-07-20 23:38:56 +02:00
parent 9afaa3dc60
commit 4bb92a343b
4 changed files with 108 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/styles.css
+26
View File
@@ -293,3 +293,29 @@ dialog::backdrop { background: rgba(4,6,9,.82); }
@media (max-width: 900px) { .editor-controls { order: 3; width: 100%; } .editor-toolbar { flex-wrap: wrap; } }
.editor-shell textarea { white-space: pre; overflow: auto; overflow-wrap: normal; word-break: normal; }
/* Keep line numbers exactly aligned with the logical text lines. */
.line-gutter { box-sizing: border-box; font-size: var(--editor-font-size, 18px); line-height: normal; }
.line-gutter div { box-sizing: border-box; padding-right: 8px; line-height: inherit; }
.compact-editor .line-gutter { font-size: calc(var(--editor-font-size, 18px) - 2px); }
/* Image crop/resize dialog. */
.image-editor-dialog { width: min(920px, calc(100% - 28px)); max-width: none; padding: 0; border: 1px solid var(--border); border-radius: 14px; background: #11151b; color: #eef2f7; }
.image-editor-dialog::backdrop { background: rgba(4,6,9,.78); backdrop-filter: blur(4px); }
.image-editor-panel { display: grid; gap: 16px; padding: 18px; }
.image-editor-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.image-editor-head h2 { margin: 0; }
.image-editor-head p { margin: 5px 0 0; color: var(--muted); }
.image-crop-stage { display: grid; place-items: center; min-height: 360px; max-height: 58vh; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: #080b10; }
.image-crop-stage canvas { display: block; max-width: 100%; max-height: 58vh; cursor: grab; touch-action: none; }
.image-crop-stage canvas:active { cursor: grabbing; }
.image-editor-controls { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.image-editor-controls label { display: grid; gap: 6px; color: var(--muted); font-size: .78rem; }
.image-editor-controls select,.image-editor-controls input { width: 100%; }
.image-editor-actions { display: flex; justify-content: flex-end; gap: 10px; }
@media (max-width: 680px) { .image-editor-controls { grid-template-columns: 1fr; } .image-crop-stage { min-height: 260px; } }
/* Wider published page workspace. */
.public-header { padding-inline: max(20px, calc((100vw - 1180px) / 2)); }
.public-document { width: min(1180px, calc(100% - 32px)); }
.public-content { padding: clamp(24px, 4vw, 52px); }