Release v0.4.0: dev -> main #251
@@ -127,8 +127,19 @@ body {
|
|||||||
.pane-l-col { display: flex; flex-direction: column; gap: 14px; min-height: 0; }
|
.pane-l-col { display: flex; flex-direction: column; gap: 14px; min-height: 0; }
|
||||||
.pane-l-head { flex-shrink: 0; }
|
.pane-l-head { flex-shrink: 0; }
|
||||||
.editor-head {
|
.editor-head {
|
||||||
display: flex; align-items: center; gap: 12px; padding: 12px 16px;
|
display: flex; align-items: stretch; gap: 12px; padding: 12px 16px;
|
||||||
}
|
}
|
||||||
|
/* #147: title lives in its own pill; select+refresh stay paired in a second pill */
|
||||||
|
.editor-head-title,
|
||||||
|
.editor-head-settings {
|
||||||
|
display: flex; align-items: center; gap: 8px;
|
||||||
|
background: var(--surface-2); border: 1px solid var(--border);
|
||||||
|
border-radius: var(--radius); padding: 6px 10px;
|
||||||
|
}
|
||||||
|
.editor-head-title { flex: 1; min-width: 0; }
|
||||||
|
.editor-head-settings { flex: 0 0 fit-content; }
|
||||||
|
.editor-head-title:focus-within,
|
||||||
|
.editor-head-settings:focus-within { border-color: var(--accent); }
|
||||||
.editor-head input {
|
.editor-head input {
|
||||||
border: none; outline: none; background: transparent; color: var(--fg); font: inherit; font-size: 23.2px; flex: 1;
|
border: none; outline: none; background: transparent; color: var(--fg); font: inherit; font-size: 23.2px; flex: 1;
|
||||||
}
|
}
|
||||||
@@ -521,8 +532,11 @@ a.admin-link:hover { color: var(--fg); text-decoration: underline; }
|
|||||||
.editor-wrap { min-height: 45vh; }
|
.editor-wrap { min-height: 45vh; }
|
||||||
.editor { font-size: 15px; }
|
.editor { font-size: 15px; }
|
||||||
.gutter { font-size: 15px; }
|
.gutter { font-size: 15px; }
|
||||||
|
.editor-head { flex-wrap: wrap; }
|
||||||
|
.editor-head-title { flex: 1 1 100%; }
|
||||||
.editor-head input { min-width: 0; font-size: 16px; }
|
.editor-head input { min-width: 0; font-size: 16px; }
|
||||||
.editor-head select { max-width: 120px; font-size: 14px; }
|
.editor-head select { max-width: 120px; font-size: 14px; }
|
||||||
|
.editor-head-title, .editor-head-settings { padding: 4px 8px; }
|
||||||
.actionbar { flex-wrap: wrap; }
|
.actionbar { flex-wrap: wrap; }
|
||||||
.actionbar .btn { padding: 12px 22px; }
|
.actionbar .btn { padding: 12px 22px; }
|
||||||
.hint { font-size: 13px; }
|
.hint { font-size: 13px; }
|
||||||
|
|||||||
@@ -4,7 +4,10 @@
|
|||||||
<div class="pane-l-col">
|
<div class="pane-l-col">
|
||||||
<div class="float pane-l-head">
|
<div class="float pane-l-head">
|
||||||
<div class="editor-head">
|
<div class="editor-head">
|
||||||
|
<div class="editor-head-title">
|
||||||
<input id="title" placeholder="Title">
|
<input id="title" placeholder="Title">
|
||||||
|
</div>
|
||||||
|
<div class="editor-head-settings">
|
||||||
<select id="language">
|
<select id="language">
|
||||||
<option value="">auto</option>
|
<option value="">auto</option>
|
||||||
<option>go</option><option>python</option><option>javascript</option><option>typescript</option>
|
<option>go</option><option>python</option><option>javascript</option><option>typescript</option>
|
||||||
@@ -19,6 +22,7 @@
|
|||||||
<button type="button" class="btn btn-icon wrap-toggle" id="wrap-toggle" title="Toggle line wrap" aria-pressed="false">wrap</button>
|
<button type="button" class="btn btn-icon wrap-toggle" id="wrap-toggle" title="Toggle line wrap" aria-pressed="false">wrap</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div class="float editor-wrap">
|
<div class="float editor-wrap">
|
||||||
<div class="gutter" id="gutter">1</div>
|
<div class="gutter" id="gutter">1</div>
|
||||||
<textarea class="editor" id="content" placeholder="Paste your code, text, or notes here…" spellcheck="false"></textarea>
|
<textarea class="editor" id="content" placeholder="Paste your code, text, or notes here…" spellcheck="false"></textarea>
|
||||||
|
|||||||
Reference in New Issue
Block a user