github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Avoid vertical border between editor switch and empty space (#18029)

Browse source 
GitOrigin-RevId: 516098061a4d329daf55bb42bcf47a5a412595c1
This commit is contained in:
Alf Eaton 2024-04-22 13:46:54 +01:00 committed by Copybot
parent e0ffa9cc79
commit 315b511666
4 changed files with 11 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx
View file

@ -168,8 +168,6 @@ const Toolbar = memo(function Toolbar() {
/> />
</ToolbarOverflow> </ToolbarOverflow>
)} )}
<div className="formatting-buttons-wrapper" />
</div> </div>
<div <div

22
services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
View file

@ -87,26 +87,22 @@ const toolbarTheme = EditorView.theme({
padding: '0 4px', padding: '0 4px',
margin: '4px 0', margin: '4px 0',
lineHeight: '1', lineHeight: '1',
'&:not(:first-of-type)': { borderLeft: '1px solid rgba(125, 125, 125, 0.3)',
borderLeft: '1px solid rgba(125, 125, 125, 0.3)', '&.ol-cm-toolbar-end': {
'&.ol-cm-toolbar-end': { borderLeft: 'none',
borderLeft: 'none', },
}, '&.ol-cm-toolbar-stretch': {
'&.ol-cm-toolbar-stretch': { flex: 1,
flex: 1, '.editor-toggle-switch + &': {
}, 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',

5
services/web/frontend/js/features/source-editor/languages/latex/codemirror-dev-tools.ts
View file

@ -19,8 +19,7 @@ export const codemirrorDevTools = () => {
} }
const devToolsButton = ViewPlugin.define(view => { const devToolsButton = ViewPlugin.define(view => {
const getContainer = () => const getContainer = () => document.querySelector('.ol-cm-toolbar-end')
document.querySelector('.formatting-buttons-wrapper')
const removeButton = () => { const removeButton = () => {
getContainer()?.querySelector('#cm6-dev-tools-button')?.remove() getContainer()?.querySelector('#cm6-dev-tools-button')?.remove()
@ -38,7 +37,7 @@ const devToolsButton = ViewPlugin.define(view => {
view.dispatch(toggleDevTools()) view.dispatch(toggleDevTools())
}) })
getContainer()?.prepend(button) getContainer()?.append(button)
} }
window.setTimeout(() => { window.setTimeout(() => {

4
services/web/frontend/stylesheets/app/editor/toolbar.less
View file

@ -334,10 +334,6 @@
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;