feat: add profile language preferences and refine toast, dropdown and history UI
This commit is contained in:
Mateusz Gruszczyński
+483
-74
@@ -99,6 +99,7 @@
|
||||
--link-hover: #c3bbff;
|
||||
--caret: #9b89ff;
|
||||
--owner-fallback: #8b7af4;
|
||||
--info: #6fa8ff;
|
||||
--warning: #e3a94d;
|
||||
--warning-muted: #d6a84b;
|
||||
--danger: #ff7b91;
|
||||
@@ -244,6 +245,7 @@
|
||||
--link-hover: #4c3f8b;
|
||||
--caret: #6859b5;
|
||||
--owner-fallback: #7060c1;
|
||||
--info: #3568b8;
|
||||
--warning: #9a6816;
|
||||
--warning-muted: #7e5d1d;
|
||||
--danger: #9b3443;
|
||||
@@ -749,14 +751,13 @@ textarea:focus {
|
||||
.editor-layout {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 0;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
height: calc(100vh - 70px);
|
||||
overflow: hidden;
|
||||
transition: grid-template-columns .18s ease;
|
||||
}
|
||||
|
||||
.history-open .editor-layout {
|
||||
grid-template-columns: minmax(0, 1fr) 340px;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.editor-panel {
|
||||
@@ -1080,17 +1081,33 @@ textarea::selection {
|
||||
}
|
||||
|
||||
.history-panel {
|
||||
position: relative;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 24;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
width: 340px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
border-left: 1px solid var(--border);
|
||||
background: var(--surface-panel);
|
||||
transform: translateX(100%);
|
||||
transition: transform .18s ease;
|
||||
box-shadow: -18px 0 42px transparent;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translateX(calc(100% + 12px));
|
||||
pointer-events: none;
|
||||
transition: transform .18s ease, opacity .14s ease, box-shadow .18s ease, visibility 0s linear .18s;
|
||||
}
|
||||
|
||||
.history-panel.open {
|
||||
box-shadow: -18px 0 42px var(--shadow-28);
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateX(0);
|
||||
pointer-events: auto;
|
||||
transition-delay: 0s;
|
||||
}
|
||||
|
||||
.history-header {
|
||||
@@ -1115,7 +1132,8 @@ textarea::selection {
|
||||
|
||||
.history-list {
|
||||
overflow: auto;
|
||||
height: calc(100vh - 185px);
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
padding: 10px 18px 24px;
|
||||
}
|
||||
|
||||
@@ -1216,26 +1234,258 @@ dialog::backdrop {
|
||||
font-size: .78rem;
|
||||
}
|
||||
|
||||
.toast {
|
||||
.toast-region {
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
z-index: 20;
|
||||
padding: 11px 14px;
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: 10px;
|
||||
background: var(--surface-floating);
|
||||
color: var(--text-bright);
|
||||
font-size: .8rem;
|
||||
opacity: 0;
|
||||
transform: translateY(8px);
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
width: min(390px, calc(100vw - 32px));
|
||||
max-height: min(720px, calc(100dvh - 40px));
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
pointer-events: none;
|
||||
transition: .16s ease;
|
||||
}
|
||||
|
||||
.toast.visible {
|
||||
.toast-card {
|
||||
--toast-tone: var(--info);
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 28px;
|
||||
gap: 10px;
|
||||
align-items: start;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 12px 10px 13px 12px;
|
||||
border: 1px solid color-mix(in srgb, var(--toast-tone) 28%, var(--border));
|
||||
border-radius: 13px;
|
||||
background: color-mix(in srgb, var(--surface-floating) 96%, var(--toast-tone) 4%);
|
||||
box-shadow: 0 16px 42px rgba(0, 0, 0, .22), 0 2px 8px rgba(0, 0, 0, .12);
|
||||
color: var(--text-bright);
|
||||
opacity: 0;
|
||||
transform: translateY(10px) scale(.985);
|
||||
pointer-events: auto;
|
||||
transition: opacity .16s ease, transform .16s ease, border-color .16s ease, background .16s ease;
|
||||
backdrop-filter: blur(14px);
|
||||
}
|
||||
|
||||
.toast-region--modal {
|
||||
/* A manual popover enters the browser top layer above the active dialog.
|
||||
Reset popover defaults while keeping the regular toast viewport geometry. */
|
||||
top: auto;
|
||||
left: auto;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
overflow: visible;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.app-dialog.has-modal-toast-region {
|
||||
/* Fallback for browsers without the Popover API. */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.toast-card.is-visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
transform: translateY(0) scale(1);
|
||||
}
|
||||
|
||||
.toast-card.is-leaving {
|
||||
opacity: 0;
|
||||
transform: translateY(6px) scale(.985);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.toast-card--info {
|
||||
--toast-tone: var(--info);
|
||||
}
|
||||
|
||||
.toast-card--success {
|
||||
--toast-tone: var(--success);
|
||||
}
|
||||
|
||||
.toast-card--warning {
|
||||
--toast-tone: var(--warning);
|
||||
}
|
||||
|
||||
.toast-card--danger {
|
||||
--toast-tone: var(--danger);
|
||||
}
|
||||
|
||||
.toast-card__close svg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
fill: none;
|
||||
stroke: currentColor;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
stroke-width: 1.8;
|
||||
}
|
||||
|
||||
.toast-card__content {
|
||||
min-width: 0;
|
||||
padding-top: 1px;
|
||||
}
|
||||
|
||||
.toast-card__title {
|
||||
display: block;
|
||||
margin: 0 0 3px;
|
||||
color: var(--text-max);
|
||||
font-size: .8rem;
|
||||
font-weight: 700;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.toast-card__message {
|
||||
margin: 0;
|
||||
color: var(--text-tertiary);
|
||||
font-size: .74rem;
|
||||
line-height: 1.42;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.toast-card__close {
|
||||
display: grid;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
margin: -2px -2px 0 0;
|
||||
padding: 0;
|
||||
place-items: center;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
color: var(--muted-2);
|
||||
cursor: pointer;
|
||||
transition: background .14s ease, color .14s ease;
|
||||
}
|
||||
|
||||
.toast-card__close:hover {
|
||||
background: color-mix(in srgb, var(--toast-tone) 10%, var(--surface-hover));
|
||||
color: var(--text-max);
|
||||
}
|
||||
|
||||
.toast-card__close:focus-visible {
|
||||
outline: 2px solid color-mix(in srgb, var(--toast-tone) 62%, transparent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.toast-card__close[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.toast-card__timer {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 3px;
|
||||
overflow: hidden;
|
||||
background: color-mix(in srgb, var(--toast-tone) 12%, transparent);
|
||||
}
|
||||
|
||||
.toast-card__timer[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.toast-card__timer>span {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--toast-tone);
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
@keyframes toast-countdown {
|
||||
from { transform: scaleX(1); }
|
||||
to { transform: scaleX(0); }
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.toast-region {
|
||||
right: 10px;
|
||||
bottom: calc(10px + env(safe-area-inset-bottom, 0px));
|
||||
left: auto;
|
||||
width: min(300px, calc(100vw - 20px));
|
||||
max-height: calc(100dvh - 20px);
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.toast-card {
|
||||
grid-template-columns: minmax(0, 1fr) 24px;
|
||||
gap: 7px;
|
||||
padding: 9px 8px 10px 9px;
|
||||
border-radius: 11px;
|
||||
box-shadow: 0 10px 28px rgba(0, 0, 0, .2), 0 2px 6px rgba(0, 0, 0, .1);
|
||||
backdrop-filter: blur(11px);
|
||||
}
|
||||
|
||||
.toast-card__close svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.toast-card__title {
|
||||
margin-bottom: 2px;
|
||||
font-size: .74rem;
|
||||
}
|
||||
|
||||
.toast-card__message {
|
||||
font-size: .68rem;
|
||||
line-height: 1.34;
|
||||
}
|
||||
|
||||
.toast-card__close {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: -1px -1px 0 0;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.toast-card__timer {
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
.toast-card--upload {
|
||||
grid-template-columns: minmax(0, 1fr) 24px;
|
||||
}
|
||||
|
||||
.toast-card--upload .toast-card__content {
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.upload-toast__filename,
|
||||
.upload-toast__error {
|
||||
font-size: .67rem;
|
||||
}
|
||||
|
||||
.upload-toast__progress {
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
.upload-toast__meta {
|
||||
gap: 8px;
|
||||
font-size: .63rem;
|
||||
}
|
||||
|
||||
.upload-toast__actions {
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.upload-toast__actions button {
|
||||
min-height: 27px;
|
||||
padding: 0 8px;
|
||||
border-radius: 7px;
|
||||
font-size: .67rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.toast-card {
|
||||
transition-duration: .01ms;
|
||||
}
|
||||
}
|
||||
|
||||
.error-page {
|
||||
@@ -3635,6 +3885,7 @@ dialog::backdrop {
|
||||
}
|
||||
|
||||
#profile-dialog .profile-theme-field,
|
||||
#profile-dialog .profile-language-field,
|
||||
#profile-dialog .profile-suggestion {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
@@ -3645,6 +3896,7 @@ dialog::backdrop {
|
||||
#profile-dialog .identity-fields > *,
|
||||
#profile-dialog .profile-actions,
|
||||
#profile-dialog .profile-theme-field,
|
||||
#profile-dialog .profile-language-field,
|
||||
#profile-dialog .theme-options,
|
||||
#profile-dialog .theme-option {
|
||||
min-width: 0;
|
||||
@@ -5440,6 +5692,196 @@ dialog::backdrop {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.profile-language-field {
|
||||
display: grid;
|
||||
gap: 7px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.profile-language-field > span:first-child {
|
||||
color: var(--text-label);
|
||||
font-size: .86rem;
|
||||
font-weight: 750;
|
||||
}
|
||||
|
||||
.profile-language-control {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 20px minmax(0, 1fr) 16px;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
min-height: 44px;
|
||||
padding: 0 12px;
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: 10px;
|
||||
background: var(--surface-2);
|
||||
box-shadow: inset 0 1px 0 var(--wash-soft);
|
||||
color: var(--muted);
|
||||
transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
|
||||
}
|
||||
|
||||
.profile-language-control:hover,
|
||||
.profile-language-control[data-open="true"] {
|
||||
border-color: var(--accent-border);
|
||||
background: var(--surface-3);
|
||||
}
|
||||
|
||||
.profile-language-control:focus-within {
|
||||
border-color: var(--focus);
|
||||
box-shadow: 0 0 0 3px var(--focus-ring), inset 0 1px 0 var(--wash-soft);
|
||||
}
|
||||
|
||||
.profile-language-control__icon,
|
||||
.profile-language-control__chevron {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
fill: none;
|
||||
stroke: currentColor;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
stroke-width: 1.7;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.profile-language-control__chevron {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
justify-self: end;
|
||||
transition: transform .16s ease;
|
||||
}
|
||||
|
||||
.profile-language-control[data-open="true"] .profile-language-control__chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.profile-language-trigger {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
min-height: 42px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
font: inherit;
|
||||
font-size: .82rem;
|
||||
font-weight: 700;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.profile-language-current {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.profile-language-menu {
|
||||
position: absolute;
|
||||
z-index: 60;
|
||||
top: calc(100% + 8px);
|
||||
left: -1px;
|
||||
right: -1px;
|
||||
display: grid;
|
||||
gap: 2px;
|
||||
max-height: min(260px, 42dvh);
|
||||
padding: 4px;
|
||||
overflow-y: auto;
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: 12px;
|
||||
background: var(--surface-floating);
|
||||
box-shadow: 0 16px 36px var(--shadow-38), inset 0 1px 0 var(--wash-soft);
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
.profile-language-menu[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.profile-language-option {
|
||||
display: grid;
|
||||
grid-template-columns: 20px minmax(0, 1fr);
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
height: 38px;
|
||||
min-height: 38px;
|
||||
padding: 0 9px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
color: var(--text);
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
transition: border-color .12s ease, background-color .12s ease, color .12s ease;
|
||||
}
|
||||
|
||||
.profile-language-option:hover,
|
||||
.profile-language-option:focus-visible {
|
||||
border-color: var(--border-strong);
|
||||
outline: 0;
|
||||
background: var(--surface-hover);
|
||||
}
|
||||
|
||||
.profile-language-option[aria-selected="true"] {
|
||||
border-color: var(--accent-a35);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
|
||||
.profile-language-option__check {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-radius: 5px;
|
||||
color: var(--accent-text);
|
||||
font-size: .76rem;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.profile-language-option[aria-selected="true"] .profile-language-option__check {
|
||||
background: var(--accent-a25);
|
||||
}
|
||||
|
||||
.profile-language-option__copy {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 6px;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.profile-language-option__copy strong,
|
||||
.profile-language-option__copy small {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.profile-language-option__copy strong {
|
||||
color: var(--text);
|
||||
flex: 0 1 auto;
|
||||
font-size: .8rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.profile-language-option__copy small {
|
||||
flex: 1 1 auto;
|
||||
color: var(--text-muted);
|
||||
font-size: .7rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.profile-language-field > small {
|
||||
color: var(--text-muted);
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.profile-theme-field {
|
||||
min-width: 0;
|
||||
margin: 0;
|
||||
@@ -6054,7 +6496,7 @@ dialog::backdrop {
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
|
||||
.pad-page .toast {
|
||||
.pad-page .toast-region {
|
||||
bottom: calc(62px + env(safe-area-inset-bottom, 0px));
|
||||
}
|
||||
}
|
||||
@@ -6639,40 +7081,23 @@ dialog::backdrop {
|
||||
}
|
||||
|
||||
/* Upload progress toast --------------------------------------------------- */
|
||||
.toast--interactive {
|
||||
width: min(420px, calc(100vw - 40px));
|
||||
box-sizing: border-box;
|
||||
.toast-card--upload {
|
||||
grid-template-columns: minmax(0, 1fr) 28px;
|
||||
}
|
||||
|
||||
.toast--interactive.visible {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.toast--upload {
|
||||
.toast-card--upload .toast-card__content {
|
||||
display: grid;
|
||||
gap: 9px;
|
||||
padding: 13px 14px;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.upload-toast__header,
|
||||
.upload-toast__heading {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.upload-toast__heading {
|
||||
display: grid;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.upload-toast__title {
|
||||
font-size: .82rem;
|
||||
line-height: 1.25;
|
||||
.toast-card--upload .toast-card__title {
|
||||
margin-bottom: -4px;
|
||||
}
|
||||
|
||||
.upload-toast__filename {
|
||||
overflow: hidden;
|
||||
color: var(--muted);
|
||||
font-size: .73rem;
|
||||
color: var(--text-tertiary);
|
||||
font-size: .72rem;
|
||||
line-height: 1.3;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@@ -6680,10 +7105,10 @@ dialog::backdrop {
|
||||
|
||||
.upload-toast__progress {
|
||||
position: relative;
|
||||
height: 7px;
|
||||
height: 6px;
|
||||
overflow: hidden;
|
||||
border-radius: 999px;
|
||||
background: var(--code-bg);
|
||||
background: color-mix(in srgb, var(--toast-tone) 12%, var(--surface-3));
|
||||
}
|
||||
|
||||
.upload-toast__progress>span {
|
||||
@@ -6691,12 +7116,12 @@ dialog::backdrop {
|
||||
width: 0;
|
||||
height: 100%;
|
||||
border-radius: inherit;
|
||||
background: var(--accent);
|
||||
background: var(--toast-tone);
|
||||
transition: width .14s linear;
|
||||
}
|
||||
|
||||
.upload-toast__progress.is-complete>span {
|
||||
background: var(--success, var(--success-fallback));
|
||||
background: var(--success);
|
||||
}
|
||||
|
||||
.upload-toast__progress.is-error>span {
|
||||
@@ -6708,17 +7133,9 @@ dialog::backdrop {
|
||||
}
|
||||
|
||||
@keyframes upload-toast-indeterminate {
|
||||
0% {
|
||||
transform: translateX(-120%);
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translateX(180%);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(420%);
|
||||
}
|
||||
0% { transform: translateX(-120%); }
|
||||
50% { transform: translateX(180%); }
|
||||
100% { transform: translateX(420%); }
|
||||
}
|
||||
|
||||
.upload-toast__meta {
|
||||
@@ -6728,7 +7145,7 @@ dialog::backdrop {
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
color: var(--muted-2);
|
||||
font-size: .7rem;
|
||||
font-size: .69rem;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
@@ -6743,9 +7160,9 @@ dialog::backdrop {
|
||||
}
|
||||
|
||||
.upload-toast__error {
|
||||
margin: 0;
|
||||
margin: -1px 0 0;
|
||||
color: var(--danger-soft);
|
||||
font-size: .73rem;
|
||||
font-size: .72rem;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@@ -6763,10 +7180,10 @@ dialog::backdrop {
|
||||
min-height: 30px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid var(--border-strong);
|
||||
border-radius: 7px;
|
||||
border-radius: 8px;
|
||||
background: var(--surface-2);
|
||||
color: var(--text);
|
||||
font-size: .72rem;
|
||||
font-size: .71rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -6778,14 +7195,6 @@ dialog::backdrop {
|
||||
border-color: color-mix(in srgb, var(--accent) 55%, var(--border-strong)) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.pad-page .toast--interactive {
|
||||
right: 10px;
|
||||
left: 10px;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* Optional links to exact editor lines. */
|
||||
.line-number-button {
|
||||
display: block;
|
||||
|
||||
Reference in New Issue
Block a user