mediawiki-extensions-WikiEd.../modules/realtimepreview/ResizingDragBar.less
MusikAnimal 178a731b6e ResizingDragBar: force CodeMirror to have 100% height
The ResizingDragBar makes the editor resizable, so we need to set the
CodeMirror height to 100%. Previous attempts to fix this at
Ib49d1d9e71 and I4deeda192b suffered from race conditions based on
which modules loaded first. We can avoid this by simply putting the CSS
rule here in WikiEditor.

Bug: T357794
Follow-Up: I4deeda192bdc233101ba61739a636f8fd143c1de
Change-Id: Ia5e9767e0814eac29d58bc0d9c1023344a29dd84
2024-03-07 16:38:45 -05:00

55 lines
1.6 KiB
Plaintext

@import 'mediawiki.skin.variables.less';
// TODO: Replace static color values as soon as a drag bar and its design tokens
// have been defined in Codex.
// The dimensions of the UI affordance (the little line in the draggable area).
@affordance-width: 4px;
@affordance-length: 52px;
@background-color-wikieditor-resizing-dragbar: #eaecf0;
@background-color-wikieditor-resizing-dragbar-ew: #f8f9fa;
@background-color-wikieditor-resizing-dragbar-drag: #c8ccd1;
@background-color-wikieditor-resizing-dragbar-drag--hover: #54595d;
.ext-WikiEditor-ResizingDragBar {
background-color: @background-color-wikieditor-resizing-dragbar;
display: flex;
align-items: center;
justify-content: center;
}
.ext-WikiEditor-ResizingDragBar-ns {
cursor: ns-resize;
}
.ext-WikiEditor-ResizingDragBar-ew {
cursor: ew-resize;
background-color: @background-color-wikieditor-resizing-dragbar-ew;
}
.ext-WikiEditor-ResizingDragBar span {
width: @affordance-length;
height: @affordance-width;
background-color: @background-color-wikieditor-resizing-dragbar-drag;
border-radius: @border-radius-base;
display: block;
margin: 2px;
}
.ext-WikiEditor-ResizingDragBar:hover span {
background-color: @background-color-wikieditor-resizing-dragbar-drag--hover;
}
.ext-WikiEditor-ResizingDragBar-ew span {
height: @affordance-length;
width: @affordance-width;
border-width: 0 @border-width-base;
}
// This is needed to make the CodeMirror editor height constrained to .wikiEditor-ui-text
// This only is needed when the ResizingDragBar is enabled.
.cm-editor {
// stylelint-disable-next-line declaration-no-important
height: 100% !important;
}