Skip to content

Commit

Permalink
addon-info: fix copy button styling
Browse files Browse the repository at this point in the history 
The copy button in Story Source was shrunk when the source was too wide to fit on screen (https://monosnap.com/file/0k7rzJAxlBV9XiFLGeJnnUKs12dipg).
  • Loading branch information
@adekbadek
adekbadek authored and Adam Borowski committed Jul 18, 2018
1 parent ea3d6d5 commit 1c9e4c1
Show file tree
Hide file tree
Showing 4 changed files with 33 additions and 26 deletions.
6 changes: 6 additions & 0 deletions addons/info/src/__snapshots__/index.test.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,9 @@ exports[`addon Info should render <Info /> and external markdown 1`] = `
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.emotion-1:hover {
Expand Down Expand Up @@ -1335,6 +1338,9 @@ exports[`addon Info should render <Info /> and markdown 1`] = `
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.emotion-1:hover {
Expand Down
1 change: 1 addition & 0 deletions addons/info/src/components/markdown/pre/copyButton.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ const Button = styled('button')(
fontSize: 13,
padding: '3px 10px',
alignSelf: 'flex-start',
flexShrink: 0,

':hover': {
backgroundColor: '#f4f7fa',
Expand Down
4 changes: 2 additions & 2 deletions examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,7 +181,7 @@ exports[`Storyshots Button addons composition 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -385,7 +385,7 @@ exports[`Storyshots Button with new info 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down
48 changes: 24 additions & 24 deletions examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ exports[`Storyshots Addons|Info.Decorator Use Info as story decorator 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -404,7 +404,7 @@ exports[`Storyshots Addons|Info.GitHub issues #1814 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -586,7 +586,7 @@ exports[`Storyshots Addons|Info.JSX Displays JSX in description 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -917,7 +917,7 @@ exports[`Storyshots Addons|Info.Markdown Displays Markdown in description 1`] =
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -1217,7 +1217,7 @@ exports[`Storyshots Addons|Info.Markdown From external Markdown file 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -1529,7 +1529,7 @@ exports[`Storyshots Addons|Info.Markdown From internal Markdown file 1`] = `
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -1802,7 +1802,7 @@ exports[`Storyshots Addons|Info.Options.TableComponent Use a custom component fo
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -1998,7 +1998,7 @@ exports[`Storyshots Addons|Info.Options.excludedPropTypes Excludes propTypes tha
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -2241,7 +2241,7 @@ exports[`Storyshots Addons|Info.Options.header Shows or hides Info Addon header
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -2512,7 +2512,7 @@ exports[`Storyshots Addons|Info.Options.inline Inlines component inside story 1`
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -3482,7 +3482,7 @@ exports[`Storyshots Addons|Info.Options.maxPropsIntoLine === 0 Object and array
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -4268,7 +4268,7 @@ exports[`Storyshots Addons|Info.Options.maxPropsIntoLine === 3 Object and array
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -4549,7 +4549,7 @@ exports[`Storyshots Addons|Info.Options.propTables Shows additional component pr
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -5001,7 +5001,7 @@ exports[`Storyshots Addons|Info.Options.propTablesExclude Exclude component from
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -5492,7 +5492,7 @@ exports[`Storyshots Addons|Info.Options.styles Extend info styles with an object
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -5765,7 +5765,7 @@ exports[`Storyshots Addons|Info.Options.styles Full control over styles using a
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -6102,7 +6102,7 @@ exports[`Storyshots Addons|Info.Parameters Overwrite the parameters with markdow
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -6402,7 +6402,7 @@ exports[`Storyshots Addons|Info.Parameters Overwrite the text parameter with mar
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -6672,7 +6672,7 @@ exports[`Storyshots Addons|Info.Parameters Overwriting and extending the paramet
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -6917,7 +6917,7 @@ exports[`Storyshots Addons|Info.Parameters Using paramaters across all stories 1
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -7216,7 +7216,7 @@ exports[`Storyshots Addons|Info.React Docgen Comments from Flow declarations 1`]
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -7667,7 +7667,7 @@ exports[`Storyshots Addons|Info.React Docgen Comments from PropType declarations
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -8402,7 +8402,7 @@ exports[`Storyshots Addons|Info.React Docgen Comments from component declaration
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down Expand Up @@ -8704,7 +8704,7 @@ exports[`Storyshots Addons|Info.React Docgen Comments from named export componen
</div>
</div>
<button
class="css-zvhq5i"
class="css-1naocv3"
>
<div
class="css-lvl6aa"
Expand Down

0 comments on commit 1c9e4c1

Please sign in to comment.