GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-06 07:21:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update storyshots

Browse Source
This commit is contained in:
Michael Shilman 2019-02-18 18:11:48 +08:00
parent ad4b4f7613
commit a6fcf4126b
14 changed files with 1904 additions and 4862 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
addons/knobs/src/components/__tests__/__snapshots__/Panel.js.snap
View File

@ -40,8 +40,8 @@ Array [
.emotion-0 {
min-width: 100px;
min-height: 32px;
margin-right: 16px;
font-weight: 700;
margin-right: 15px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -135,8 +135,8 @@ Array [
.emotion-0 {
min-width: 100px;
min-height: 32px;
margin-right: 16px;
font-weight: 700;
margin-right: 15px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;

88
examples/cra-kitchen-sink/src/stories/__snapshots__/index.stories.storyshot
View File

@ -207,32 +207,24 @@ exports[`Storyshots Button with new info 1`] = `
>
"Container" Component
</h3>
<table>
<table
class="info-table"
>
<thead>
<tr>
<th
style="text-align:left;vertical-align:top"
>
<th>
property
</th>
<th
style="text-align:left;vertical-align:top"
>
<th>
propType
</th>
<th
style="text-align:left;vertical-align:top"
>
<th>
required
</th>
<th
style="text-align:left;vertical-align:top"
>
<th>
default
</th>
<th
style="text-align:left;vertical-align:top"
>
<th>
description
</th>
</tr>
@ -240,81 +232,65 @@ exports[`Storyshots Button with new info 1`] = `
<tbody>
<tr>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
children
</td>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
<span>
node
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
yes
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
-
</td>
<td
style="padding-right:10px;vertical-align:top"
/>
<td />
</tr>
<tr>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
isAmazing
</td>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
<span>
bool
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
-
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
<span>
false
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
/>
<td />
</tr>
<tr>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
age
</td>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
<span>
other
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
-
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
<span>
{
<span>
@ -339,38 +315,30 @@ exports[`Storyshots Button with new info 1`] = `
}
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
/>
<td />
</tr>
<tr>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
title
</td>
<td
style="padding-right:10px;vertical-align:top"
class="info-table-monospace"
>
<span>
string
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
-
</td>
<td
style="padding-right:10px;vertical-align:top"
>
<td>
<span>
the best container ever
</span>
</td>
<td
style="padding-right:10px;vertical-align:top"
/>
<td />
</tr>
</tbody>
</table>

38
examples/official-storybook/stories/__snapshots__/addon-a11y.stories.storyshot
View File

@ -95,6 +95,25 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
margin-bottom: 3rem;
}
.emotion-0 {
min-width: 100px;
font-weight: 700;
margin-right: 15px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
line-height: 16px;
}
.emotion-1 {
-webkit-appearance: none;
-moz-appearance: none;
@ -147,25 +166,6 @@ exports[`Storyshots Addons|A11y/Form With label 1`] = `
color: #999999;
}
.emotion-0 {
min-width: 100px;
min-height: 32px;
margin-right: 16px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
line-height: 16px;
}
<label
class="emotion-2"
>

1908
examples/official-storybook/stories/__snapshots__/addon-actions.stories.storyshot
View File

File diff suppressed because it is too large Load Diff

2552
examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
View File

File diff suppressed because it is too large Load Diff

808
examples/official-storybook/tests/__snapshots__/storyshots.test.js.snap
View File

File diff suppressed because it is too large Load Diff

148
lib/components/src/Button/__snapshots__/Button.stories.storyshot
View File

@ -13,6 +13,80 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
fill: currentColor;
}
.emotion-3 {
border: 0;
border-radius: 3em;
cursor: pointer;
display: inline-block;
overflow: hidden;
padding: 10px 16px;
position: relative;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
-webkit-transition: all 150ms ease-out;
transition: all 150ms ease-out;
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
vertical-align: top;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
opacity: 1;
margin: 0;
background: transparent;
font-size: 12px;
font-weight: 700;
line-height: 1;
background: #fafafa;
color: #333333;
box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
border-radius: 4px;
display: inline;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
overflow: visible;
z-index: 2;
}
.emotion-3 svg {
display: inline-block;
height: 14px;
width: 14px;
vertical-align: top;
margin-right: 4px;
margin-top: -1px;
margin-bottom: -1px;
pointer-events: none;
}
.emotion-3 svg path {
fill: currentColor;
}
.emotion-3:hover {
background: #f2f2f2;
}
.emotion-3:active {
background: #FFFFFF;
}
.emotion-3:focus {
box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
}
.emotion-3:hover {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.emotion-0 {
border: 0;
border-radius: 3em;
@ -201,80 +275,6 @@ exports[`Storyshots Basics|Button all buttons 1`] = `
box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
}
.emotion-3 {
border: 0;
border-radius: 3em;
cursor: pointer;
display: inline-block;
overflow: hidden;
padding: 10px 16px;
position: relative;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
-webkit-transition: all 150ms ease-out;
transition: all 150ms ease-out;
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
vertical-align: top;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
opacity: 1;
margin: 0;
background: transparent;
font-size: 12px;
font-weight: 700;
line-height: 1;
background: #fafafa;
color: #333333;
box-shadow: rgba(0,0,0,.1) 0 0 0 1px inset;
border-radius: 4px;
display: inline;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
overflow: visible;
z-index: 2;
}
.emotion-3 svg {
display: inline-block;
height: 14px;
width: 14px;
vertical-align: top;
margin-right: 4px;
margin-top: -1px;
margin-bottom: -1px;
pointer-events: none;
}
.emotion-3 svg path {
fill: currentColor;
}
.emotion-3:hover {
background: #f2f2f2;
}
.emotion-3:active {
background: #FFFFFF;
}
.emotion-3:focus {
box-shadow: rgba(30,167,253,0.4) 0 0 0 1px inset;
}
.emotion-3:hover {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.emotion-4 {
border: 0;
border-radius: 3em;

866
lib/components/src/tabs/__snapshots__/tabs.stories.storyshot
View File

@ -1,6 +1,25 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-7 {
display: -webkit-box;
display: -webkit-flex;
@ -27,6 +46,51 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
margin-left: 0;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
@ -76,70 +140,6 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
display: block;
}
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-10 {
display: block;
position: relative;
@ -282,6 +282,25 @@ exports[`Storyshots Basics|Tabs stateful - dynamic 1`] = `
`;
exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-7 {
display: -webkit-box;
display: -webkit-flex;
@ -308,6 +327,51 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
margin-left: 0;
}
.emotion-1 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-1:empty {
display: none;
}
.emotion-1:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
@ -357,70 +421,6 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
display: block;
}
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-1 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-1:empty {
display: none;
}
.emotion-1:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-10 {
display: block;
position: relative;
@ -519,6 +519,25 @@ exports[`Storyshots Basics|Tabs stateful - no initial 1`] = `
`;
exports[`Storyshots Basics|Tabs stateful - static 1`] = `
.emotion-4 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-3 {
display: -webkit-box;
display: -webkit-flex;
@ -545,6 +564,51 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
margin-left: 0;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-1 {
white-space: normal;
display: -webkit-inline-box;
@ -594,70 +658,6 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
display: block;
}
.emotion-4 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-6 {
display: block;
position: relative;
@ -714,6 +714,25 @@ exports[`Storyshots Basics|Tabs stateful - static 1`] = `
`;
exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-7 {
display: -webkit-box;
display: -webkit-flex;
@ -740,6 +759,51 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
margin-left: 0;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
@ -797,70 +861,6 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
width: 100%;
}
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-9 {
display: none;
}
@ -1012,6 +1012,25 @@ exports[`Storyshots Basics|Tabs stateless - absolute 1`] = `
`;
exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-7 {
display: -webkit-box;
display: -webkit-flex;
@ -1038,70 +1057,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
margin-left: 0;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: #1EA7FD;
border-bottom-color: #1EA7FD;
}
.emotion-2:empty {
display: none;
}
.emotion-2:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-8 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
@ -1147,6 +1102,51 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
border-bottom-color: #1EA7FD;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: #1EA7FD;
border-bottom-color: #1EA7FD;
}
.emotion-2:empty {
display: none;
}
.emotion-2:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-10 {
display: block;
position: relative;
@ -1295,10 +1295,6 @@ exports[`Storyshots Basics|Tabs stateless - bordered 1`] = `
`;
exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
.emotion-0 {
font-weight: 700;
}
.emotion-1 {
padding: 30px;
text-align: center;
@ -1306,6 +1302,10 @@ exports[`Storyshots Basics|Tabs stateless - empty 1`] = `
font-size: 13px;
}
.emotion-0 {
font-weight: 700;
}
<div
style="height:calc(100vh - 20px)"
>
@ -1348,51 +1348,6 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
margin-left: 0;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: #1EA7FD;
border-bottom-color: #1EA7FD;
}
.emotion-2:empty {
display: none;
}
.emotion-2:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
@ -1438,6 +1393,51 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
border-bottom-color: #1EA7FD;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: #1EA7FD;
border-bottom-color: #1EA7FD;
}
.emotion-2:empty {
display: none;
}
.emotion-2:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-10 {
display: block;
position: relative;
@ -1605,6 +1605,25 @@ exports[`Storyshots Basics|Tabs stateless - no scrolling 1`] = `
`;
exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
.emotion-9 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-7 {
display: -webkit-box;
display: -webkit-flex;
@ -1631,6 +1650,51 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
margin-left: 0;
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-2 {
white-space: normal;
display: -webkit-inline-box;
@ -1691,70 +1755,6 @@ exports[`Storyshots Basics|Tabs stateless - with tools 1`] = `
display: block;
}
.emotion-9 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-0 {
white-space: normal;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
overflow: hidden;
vertical-align: top;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
-webkit-text-decoration: none;
text-decoration: none;
padding: 0 15px;
text-transform: capitalize;
-webkit-transition: color 0.2s linear,border-bottom-color 0.2s linear;
transition: color 0.2s linear,border-bottom-color 0.2s linear;
height: 40px;
line-height: 12px;
cursor: pointer;
background: transparent;
border: 0 solid transparent;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
color: inherit;
border-bottom-color: transparent;
}
.emotion-0:empty {
display: none;
}
.emotion-0:focus {
outline: 0 none;
border-bottom-color: #1EA7FD;
}
.emotion-11 {
display: block;
position: relative;

218
lib/components/src/tooltip/__snapshots__/ListItem.stories.storyshot
View File

@ -13,21 +13,6 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
fill: currentColor;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-5 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -64,6 +49,21 @@ exports[`Storyshots basics|Tooltip/ListItem active icon 1`] = `
opacity: 1;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-0 {
color: #333333;
color: #FF4785;
@ -183,21 +183,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
fill: currentColor;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-2 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -234,6 +219,25 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
opacity: 1;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-3 {
color: #333333;
}
.emotion-0 {
color: #333333;
-webkit-animation: animation-0 1.5s ease-in-out infinite;
@ -243,10 +247,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
cursor: progress;
}
.emotion-3 {
color: #333333;
}
.emotion-10 svg {
-webkit-transition: all 200ms ease-out;
transition: all 200ms ease-out;
@ -546,21 +546,6 @@ exports[`Storyshots basics|Tooltip/ListItem all 1`] = `
`;
exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-2 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -597,6 +582,21 @@ exports[`Storyshots basics|Tooltip/ListItem default 1`] = `
opacity: 1;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-0 {
color: #333333;
}
@ -629,21 +629,6 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
fill: currentColor;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-5 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -680,6 +665,21 @@ exports[`Storyshots basics|Tooltip/ListItem default icon 1`] = `
opacity: 1;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-0 {
color: #333333;
}
@ -892,21 +892,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
}
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-2 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -943,6 +928,21 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
opacity: 1;
}
.emotion-1 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-1 > * + * {
padding-left: 10px;
}
.emotion-0 {
color: #333333;
-webkit-animation: animation-0 1.5s ease-in-out infinite;
@ -970,21 +970,6 @@ exports[`Storyshots basics|Tooltip/ListItem loading 1`] = `
`;
exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-5 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -1021,6 +1006,21 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
opacity: 1;
}
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-1 {
color: #333333;
}
@ -1077,21 +1077,6 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions 1`] = `
`;
exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-5 {
font-size: 12px;
-webkit-transition: all 150ms ease-out;
@ -1128,6 +1113,21 @@ exports[`Storyshots basics|Tooltip/ListItem w/positions active 1`] = `
opacity: 1;
}
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-0 svg {
opacity: 1;
}

96
lib/components/src/tooltip/__snapshots__/TooltipLinkList.stories.storyshot
View File

@ -1,24 +1,10 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-0 {
display: inline-block;
cursor: pointer;
.emotion-8 {
min-width: 180px;
overflow: hidden;
border-radius: 8px;
}
.emotion-4 {
@ -57,10 +43,30 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
opacity: 1;
}
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-2 {
color: #333333;
}
.emotion-0 {
display: inline-block;
cursor: pointer;
}
.emotion-9 {
display: inline-block;
z-index: 2147483647;
@ -96,12 +102,6 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
border-right-color: transparent;
}
.emotion-8 {
min-width: 180px;
overflow: hidden;
border-radius: 8px;
}
<div
style="height:300px"
>
@ -156,24 +156,10 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links 1`] = `
`;
exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-0 {
display: inline-block;
cursor: pointer;
.emotion-11 {
min-width: 180px;
overflow: hidden;
border-radius: 8px;
}
.emotion-4 {
@ -212,10 +198,30 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
opacity: 1;
}
.emotion-3 {
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: left;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
}
.emotion-3 > * + * {
padding-left: 10px;
}
.emotion-2 {
color: #333333;
}
.emotion-0 {
display: inline-block;
cursor: pointer;
}
.emotion-12 {
display: inline-block;
z-index: 2147483647;
@ -251,12 +257,6 @@ exports[`Storyshots basics/Tooltip/TooltipLinkList links and callback 1`] = `
border-right-color: transparent;
}
.emotion-11 {
min-width: 180px;
overflow: hidden;
border-radius: 8px;
}
<div
style="height:300px"
>

8
lib/ui/src/components/layout/__snapshots__/layout.stories.storyshot
View File

@ -313,7 +313,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 0 1`] = `
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}
@ -602,7 +602,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 1 1`] = `
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}
@ -891,7 +891,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) initial 2 1`] = `
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}
@ -1180,7 +1180,7 @@ exports[`Storyshots UI|Layout/Mobile (mocked) page 1`] = `
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}

7
lib/ui/src/components/panel/__snapshots__/panel.stories.storyshot
View File

@ -23,13 +23,14 @@ exports[`Storyshots UI|Panel default 1`] = `
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-3 {
@ -90,7 +91,7 @@ exports[`Storyshots UI|Panel default 1`] = `
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}
@ -285,7 +286,7 @@ exports[`Storyshots UI|Panel no panels 1`] = `
.emotion-1 {
padding: 30px;
text-align: center;
color: #666666;
color: #333333;
font-size: 13px;
}

8
lib/ui/src/components/preview/__snapshots__/preview.stories.storyshot
View File

@ -71,13 +71,14 @@ Array [
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: auto;
overflow-x: auto;
overflow-y: hidden;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
position: absolute;
left: 0;
right: 0;
@ -342,7 +343,7 @@ Array [
border-bottom: 3px solid transparent;
font-weight: bold;
font-size: 13px;
opacity: 0.4;
color: inherit;
border-bottom-color: transparent;
}
@ -455,13 +456,14 @@ Array [
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: auto;
overflow-x: auto;
overflow-y: hidden;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
position: absolute;
left: 0;
right: 0;

13
lib/ui/src/settings/__snapshots__/about.stories.storyshot
View File

@ -23,13 +23,14 @@ exports[`Storyshots UI|Settings/AboutScreen failed to fetch new version 1`] = `
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-2 {
@ -525,13 +526,14 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-2 {
@ -1523,6 +1525,7 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
background: #FFFFFF;
}
.emotion-20 {
@ -1537,7 +1540,8 @@ exports[`Storyshots UI|Settings/AboutScreen new version required 1`] = `
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #666666;
color: #333333;
background: #FFFFFF;
font-size: 12px;
line-height: 16px;
font-weight: 700;
@ -1844,13 +1848,14 @@ exports[`Storyshots UI|Settings/AboutScreen up to date 1`] = `
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background: #FFFFFF;
color: #999999;
height: 40px;
position: relative;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
background: undefined linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
background: #FFFFFF linear-gradient(to bottom,transparent calc(100% - 1px),rgba(0,0,0,.1) calc(100% - 1px));
}
.emotion-2 {