mediawiki-extensions-WikiEd.../modules/realtimepreview/RealtimePreview.less
Ed Sanders 7837e3952c Fix overlap between preview button and edit switcher
These buttons can appear in any order depending on when
the code loads. Remove the default OOUI button negative
margin.

Replace group padding with margin now there is no negative
margin on the buttons.

Change-Id: Id2ebf7aa0b27da1d03d56f59e8a9a96f7656106d
2024-03-12 11:18:50 -07:00

80 lines
1.6 KiB
Plaintext

@import 'mediawiki.skin.variables.less';
.ext-WikiEditor-realtimepreview-button {
&:hover {
background-color: @background-color-interactive;
}
&.oo-ui-toggleWidget-on .oo-ui-labelElement-label {
color: @color-progressive;
}
&.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement:first-child {
margin-left: 0;
}
}
/* stylelint-disable selector-max-id */
.ext-WikiEditor-realtimepreview-textbox#wpTextbox1,
.mw-editform .ext-WikiEditor-realtimepreview-textbox#wpTextbox1 {
resize: none;
height: 100%;
min-height: auto;
max-height: none;
}
.ext-WikiEditor-realtimepreview-preview {
padding: 0 6px;
position: relative;
}
.wikiEditor-ui .wikiEditor-ui-view {
border-bottom: 0;
}
.ext-WikiEditor-ResizingDragBar-ns {
border-top: @border-width-base @border-style-base @border-color-subtle;
}
@width-loading-bar: 20%;
.ext-WikiEditor-realtimepreview-loadingbar div {
position: absolute;
z-index: 5;
display: block;
opacity: 1;
content: ' ';
background-color: @background-color-progressive;
width: @width-loading-bar;
height: 4px;
// Hide the loading bar to start with; it'll be shown if the loading state persists for more than 1s.
visibility: hidden;
animation: loading-bar 1.5s 1s infinite linear alternate;
}
@keyframes loading-bar {
0% {
visibility: visible;
left: 0;
}
100% {
left: calc( 100% - @width-loading-bar );
}
}
.ext-WikiEditor-twopanes-pane2 {
.ext-WikiEditor-reloadButton {
opacity: 0;
transition: opacity 100ms;
position: absolute;
top: 8px;
right: 15px;
z-index: 5;
}
&:hover .ext-WikiEditor-reloadButton {
opacity: 1;
}
}