Skip to content

Commit 5145783

Browse files
committed
feat: inline designer undo/redo SVGs in CCB with currentColor
- Replace the fa-rotate-left / fa-rotate-right glyphs on #ccbUndoBtn / #ccbRedoBtn with inline designer SVGs (src/styles/images/{undo,redo}.svg). - Drop the designer asset's hardcoded fill/stroke colors; use fill: currentColor only so the icons inherit .ccb-btn color (hover/active follow free). No bg-coupled stroke — keeps the asset and stylesheet free of themed hardcodes. - Render at 15x11 via CSS (.ccb-edit-icon) to match the visual weight of the surrounding CCB icons without needing the old stroke trim.
1 parent f08921e commit 5145783

5 files changed

Lines changed: 18 additions & 20 deletions

File tree

src/index.html

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -949,10 +949,14 @@
949949
<div class="ccb-divider"></div>
950950
<div class="ccb-group ccb-group-edit">
951951
<a href="#" id="ccbUndoBtn" class="ccb-btn" title="Undo">
952-
<i class="fa-solid fa-rotate-left"></i>
952+
<svg class="ccb-edit-icon" viewBox="0 0 22 17" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
953+
<path fill="currentColor" d="M8.9502 2.33398L6.49219 4.79395L6.18945 5.0957H6.61719L11.4883 5.09766C14.2134 5.09841 15.5922 5.10134 16.4404 5.18164C16.8608 5.22144 17.1435 5.27977 17.3906 5.36328C17.6394 5.44739 17.8593 5.55885 18.1582 5.71582V5.7168C19.3778 6.35739 20.3334 7.45815 20.8584 8.83691C20.9639 9.11405 21.0196 9.29347 21.0508 9.5332C21.0828 9.77961 21.0898 10.094 21.0898 10.6416C21.0898 11.1889 21.0828 11.5027 21.0508 11.749C21.0274 11.929 20.9903 12.0752 20.9287 12.2539L20.8584 12.4463C20.5052 13.3739 20.0723 14.0292 19.3896 14.6748C18.9323 15.1075 18.3356 15.4867 17.7188 15.7578C17.1008 16.0294 16.4754 16.1874 15.9609 16.1875H15.7314V13.2285H15.8633C16.0644 13.2272 16.3978 13.1398 16.6211 13.0381C18.6414 12.1171 18.7461 9.33015 16.7764 8.33105L16.2627 8.07129L16.2256 8.05176H6.18945L6.49219 8.35449L8.9502 10.8145L11.1055 12.9707H6.68848L3.43262 9.71484L0.25 6.53125L3.43262 3.39648L6.6875 0.186523L9.0752 0.182617L11.1055 0.177734L8.9502 2.33398Z"/>
954+
</svg>
953955
</a>
954956
<a href="#" id="ccbRedoBtn" class="ccb-btn" title="Redo">
955-
<i class="fa-solid fa-rotate-right"></i>
957+
<svg class="ccb-edit-icon" viewBox="0 0 22 17" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
958+
<path fill="currentColor" d="M12.3164 2.33398L14.7744 4.79395L15.0771 5.0957H14.6494L9.77832 5.09766C7.05319 5.09841 5.67443 5.10134 4.82617 5.18164C4.40582 5.22144 4.12312 5.27977 3.87598 5.36328C3.62717 5.44739 3.40726 5.55885 3.1084 5.71582V5.7168C1.88885 6.35739 0.933211 7.45815 0.408203 8.83691C0.302675 9.11405 0.247023 9.29347 0.21582 9.5332C0.183785 9.77961 0.176758 10.094 0.176758 10.6416C0.176759 11.1889 0.183829 11.5027 0.21582 11.749C0.239218 11.929 0.276306 12.0752 0.337891 12.2539L0.408203 12.4463C0.761384 13.3739 1.19432 14.0292 1.87695 14.6748C2.33434 15.1075 2.93102 15.4867 3.54785 15.7578C4.16581 16.0294 4.79116 16.1874 5.30566 16.1875H5.53516V13.2285H5.40332C5.20224 13.2272 4.86878 13.1398 4.64551 13.0381C2.62518 12.1171 2.52048 9.33015 4.49023 8.33105L5.00391 8.07129L5.04102 8.05176H15.0771L14.7744 8.35449L12.3164 10.8145L10.1611 12.9707H14.5781L17.834 9.71484L21.0166 6.53125L17.834 3.39648L14.5791 0.186523L12.1914 0.182617L10.1611 0.177734L12.3164 2.33398Z"/>
959+
</svg>
956960
</a>
957961
</div>
958962
<div class="ccb-divider"></div>

src/styles/CentralControlBar.less

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,12 @@
7373
pointer-events: none;
7474
}
7575

76+
svg.ccb-edit-icon {
77+
width: 15px;
78+
height: 11px;
79+
pointer-events: none;
80+
}
81+
7682
&:hover {
7783
color: @project-panel-text-1;
7884
background-color: rgba(255, 255, 255, 0.08);

src/styles/images/redo.svg

Lines changed: 3 additions & 0 deletions
Loading

src/styles/images/undo.svg

Lines changed: 3 additions & 0 deletions
Loading

test/control-bar-tests-todo.md

Lines changed: 0 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,6 @@ Keep this file updated as we add coverage; remove lines as suites land.
1111

1212
---
1313

14-
## 4. Enter design mode
15-
16-
- [ ] With live preview closed: executing the toggle first opens LP (verify a
17-
single execution of `FILE_LIVE_FILE_PREVIEW`), then applies collapsed
18-
layout
19-
- [ ] With live preview open: sidebar width is preserved, `.content` goes to
20-
`width: 0`, `#main-toolbar` gets `left: sidebarW + 30`, `width:
21-
innerWidth - sidebarW - 30` with `!important`, `right: auto`.
22-
- [ ] `savedToolbarWidth` captures pre-collapse `#main-toolbar.outerWidth` for
23-
later restore (only when LP was already open).
24-
- [ ] `$sidebar.data("maxsize")` is stored and replaced with `"1000%"` so
25-
`Resizer.updateResizeLimits` doesn't shrink the sidebar on subsequent
26-
window resizes.
27-
- [ ] `#main-toolbar > .horz-resizer` gets `display: none` via CSS.
28-
- [ ] `document.body` gets class `ccb-editor-collapsed`.
29-
- [ ] `WorkspaceManager.isInDesignMode()` returns `true` and
30-
`EVENT_WORKSPACE_DESIGN_MODE_CHANGE` fires with `true`.
31-
3214
## 5. Exit design mode
3315

3416
- [ ] Before flipping the body class, `sidebar.style.width` is pinned to the

0 commit comments

Comments
 (0)