mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-07 20:31:06 -05:00
Merge pull request #18066 from overleaf/ae-revert-toolbar
Revert "Avoid vertical border between editor switch and empty space" GitOrigin-RevId: eda4deba8eb384cddf2ea9c90edee080ceb6330c
This commit is contained in:
parent
a2d5e030c6
commit
e1ec856650
4 changed files with 22 additions and 11 deletions
|
@ -168,6 +168,8 @@ const Toolbar = memo(function Toolbar() {
|
||||||
/>
|
/>
|
||||||
</ToolbarOverflow>
|
</ToolbarOverflow>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
<div className="formatting-buttons-wrapper" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
|
|
|
@ -87,22 +87,26 @@ const toolbarTheme = EditorView.theme({
|
||||||
padding: '0 4px',
|
padding: '0 4px',
|
||||||
margin: '4px 0',
|
margin: '4px 0',
|
||||||
lineHeight: '1',
|
lineHeight: '1',
|
||||||
borderLeft: '1px solid rgba(125, 125, 125, 0.3)',
|
'&:not(:first-of-type)': {
|
||||||
'&.ol-cm-toolbar-end': {
|
borderLeft: '1px solid rgba(125, 125, 125, 0.3)',
|
||||||
borderLeft: 'none',
|
'&.ol-cm-toolbar-end': {
|
||||||
},
|
borderLeft: 'none',
|
||||||
'&.ol-cm-toolbar-stretch': {
|
},
|
||||||
flex: 1,
|
'&.ol-cm-toolbar-stretch': {
|
||||||
'.editor-toggle-switch + &': {
|
flex: 1,
|
||||||
borderLeft: 'none', // avoid a left border when no toolbar buttons are shown
|
},
|
||||||
|
'&.overflow-hidden': {
|
||||||
|
borderLeft: 'none',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
'&.overflow-hidden': {
|
'&.overflow-hidden': {
|
||||||
borderLeft: 'none',
|
|
||||||
width: 0,
|
width: 0,
|
||||||
padding: 0,
|
padding: 0,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
'.formatting-buttons-wrapper': {
|
||||||
|
flex: 1,
|
||||||
|
},
|
||||||
'.ol-cm-toolbar-button': {
|
'.ol-cm-toolbar-button': {
|
||||||
display: 'inline-flex',
|
display: 'inline-flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
|
|
|
@ -19,7 +19,8 @@ export const codemirrorDevTools = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const devToolsButton = ViewPlugin.define(view => {
|
const devToolsButton = ViewPlugin.define(view => {
|
||||||
const getContainer = () => document.querySelector('.ol-cm-toolbar-end')
|
const getContainer = () =>
|
||||||
|
document.querySelector('.formatting-buttons-wrapper')
|
||||||
|
|
||||||
const removeButton = () => {
|
const removeButton = () => {
|
||||||
getContainer()?.querySelector('#cm6-dev-tools-button')?.remove()
|
getContainer()?.querySelector('#cm6-dev-tools-button')?.remove()
|
||||||
|
@ -37,7 +38,7 @@ const devToolsButton = ViewPlugin.define(view => {
|
||||||
view.dispatch(toggleDevTools())
|
view.dispatch(toggleDevTools())
|
||||||
})
|
})
|
||||||
|
|
||||||
getContainer()?.append(button)
|
getContainer()?.prepend(button)
|
||||||
}
|
}
|
||||||
|
|
||||||
window.setTimeout(() => {
|
window.setTimeout(() => {
|
||||||
|
|
|
@ -334,6 +334,10 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.formatting-buttons-wrapper {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
.formatting-btn {
|
.formatting-btn {
|
||||||
color: @formatting-btn-color;
|
color: @formatting-btn-color;
|
||||||
background-color: @formatting-btn-bg;
|
background-color: @formatting-btn-bg;
|
||||||
|
|
Loading…
Reference in a new issue