Storybook: add hardcoded color variables, fix missing import

.storybook/preview.ts

@@ -1,4 +1,5 @@
 import '../app/styles/tailwind.css';
+import '../stories/theme.css';
 
 export const parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },

stories/Header.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
-import { Button } from './Button';
+import Button from '../app/soapbox/components/ui/button/button';
+
 import './header.css';
 
 type User = {
@@ -42,12 +43,12 @@ export const Header = ({ user, onLogin, onLogout, onCreateAccount }: HeaderProps
             <span className='welcome'>
               Welcome, <b>{user.name}</b>!
             </span>
-            <Button size='small' onClick={onLogout} label='Log out' />
+            <Button size='sm' onClick={onLogout} text='Log out' />
           </>
         ) : (
           <>
-            <Button size='small' onClick={onLogin} label='Log in' />
+            <Button size='sm' onClick={onLogin} text='Log in' />
-            <Button primary size='small' onClick={onCreateAccount} label='Sign up' />
+            <Button theme='primary' size='sm' onClick={onCreateAccount} text='Sign up' />
           </>
         )}
       </div>