chore: small fixes

twilio-labs · Aug 29, 2022 · 11c6704 · 11c6704
1 parent aec5a9a
commit 11c6704
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/packages/paste-core/components/code-block/src/CodeBlockGroupTab.tsx b/packages/paste-core/components/code-block/src/CodeBlockGroupTab.tsx
@@ -39,7 +39,7 @@ export const CodeBlockGroupTab = React.forwardRef<HTMLButtonElement, {element: B
       _selected_focus={{borderColor: 'transparent'}}
       _selected_hover={{
         backgroundColor: 'colorBackgroundPrimaryStronger',
-        color: 'colorTextInverse',
+        color: 'colorTextWeakest',
         borderColor: 'transparent',
       }}
     >

diff --git a/packages/paste-core/components/code-block/stories/index.stories.tsx b/packages/paste-core/components/code-block/stories/index.stories.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import type {Story} from '@storybook/react';
 import {CodeBlock, CodeBlockGroup} from '../src';
+import {Box} from '@twilio-paste/box';
 
 // eslint-disable-next-line import/no-default-export
 export default {
@@ -58,8 +59,9 @@ foreground '#CCCCFF'
 );
 
 export const CodeBlockWithNoLineWrap: Story = () => (
-  <CodeBlock label="Build a button" showLineNumbers language="ruby">
-    {`#!/usr/bin/ruby
+  <Box maxWidth="size40">
+    <CodeBlock label="Build a button" showLineNumbers language="ruby">
+      {`#!/usr/bin/ruby
 
 # Import the library. This is a really really really really really really really really really really really really long line that should be wrapped.
 require 'tk'
@@ -76,12 +78,14 @@ lab = TkLabel.new(root) {
   background '#3333AA'
   foreground '#CCCCFF'
 }`}
-  </CodeBlock>
+    </CodeBlock>
+  </Box>
 );
 
 export const CodeBlockWithLineWrap: Story = () => (
-  <CodeBlock label="Build a button" showLineNumbers language="ruby" wrapLines>
-    {`#!/usr/bin/ruby
+  <Box maxWidth="size40">
+    <CodeBlock label="Build a button" showLineNumbers language="ruby" wrapLines>
+      {`#!/usr/bin/ruby
 
 # Import the library. This is a really really really really really really really really really really really really long line that should be wrapped.
 require 'tk'
@@ -98,7 +102,8 @@ lab = TkLabel.new(root) {
   background '#3333AA'
   foreground '#CCCCFF'
 }`}
-  </CodeBlock>
+    </CodeBlock>
+  </Box>
 );
 
 export const CodeBlockWithLineNumbers: Story = () => (