agw/overleaf-cep
1
0
Fork 0
mirror of https://github.com/yu-i-i/overleaf-cep.git synced 2026-05-23 17:19:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

Refactor Python output pane toolbar for improved layout and styling

Browse Source 
GitOrigin-RevId: b6d838e5c9bd8023bf12df976dad0c50564a0b2f
This commit is contained in:
Domagoj Kriskovic
2026-05-12 11:42:30 +02:00
committed by Copybot
parent fc66bbfb26
commit ff53705bfa
2 changed files with 37 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
services/web/frontend/js/features/ide-react/components/editor/python/python-output-pane.tsx
View File

@@ -31,9 +31,9 @@ export default function PythonOutputPane() {
return (
<div className="ide-redesign-python-output-pane">
<OLButtonToolbar className="toolbar toolbar-pdf toolbar-pdf-hybrid">
<div className="toolbar-pdf-left">
<div className="compile-button-group">
<OLButtonToolbar className="ide-redesign-python-output-pane-toolbar">
<div className="ide-redesign-python-output-pane-toolbar-left">
<div className="ide-redesign-python-output-pane-run-button-wrapper">
<OLButton
onClick={() => {
if (status === 'running') {
@@ -43,7 +43,7 @@ export default function PythonOutputPane() {
}
}}
variant={status === 'running' ? 'danger' : 'primary'}
className="compile-button align-items-center py-0 px-3"
className="align-items-center py-0 px-3"
disabled={status === 'loading'}
aria-label={
status === 'running'

44
services/web/frontend/stylesheets/pages/editor/ide-redesign.scss
View File

@@ -68,21 +68,43 @@
background-color: var(--ide-redesign-background);
color: var(--ide-redesign-color);
border-top: 1px solid var(--border-divider);
}
.compile-button-group {
border-radius: var(--ds-border-radius-300);
.ide-redesign-python-output-pane-toolbar {
display: flex;
align-items: center;
height: var(--toolbar-height);
border-bottom: 1px solid var(--toolbar-border-color);
}
.ide-redesign-python-output-pane-toolbar-left {
display: flex;
align-items: center;
align-self: stretch;
gap: var(--spacing-02);
}
.ide-redesign-python-output-pane-run-button-wrapper {
height: 24px;
background-color: var(--bg-accent-01);
border-radius: var(--ds-border-radius-300);
margin-left: var(--spacing-02);
.btn-primary:hover {
z-index: auto;
}
}
.ide-redesign-python-output-pane-toolbar-right {
flex: 1;
display: flex;
justify-content: flex-end;
align-items: center;
padding-right: var(--spacing-02);
.ide-redesign-python-output-pane-toolbar-right {
flex: 1;
display: flex;
justify-content: flex-end;
align-items: center;
align-self: stretch;
padding-right: var(--spacing-02);
.material-symbols {
font-size: 16px;
}
.material-symbols {
font-size: 16px;
}
}