more tweaks to the snippets

docs/snippets/common/component-cypress-test.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// My-component_spec.js
+// MyComponent.spec.js
 
 describe('My Component', () => {
   it('should respond to click on button with warning', () => {

docs/snippets/common/foo-bar-baz-story.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// Foo-Bar.stories.js
+// FooBar.stories.js
 
 export default {
   title: 'Foo/Bar',

docs/snippets/common/other-foo-bar-story.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// Foo-Bar.stories.js
+// FooBar.stories.js
 
 export default {
   title: 'OtherFoo/Bar',

docs/snippets/common/storybook-preview-body-font-size.html.mdx

@@ -1,5 +1,5 @@
 ```html
-<!--  .storybook/preview-body.html -->
+<!-- .storybook/preview-body.html -->
 
 <style>
   body {

docs/snippets/common/storybook-preview-head-example.html.mdx

@@ -1,5 +1,5 @@
 ```html
-<!--  .storybook/preview-head.html -->
+<!-- .storybook/preview-head.html -->
 
 <!-- Pull in static files served from your Static director or the internet -->
 <link rel=”preload” href=”your/font” />

docs/snippets/common/storybook-preview-with-mock-decorator.js.mdx

@@ -1,7 +1,7 @@
 ```js
 // .storybook/preview.js
 
-import { decorator } from '../__mocks/isomorphic-fetch';
+import { decorator } from '../__mocks__/isomorphic-fetch';
 
 // Add the decorator to all stories
 export const decorators = [decorator];

docs/snippets/common/storybook-theme-example-variables.ts.mdx

@@ -1,5 +1,5 @@
 ```ts
-// yourTheme.js
+// YourTheme.js
 
 import { create } from '@storybook/theming/create';
 

docs/snippets/common/storybook-theming-styled-import.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// yourTheme.js
+// YourTheme.js
 
 import { styled } from '@storybook/theming';
 ```

docs/snippets/common/your-theme.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// yourTheme.js
+// YourTheme.js
 
 import { create } from '@storybook/theming/create';
 

docs/snippets/react/button-story-component-decorator.ts.mdx

@@ -1,5 +1,5 @@
 ```ts
-// button.stories.tsx
+// Button.stories.tsx
 
 import React from 'react';
 import { Story, Meta } from '@storybook/react/types-6-0';

docs/snippets/react/list-story-expanded.js.mdx

@@ -1,5 +1,6 @@
 ```js
 // List.stories.js
+
 import React from 'react';
 import List from './List';
 import ListItem from './ListItem';

docs/snippets/react/list-story-unchecked.js.mdx

@@ -1,5 +1,6 @@
 ```js
 // List.stories.js
+
 import React from 'react';
 import List from './List';
 

docs/snippets/react/list-story-unchecked.ts.mdx

@@ -1,5 +1,6 @@
 ```ts
 // List.stories.tsx
+
 import React from 'react';
 import { List, ListProps} from './List';
 // Instead of importing the ListItem, we import its stories

docs/snippets/react/page-story-with-args-composition.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// your-page.stories.js
+// YourPage.stories.js
 
 import React from 'react';
 import DocumentScreen from './DocumentScreen';

docs/snippets/react/page-story-with-args-composition.ts.mdx

@@ -1,5 +1,5 @@
 ```js
-// your-page.stories.js
+// YourPage.stories.js
 
 import React from 'react';
 import { Story, Meta } from '@storybook/react/types-6-0';

docs/snippets/react/page-story.ts.mdx

@@ -1,5 +1,6 @@
 ```ts
 // Page.stories.tsx
+
 import React from 'react';
 import { Story, Meta } from '@storybook/react/types-6-0';
 

docs/snippets/react/simple-page-implementation.js.mdx

@@ -1,5 +1,5 @@
 ```js
-// your-page.js
+// YourPage.js
 
 import React from 'react';
 import PageLayout from './PageLayout';

docs/snippets/react/simple-page-implementation.ts.mdx

@@ -1,5 +1,5 @@
 ```js
-// your-page.tsx
+// YourPage.tsx
 
 import React from 'react';
 import PageLayout from './PageLayout';

docs/snippets/react/your-component-with-decorator.js.mdx

@@ -1,8 +1,8 @@
 ```js
-// your-component.stories.js
+// YourComponent.stories.js
 
 export default {
-  component: your-component,
+  component: YourComponent,
   decorators: [(Story) => <div style={{ margin: '3em' }}><Story/></div>]
 }
 ``` 

docs/snippets/react/your-component-with-decorator.ts.mdx

@@ -1,8 +1,8 @@
 ```ts
-// your-component.stories.tsx
+// YourComponent.stories.tsx
 
 export default {
-  component: your-component,
+  component: YourComponent,
   decorators: [(Story) => <div style={{ margin: '3em' }}><Story/></div>]
 }
 ``` 

docs/snippets/react/your-component.ts.mdx

@@ -2,8 +2,9 @@
 // YourComponent.stories.tsx
 
 import React from 'react';
-import YourComponent from './your-component.component';
+import { YourComponent } from './YourComponent';
 
+// This default export determines where you story goes in the story list
 export default {
   title: 'YourComponent',
   component: YourComponent,