body.custom-wizard { .d-editor-container { display: flex; flex-grow: 1; max-width: 100%; } .d-editor-overlay { position: absolute; background-color: black; opacity: 0.8; z-index: z("modal", "overlay"); } .d-editor-modals { position: absolute; z-index: z("modal", "content"); } .d-editor { display: flex; flex-grow: 1; min-height: 0; } .d-editor .d-editor-modal { min-width: 400px; position: absolute; background-color: var(--secondary); border: 1px solid var(--primary); padding: 1em; top: 25px; @media screen and (max-width: 424px) { min-width: 300px; } input { width: 95%; } h3 { margin-bottom: 0.5em; } } .wizard-field-composer .wmd-controls { position: relative; } .wizard-field-composer.show-preview .d-editor-textarea-column { display: none; } .d-editor-textarea-wrapper, .d-editor-preview-wrapper { background-color: var(--secondary); border: 1px solid var(--primary-medium); flex: 1; max-width: unset; } .d-editor-textarea-wrapper { display: flex; flex-direction: column; position: relative; textarea { background: transparent; } } .d-editor-preview-wrapper { display: flex; flex-direction: column; margin-left: 0; overflow: auto; cursor: default; margin-top: unset; padding-top: unset; } .d-editor-button-bar { display: flex; align-items: center; border-bottom: none; min-height: 30px; padding-left: 3px; border-bottom: 1px solid var(--primary-low); button { background-color: transparent; color: var(--primary); } .btn:not(.no-text) { font-size: 1.1487em; } .btn.bold { font-weight: bolder; } .btn.italic { font-style: italic; } .toolbar-popup-menu-options { display: none; } } .d-editor-spacer { width: 1px; height: 20px; margin: 0 5px; display: inline-block; } .d-editor-input, .d-editor-preview { box-sizing: border-box; flex: 1 1 100%; width: 100%; margin: 0; min-height: auto; word-wrap: break-word; -webkit-appearance: none; border-radius: 0; &:focus { box-shadow: none; border: 0; outline: 0; } } .d-editor-input { border: 0; padding: 10px; height: unset; // overrides core css overflow-x: hidden; resize: none; } .d-editor-preview { height: auto; padding: 10px; } .d-editor-plugin { display: flex; flex: 1 1; overflow: auto; } .composing-whisper .d-editor-preview { font-style: italic; color: var(--primary) !important; } .d-editor-preview > *:first-child { margin-top: 0; } .hide-preview .d-editor-preview-wrapper { display: none; flex: 0; } //// .d-editor { min-height: 200px; .d-editor-input { resize: vertical; flex: initial; } textarea { min-height: calc(200px - 32px); } } .d-editor-modal.hidden { display: none; } .d-editor-button-bar .btn { border: none; font-size: 0.9em; } .wizard-composer-upload { display: none; } .wizard-composer-hyperlink { display: flex; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(var(--primary-rgb), 0.8); } .wizard-composer-hyperlink-contents { background-color: var(--secondary); padding: 20px; h3 { margin-top: 0; } .composer-link-url, .composer-link-name { display: block; min-width: 450px; } } .hide-hyperlink-box, .add-link { display: inline; } #file-uploading { position: absolute; bottom: 1px; right: 1px; padding: 10px; background-color: var(--secondary); } .bottom-bar { display: flex; justify-content: space-between; margin-top: 20px; align-items: center; } // Markdown table styles for wizard composer preview .cooked, .d-editor-preview { a.mention { display: inline-block; // https://bugzilla.mozilla.org/show_bug.cgi?id=1656119 font-weight: bold; font-size: 0.93em; color: var(--primary-high-or-secondary-low); padding: 0 4px 1px; background: var(--primary-low); border-radius: 8px; } table { border-collapse: collapse; tr { border-bottom: 1px solid var(--primary-low); &.highlighted { animation: background-fade-highlight 2.5s ease-out; } } thead { th { text-align: left; padding: 0.5em; font-weight: bold; color: var(--primary); } } tbody { border-top: 3px solid var(--primary-low); } td { padding: 3px 3px 3px 0.5em; } } } }