mirror of
https://github.com/mozilla/pdf.js.git
synced 2026-08-01 20:07:22 +02:00
b4d028132b
The chrome is now authored against Firefox design-token names with the shipped value as a fallback `var(--fx-token, <literal>)` so colors, borders and radii follow Firefox instead of having to be re-synced by hand. In MOZCENTRAL viewer.css imports chrome://global/skin/design-system/tokens-brand.css, gated on the new pdfjs.enableNova pref (default false, read straight from CSS via -moz-pref()). With the pref off the sheet isn't applied, every fallback resolves, and the viewer renders as before, as it also does in the GENERIC and components builds, which never see the chrome sheet. Consuming a token means never declaring its name in an unlayered rule, which would shadow Firefox's for the whole subtree; --focus-outline, --border-color and --text-color/--button-border-color are therefore renamed to --editor-selection-outline, --signature-border-color and --views-*. In forced colors each state reads a matching background/foreground/border triple so it can't collapse to a single system color. The dialog button styling also moves out of `.dialog .mainContainer button` into a shared .primaryButton/.secondaryButton primitive (buttons.css, imported from pdf_viewer.css so the components build gets it too). The password, document-properties, print and undo-bar buttons use it in place of .dialogButton, and the custom radio appearance gives way to native controls tinted with accent-color.
751 lines
20 KiB
CSS
751 lines
20 KiB
CSS
/* Copyright 2022 Mozilla Foundation
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
:root {
|
|
--clear-signature-button-icon: url(images/editor-toolbar-delete.svg);
|
|
/* The signature wells are boxes nested in the dialog, i.e. Firefox's
|
|
.info-box-container pattern. */
|
|
--signature-bg: var(
|
|
--background-color-box-info,
|
|
light-dark(#f9f9fb, #2b2a33)
|
|
);
|
|
--signature-hover-bg: var(
|
|
--button-background-color-hover,
|
|
light-dark(#f0f0f4, var(--signature-bg))
|
|
);
|
|
--button-signature-bg: transparent;
|
|
--button-signature-color: var(--main-color);
|
|
--button-signature-active-bg: light-dark(#cfcfd8, #5b5b66);
|
|
--button-signature-active-border: none;
|
|
--button-signature-active-color: var(--button-signature-color);
|
|
--button-signature-border: none;
|
|
--button-signature-hover-bg: light-dark(#e0e0e6, #52525e);
|
|
--button-signature-hover-color: var(--button-signature-color);
|
|
|
|
@media screen and (forced-colors: active) {
|
|
--signature-bg: HighlightText;
|
|
--signature-hover-bg: var(--signature-bg);
|
|
--button-signature-bg: HighlightText;
|
|
--button-signature-color: ButtonText;
|
|
--button-signature-active-bg: ButtonText;
|
|
--button-signature-active-color: HighlightText;
|
|
--button-signature-border: 1px solid ButtonText;
|
|
--button-signature-hover-bg: Highlight;
|
|
--button-signature-hover-color: HighlightText;
|
|
}
|
|
}
|
|
|
|
.signatureDialog {
|
|
--primary-color: var(--text-primary-color);
|
|
--signature-border-color: var(--border-color-interactive, #8f8f9d);
|
|
--open-link-fg: var(--link-fg-color);
|
|
--open-link-hover-fg: var(--link-hover-fg-color);
|
|
|
|
@media screen and (forced-colors: active) {
|
|
--primary-color: ButtonText;
|
|
--signature-border-color: var(--border-color-interactive, ButtonText);
|
|
--open-link-fg: ButtonText;
|
|
--open-link-hover-fg: ButtonText;
|
|
}
|
|
|
|
width: 570px;
|
|
max-width: 100%;
|
|
min-width: 300px;
|
|
padding: 16px 0;
|
|
|
|
.mainContainer {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 12px;
|
|
|
|
span:not([role="sectionhead"]) {
|
|
font-size: 13px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: normal;
|
|
}
|
|
|
|
.title {
|
|
margin-inline-start: 16px;
|
|
}
|
|
}
|
|
|
|
.inputWithClearButton {
|
|
--button-dimension: 24px;
|
|
--clear-button-icon: url(images/messageBar_closingButton.svg);
|
|
|
|
width: 100%;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
> input {
|
|
width: 100%;
|
|
height: var(--size-item-large, 32px);
|
|
padding-inline: 8px calc(4px + var(--button-dimension));
|
|
box-sizing: border-box;
|
|
border-radius: var(--border-radius-small, 4px);
|
|
border: 1px solid var(--signature-border-color);
|
|
}
|
|
|
|
.clearInputButton {
|
|
position: absolute;
|
|
inset-block-start: 4px;
|
|
inset-inline-end: 4px;
|
|
display: inline-block;
|
|
width: var(--button-dimension);
|
|
height: var(--button-dimension);
|
|
background-color: var(--input-text-fg-color);
|
|
mask-size: cover;
|
|
mask-image: var(--clear-button-icon);
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
#addSignatureDialog {
|
|
--secondary-color: var(--text-secondary-color);
|
|
--bg-hover: var(
|
|
--button-background-color-hover,
|
|
light-dark(#e0e0e6, #52525e)
|
|
);
|
|
--tab-top-line-active-color: var(
|
|
--color-accent-primary,
|
|
light-dark(#0060df, #0df)
|
|
);
|
|
--tab-top-line-active-hover-color: var(--tab-text-hover-color);
|
|
--tab-top-line-hover-color: var(--border-color-interactive, #8f8f9d);
|
|
--tab-top-line-inactive-color: light-dark(#cfcfd8, #8f8f9d);
|
|
--tab-bottom-line-active-color: var(--tab-top-line-inactive-color);
|
|
--tab-bottom-line-hover-color: var(--tab-top-line-inactive-color);
|
|
--tab-bottom-line-inactive-color: var(--tab-top-line-inactive-color);
|
|
--tab-bg: var(--dialog-bg-color);
|
|
--tab-bg-active-color: var(--tab-bg);
|
|
--tab-bg-active-hover-color: var(--bg-hover);
|
|
--tab-bg-hover: var(--bg-hover);
|
|
--tab-panel-border: none;
|
|
--tab-panel-border-radius: var(--border-radius-small, 4px);
|
|
--tab-text-color: var(--primary-color);
|
|
--tab-text-active-color: var(--tab-top-line-active-color);
|
|
--tab-text-active-hover-color: var(--tab-text-hover-color);
|
|
--tab-text-hover-color: var(--tab-text-color);
|
|
--signature-placeholder-color: var(--secondary-color);
|
|
--signature-draw-placeholder-color: var(--primary-color);
|
|
--signature-color: var(--primary-color);
|
|
--save-warning-color: var(--secondary-color);
|
|
--thickness-bg: var(--dialog-bg-color);
|
|
--thickness-label-color: var(--primary-color);
|
|
--thickness-slider-color: var(--primary-color);
|
|
--thickness-border: none;
|
|
--draw-cursor: url(images/cursor-editorInk.svg) 0 16, pointer;
|
|
|
|
@media screen and (forced-colors: active) {
|
|
--secondary-color: ButtonText;
|
|
--bg: HighlightText;
|
|
--bg-hover: var(--bg);
|
|
--tab-top-line-active-color: var(--color-accent-primary, ButtonText);
|
|
--tab-top-line-active-hover-color: HighlightText;
|
|
--tab-top-line-hover-color: var(--border-color-interactive, SelectedItem);
|
|
--tab-top-line-inactive-color: ButtonText;
|
|
--tab-bottom-line-active-color: var(--tab-top-line-active-color);
|
|
--tab-bottom-line-hover-color: var(--tab-top-line-hover-color);
|
|
--tab-bg: var(--bg);
|
|
--tab-bg-active-color: SelectedItem;
|
|
--tab-bg-active-hover-color: SelectedItem;
|
|
--tab-panel-border: 1px solid ButtonText;
|
|
--tab-panel-border-radius: 8px;
|
|
--tab-text-color: ButtonText;
|
|
--tab-text-active-color: HighlightText;
|
|
--tab-text-active-hover-color: HighlightText;
|
|
--tab-text-hover-color: SelectedItem;
|
|
--signature-color: ButtonText;
|
|
--thickness-bg: Canvas;
|
|
--thickness-label-color: CanvasText;
|
|
--thickness-slider-color: ButtonText;
|
|
--thickness-border: 1px solid var(--signature-border-color);
|
|
}
|
|
|
|
#addSignatureDialogLabel {
|
|
overflow: hidden;
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
|
|
&.waiting::after {
|
|
content: "";
|
|
cursor: wait;
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.mainContainer {
|
|
[role="tablist"] {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 0;
|
|
|
|
> [role="tab"] {
|
|
flex: 1 0 0;
|
|
align-self: stretch;
|
|
background-color: var(--tab-bg);
|
|
padding-inline: 0;
|
|
cursor: default;
|
|
|
|
border-inline: 0;
|
|
border-block-width: 1px;
|
|
border-block-style: solid;
|
|
border-block-start-color: var(--tab-top-line-inactive-color);
|
|
border-block-end-color: var(--tab-bottom-line-inactive-color);
|
|
border-radius: 0;
|
|
|
|
font: menu;
|
|
font-size: 13px;
|
|
font-style: normal;
|
|
line-height: normal;
|
|
font-weight: 400;
|
|
color: var(--tab-text-color);
|
|
|
|
&:hover {
|
|
border-block-start-width: 2px;
|
|
border-block-start-color: var(--tab-top-line-hover-color);
|
|
border-block-end-color: var(--tab-bottom-line-hover-color);
|
|
background-color: var(--tab-bg-hover);
|
|
color: var(--tab-text-hover-color);
|
|
}
|
|
|
|
&:focus-visible {
|
|
outline: 2px solid var(--tab-top-line-active-color);
|
|
outline-offset: -2px;
|
|
}
|
|
|
|
&[aria-selected="true"] {
|
|
border-block-start-width: 2px;
|
|
border-block-start-color: var(--tab-top-line-active-color);
|
|
border-block-end-color: var(--tab-bottom-line-active-color);
|
|
background-color: var(--tab-bg-active-color);
|
|
font-weight: 590;
|
|
color: var(--tab-text-active-color);
|
|
|
|
&:hover {
|
|
border-block-start-color: var(--tab-top-line-active-hover-color);
|
|
background-color: var(--tab-bg-active-hover-color);
|
|
color: var(--tab-text-active-hover-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#addSignatureActionContainer {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-end;
|
|
align-self: stretch;
|
|
gap: 12px;
|
|
padding-inline: 16px;
|
|
box-sizing: border-box;
|
|
|
|
> [role="tabpanel"] {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 220px;
|
|
background-color: var(--signature-bg);
|
|
border: var(--tab-panel-border);
|
|
border-radius: var(--tab-panel-border-radius);
|
|
|
|
> svg {
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: transparent;
|
|
}
|
|
|
|
&#addSignatureTypeContainer {
|
|
display: none;
|
|
|
|
#addSignatureTypeInput {
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
border: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
color: var(--signature-color);
|
|
background-color: transparent;
|
|
border-radius: var(--tab-panel-border-radius);
|
|
|
|
font-family:
|
|
"Brush script", "Apple Chancery", "Segoe script",
|
|
"Freestyle Script", "Palace Script MT", "Brush Script MT", TK,
|
|
cursive, serif;
|
|
font-size: 44px;
|
|
font-style: italic;
|
|
font-weight: 400;
|
|
|
|
&::placeholder {
|
|
color: var(--signature-placeholder-color);
|
|
text-align: center;
|
|
|
|
font: menu;
|
|
font-style: normal;
|
|
font-weight: 274;
|
|
font-size: 44px;
|
|
line-height: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
&#addSignatureDrawContainer {
|
|
display: none;
|
|
|
|
> span {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
display: grid;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
background-color: transparent;
|
|
color: var(--signature-placeholder-color);
|
|
user-select: none;
|
|
}
|
|
|
|
> svg {
|
|
stroke: var(--signature-color);
|
|
fill: none;
|
|
stroke-opacity: 1;
|
|
stroke-linecap: round;
|
|
stroke-linejoin: round;
|
|
stroke-miterlimit: 10;
|
|
|
|
&:hover {
|
|
cursor: var(--draw-cursor);
|
|
}
|
|
}
|
|
|
|
#thickness {
|
|
position: absolute;
|
|
width: 100%;
|
|
inset-block-end: 0;
|
|
display: grid;
|
|
align-items: center;
|
|
justify-content: center;
|
|
pointer-events: none;
|
|
|
|
> span {
|
|
color: var(--signature-draw-placeholder-color);
|
|
}
|
|
|
|
> div {
|
|
width: auto;
|
|
height: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 8px;
|
|
padding: 6px 8px 7px;
|
|
margin: 0;
|
|
background-color: var(--thickness-bg);
|
|
border-radius: 4px 4px 0 0;
|
|
border-inline: var(--thickness-border);
|
|
border-top: var(--thickness-border);
|
|
pointer-events: auto;
|
|
|
|
/* Move the div in order to cover to bottom border of the area. */
|
|
position: relative;
|
|
top: 1px;
|
|
|
|
> label {
|
|
color: var(--thickness-label-color);
|
|
}
|
|
|
|
> input {
|
|
width: 100px;
|
|
height: 14px;
|
|
background-color: transparent;
|
|
|
|
/*#if !MOZCENTRAL*/
|
|
&::-webkit-slider-runnable-track,
|
|
/*#endif*/
|
|
&::-moz-range-track,
|
|
&::-moz-range-progress {
|
|
background-color: var(--thickness-slider-color);
|
|
}
|
|
|
|
/*#if !MOZCENTRAL*/
|
|
&::-webkit-slider-thumb,
|
|
/*#endif*/
|
|
&::-moz-range-thumb {
|
|
background-color: var(--thickness-bg);
|
|
}
|
|
|
|
border-radius: 4.5px;
|
|
border: 0;
|
|
color: var(--signature-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&#addSignatureImageContainer {
|
|
display: none;
|
|
|
|
> svg {
|
|
stroke: none;
|
|
stroke-width: 0;
|
|
fill: var(--signature-color);
|
|
fill-opacity: 1;
|
|
}
|
|
|
|
#addSignatureImagePlaceholder {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: transparent;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
span {
|
|
color: var(--signature-placeholder-color);
|
|
}
|
|
|
|
a {
|
|
color: var(--open-link-fg);
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
|
|
&:hover {
|
|
color: var(--open-link-hover-fg);
|
|
}
|
|
}
|
|
}
|
|
|
|
#addSignatureFilePicker {
|
|
visibility: hidden;
|
|
position: relative;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
&[data-selected="type"] > #addSignatureTypeContainer,
|
|
&[data-selected="draw"] > #addSignatureDrawContainer,
|
|
&[data-selected="image"] > #addSignatureImageContainer {
|
|
display: block;
|
|
}
|
|
|
|
#addSignatureControls {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: flex-start;
|
|
gap: 12px;
|
|
align-self: stretch;
|
|
|
|
#horizontalContainer {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
gap: 16px;
|
|
align-self: stretch;
|
|
|
|
#addSignatureDescriptionContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 4px;
|
|
flex: 1 0 0;
|
|
|
|
&:has(input:disabled) > label {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
> label {
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
#clearSignatureButton {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
> span {
|
|
display: flex;
|
|
height: 24px;
|
|
align-items: center;
|
|
gap: 4px;
|
|
flex-shrink: 0;
|
|
|
|
&::after {
|
|
content: "";
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
mask-image: var(--clear-signature-button-icon);
|
|
mask-size: cover;
|
|
background-color: currentColor;
|
|
flex-shrink: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#addSignatureSaveContainer {
|
|
display: grid;
|
|
grid-template-columns: max-content auto;
|
|
gap: 4px;
|
|
width: 100%;
|
|
|
|
> input {
|
|
margin: 0;
|
|
|
|
&:disabled + label {
|
|
opacity: 0.4;
|
|
}
|
|
}
|
|
|
|
> label {
|
|
user-select: none;
|
|
}
|
|
|
|
&:not(.fullStorage) #addSignatureSaveWarning {
|
|
display: none;
|
|
}
|
|
|
|
&.fullStorage #addSignatureSaveWarning {
|
|
display: block;
|
|
opacity: 1;
|
|
color: var(--save-warning-color);
|
|
font-size: 11px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#editSignatureDescriptionDialog {
|
|
.mainContainer {
|
|
padding-inline: 16px;
|
|
box-sizing: border-box;
|
|
|
|
.title {
|
|
margin-inline-start: 0;
|
|
}
|
|
|
|
#editSignatureDescriptionAndView {
|
|
width: auto;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: flex-start;
|
|
gap: 12px;
|
|
align-self: stretch;
|
|
|
|
#editSignatureDescriptionContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 4px;
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
> svg {
|
|
width: 210px;
|
|
height: 180px;
|
|
padding: 8px;
|
|
background-color: var(--signature-bg);
|
|
|
|
> path {
|
|
stroke: var(--button-signature-color);
|
|
stroke-width: 1px;
|
|
stroke-linecap: round;
|
|
stroke-linejoin: round;
|
|
stroke-miterlimit: 10;
|
|
vector-effect: non-scaling-stroke;
|
|
fill: none;
|
|
|
|
&.contours {
|
|
fill: var(--button-signature-color);
|
|
stroke-width: 0.5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
#editorSignatureParamsToolbar {
|
|
padding: 8px;
|
|
|
|
#addSignatureDoorHanger {
|
|
gap: 8px;
|
|
padding: 2px;
|
|
|
|
.toolbarAddSignatureButtonContainer {
|
|
height: 32px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
align-self: stretch;
|
|
gap: 8px;
|
|
|
|
button {
|
|
border: var(--button-signature-border);
|
|
border-radius: 4px;
|
|
background-color: var(--button-signature-bg);
|
|
color: var(--button-signature-color);
|
|
|
|
&:hover {
|
|
background-color: var(--button-signature-hover-bg);
|
|
}
|
|
|
|
&:active {
|
|
border: var(--button-signature-active-border);
|
|
background-color: var(--button-signature-active-bg);
|
|
color: var(--button-signature-active-color);
|
|
|
|
&::before {
|
|
background-color: var(--button-signature-active-color);
|
|
}
|
|
}
|
|
|
|
&:focus-visible {
|
|
outline: var(--focus-ring-outline);
|
|
|
|
&::before {
|
|
background-color: var(--button-signature-color);
|
|
}
|
|
}
|
|
}
|
|
|
|
.deleteButton {
|
|
&::before {
|
|
mask-image: var(--clear-signature-button-icon);
|
|
}
|
|
}
|
|
|
|
.toolbarAddSignatureButton {
|
|
width: calc(0.8 * var(--editor-toolbar-min-width));
|
|
height: 100%;
|
|
min-height: var(--menuitem-height);
|
|
aspect-ratio: unset;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
outline: none;
|
|
border-radius: 4px;
|
|
box-sizing: border-box;
|
|
font: message-box;
|
|
position: relative;
|
|
flex: 1 1 auto;
|
|
padding: 0;
|
|
gap: 8px;
|
|
text-align: start;
|
|
white-space: normal;
|
|
cursor: default;
|
|
overflow: hidden;
|
|
|
|
> svg {
|
|
display: inline-block;
|
|
height: 100%;
|
|
aspect-ratio: 1;
|
|
background-color: var(--signature-bg);
|
|
flex: none;
|
|
padding: 4px;
|
|
box-sizing: border-box;
|
|
border: none;
|
|
border-radius: 4px;
|
|
|
|
> path {
|
|
stroke: var(--button-signature-color);
|
|
stroke-width: 1px;
|
|
stroke-linecap: round;
|
|
stroke-linejoin: round;
|
|
stroke-miterlimit: 10;
|
|
vector-effect: non-scaling-stroke;
|
|
fill: none;
|
|
|
|
&.contours {
|
|
fill: var(--button-signature-color);
|
|
stroke-width: 0.5px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&:is(:hover, :active) > svg {
|
|
border-radius: 4px 0 0 4px;
|
|
background-color: var(--signature-hover-bg);
|
|
}
|
|
|
|
&:hover {
|
|
> span {
|
|
color: var(--button-signature-hover-color);
|
|
}
|
|
}
|
|
|
|
&:active {
|
|
background-color: var(--button-signature-active-bg);
|
|
}
|
|
|
|
&:is([disabled="disabled"], [disabled]) {
|
|
opacity: 0.5;
|
|
pointer-events: none;
|
|
}
|
|
|
|
> span {
|
|
height: auto;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
flex: 1 1 auto;
|
|
font: menu;
|
|
font-size: 13px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: normal;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.editDescription.altText {
|
|
--alt-text-add-image: url(images/editor-toolbar-edit.svg) !important;
|
|
|
|
&::before {
|
|
width: 16px !important;
|
|
height: 16px !important;
|
|
}
|
|
}
|