Refactor

seek-oss · Jun 3, 2024 · 9234c14 · 9234c14
1 parent b39d8a4
commit 9234c14
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 8 deletions.
diff --git a/src/Playroom/FramesPanel/FramesPanel.css.ts b/src/Playroom/FramesPanel/FramesPanel.css.ts
@@ -2,10 +2,8 @@ import { calc } from '@vanilla-extract/css-utils';
 import { globalStyle, style } from '@vanilla-extract/css';
 import { colorPaletteVars, sprinkles, vars } from '../sprinkles.css';
 
-export const title = sprinkles({
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'space-between',
+export const title = style({
+  marginRight: 'auto',
 });
 
 export const reset = style([

diff --git a/src/Playroom/FramesPanel/FramesPanel.tsx b/src/Playroom/FramesPanel/FramesPanel.tsx
@@ -46,10 +46,12 @@ interface FrameHeadingProps {
   children: ReactNode;
 }
 const FrameHeading = ({ showReset, onReset, children }: FrameHeadingProps) => (
-  <div className={styles.title}>
-    <Heading level="3">{children}</Heading>
+  <Inline space="none" alignY="center">
+    <div className={styles.title}>
+      <Heading level="3">{children}</Heading>
+    </div>
     {showReset && <ResetButton onClick={onReset}>Clear</ResetButton>}
-  </div>
+  </Inline>
 );
 
 interface FrameOptionProps<Option> {

diff --git a/src/Playroom/SettingsPanel/SettingsPanel.css.ts b/src/Playroom/SettingsPanel/SettingsPanel.css.ts
@@ -12,7 +12,7 @@ export const keyboardShortcutsRow = sprinkles({
 });
 
 export const keyboardShortcutTitle = style({
-  flex: 1,
+  marginRight: 'auto',
 });
 
 export const keyboardShortcutKeys = style([