Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Flame base components mobile-friendliness #24

Draft
wants to merge 10 commits into
base: master
Choose a base branch
from
Draft

Flame base components mobile-friendliness #24

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
75ac667
initial commit
xdrdak Oct 10, 2019
feae1a5
Add Storybook viewport addon
glambert Oct 16, 2019
36a353a
Make viewport fit in window
glambert Oct 16, 2019
3a1bcc2
Use common breakpoints from theme
glambert Oct 17, 2019
b10a255
Better mobile responsiveness for Checkbox/Radio (#26)
xdrdak Oct 17, 2019
5809a80
Mobile friendly Alert & Icon (#27)
xdrdak Oct 21, 2019
76070c8
Merge branch 'master' into flame-mobile-friendliness
xdrdak Nov 15, 2019
50a2c2f
Make switch more mobile friendly (#48)
xdrdak Nov 25, 2019
32c2374
Make BaseInput responsive. Leverage css prop (#45)
xdrdak Nov 25, 2019
0db09e4
Make select more mobile friendly (#52)
xdrdak Nov 26, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .storybook/addons.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,3 +2,4 @@ import '@storybook/addon-options/register';
import 'storybook-readme/register';
import '@storybook/addon-actions/register';
import '@storybook/addon-knobs/register';
import '@storybook/addon-viewport/register';
23 changes: 23 additions & 0 deletions .storybook/config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,29 @@ addParameters({
},
});

addParameters({
viewport: {
viewports: {
small: {
name: 'Small',
styles: {
width: '623px',
height: '100%',
},
type: 'mobile',
},
medium: {
name: 'Medium',
styles: {
width: '1023px',
height: '100%',
},
type: 'tablet',
},
},
},
});

glambert marked this conversation as resolved.
Show resolved Hide resolved
function loadStories() {
/* eslint-disable global-require, import/no-unresolved, import/no-webpack-loader-syntax */
require('./require-stories!./empty');
Expand Down
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,7 @@
"@storybook/addon-info": "^5.2.1",
"@storybook/addon-knobs": "^5.2.1",
"@storybook/addon-options": "^5.2.1",
"@storybook/addon-viewport": "^5.2.4",
"@storybook/addons": "^5.2.1",
"@storybook/react": "^5.2.1",
"@testing-library/react": "^8.0.1",
Expand Down
150 changes: 149 additions & 1 deletion yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2267,6 +2267,23 @@
core-js "^3.0.1"
util-deprecate "^1.0.2"

"@storybook/addon-viewport@^5.2.4":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-5.2.4.tgz#4d7dd0e8a84d249519effc224ee0c937cc3403ac"
integrity sha512-R49wSaiouSVBYeus5Xibv+XXX9Nc3/rZ1NB5yIgj658aDeuB8WgkHbM3dKd/GrWeVZWv3o4CjW81ernd3f8sdw==
dependencies:
"@storybook/addons" "5.2.4"
"@storybook/api" "5.2.4"
"@storybook/client-logger" "5.2.4"
"@storybook/components" "5.2.4"
"@storybook/core-events" "5.2.4"
"@storybook/theming" "5.2.4"
core-js "^3.0.1"
global "^4.3.2"
memoizerific "^1.11.3"
prop-types "^15.7.2"
util-deprecate "^1.0.2"

"@storybook/[email protected]", "@storybook/addons@^5.2.1":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-5.2.1.tgz#6e52aa1fa2737e170fb675eb1fcceebd0a915a0b"
Expand All @@ -2280,6 +2297,19 @@
global "^4.3.2"
util-deprecate "^1.0.2"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/addons/-/addons-5.2.4.tgz#5c4f031e403c90a517cd6d208ec51d7e2455683a"
integrity sha512-Q+bnVlBA308qnELxnh18hBDRSUgltR9KbV537285dUL/okv/NC6n51mxJwIaG+ksBW2wU+5e6tqSayaKF3uHLw==
dependencies:
"@storybook/api" "5.2.4"
"@storybook/channels" "5.2.4"
"@storybook/client-logger" "5.2.4"
"@storybook/core-events" "5.2.4"
core-js "^3.0.1"
global "^4.3.2"
util-deprecate "^1.0.2"

"@storybook/[email protected]":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/api/-/api-5.2.1.tgz#b9cd6639019e044a8ade6fb358cade79c0e3b5d3"
Expand All @@ -2303,6 +2333,29 @@
telejson "^2.2.2"
util-deprecate "^1.0.2"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/api/-/api-5.2.4.tgz#b0b3dbd93444d163a80b455fb877d816a37b3149"
integrity sha512-KqAB+NkHIHdwu749NDP+7i44jy1bFgpq7GTJlG+sx/XLZHQveK/8yn109g9bXHFth7SvdXI1+9GA/apzwBU/Mw==
dependencies:
"@storybook/channels" "5.2.4"
"@storybook/client-logger" "5.2.4"
"@storybook/core-events" "5.2.4"
"@storybook/router" "5.2.4"
"@storybook/theming" "5.2.4"
core-js "^3.0.1"
fast-deep-equal "^2.0.1"
global "^4.3.2"
lodash "^4.17.11"
memoizerific "^1.11.3"
prop-types "^15.6.2"
react "^16.8.3"
semver "^6.0.0"
shallow-equal "^1.1.0"
store2 "^2.7.1"
telejson "^3.0.2"
util-deprecate "^1.0.2"

"@storybook/[email protected]":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/channel-postmessage/-/channel-postmessage-5.2.1.tgz#85541f926d61eedbe2a687bb394d37fc06252751"
Expand All @@ -2321,6 +2374,13 @@
dependencies:
core-js "^3.0.1"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-5.2.4.tgz#7ab5c9478517ddb9e8ac0c4188b408b9d7e6b7e4"
integrity sha512-/r39yEZ5QiGdiq95DhXBypdBo7urkD3Sp1WDyK48uGkZ0gdHWSPy3BBy8OJhEhfNz7nVisTiVIBr4gIrubKDjw==
dependencies:
core-js "^3.0.1"

"@storybook/[email protected]":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/client-api/-/client-api-5.2.1.tgz#bdd335187279a4ab45e20d6d5e9131e5f7098acf"
Expand Down Expand Up @@ -2356,6 +2416,13 @@
dependencies:
core-js "^3.0.1"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-5.2.4.tgz#6ebe37cbc92e0efe27c7119f52d94f647fbb470c"
integrity sha512-ofp6QQPQZBU+RvlAH5KpZRsfAFHecCZDnl/7YG6FwjHseJr3jHTYmBGGjJDMHFHq+Q7FGQu/yVb9lMFgoQ43QQ==
dependencies:
core-js "^3.0.1"

"@storybook/[email protected]":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/components/-/components-5.2.1.tgz#a4519c5d435c2c25c481e2b64a768e1e568a223f"
Expand All @@ -2380,6 +2447,30 @@
react-textarea-autosize "^7.1.0"
simplebar-react "^1.0.0-alpha.6"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/components/-/components-5.2.4.tgz#9ecd080416eac4e8453030dd601cbeaa32ce4126"
integrity sha512-APhw+XGag0RTCRJ8eCWKVr8dLt9SRqnS8LtzcZJbokCYRxRTFzhmX2eVEE1v+d0gHib1/yh2COxOjMzv3m/rQA==
dependencies:
"@storybook/client-logger" "5.2.4"
"@storybook/theming" "5.2.4"
"@types/react-syntax-highlighter" "10.1.0"
core-js "^3.0.1"
global "^4.3.2"
markdown-to-jsx "^6.9.1"
memoizerific "^1.11.3"
polished "^3.3.1"
popper.js "^1.14.7"
prop-types "^15.7.2"
react "^16.8.3"
react-dom "^16.8.3"
react-focus-lock "^1.18.3"
react-helmet-async "^1.0.2"
react-popper-tooltip "^2.8.3"
react-syntax-highlighter "^8.0.1"
react-textarea-autosize "^7.1.0"
simplebar-react "^1.0.0-alpha.6"

"@storybook/components@^5.0.6":
version "5.1.11"
resolved "https://registry.yarnpkg.com/@storybook/components/-/components-5.1.11.tgz#da253af0a8cb1b063c5c2e8016c4540c983f717d"
Expand Down Expand Up @@ -2411,6 +2502,13 @@
dependencies:
core-js "^3.0.1"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-5.2.4.tgz#210c968e96e2fc031cad1d3a09b06fa69ae433fc"
integrity sha512-nQknCmaz2S2HW6PSGcuFzve7Y1Js2Cb268vUG0ZMNtJZwFawqYc+KSQHqmOY0pVm8dyROTcWCudPA0k+hk6N5Q==
dependencies:
core-js "^3.0.1"

"@storybook/core-events@^5.0.6":
version "5.1.11"
resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-5.1.11.tgz#9d00503a936d30398f7a64336eb956303d053765"
Expand Down Expand Up @@ -2543,6 +2641,19 @@
memoizerific "^1.11.3"
qs "^6.6.0"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/router/-/router-5.2.4.tgz#e47af60478da7730c7d82de3d089d12c17077333"
integrity sha512-GL7eGdj5oYST0mE9fThJB9ye9tTTgrP+aP3okZ6MeMGtNytb7bmJRpAD2E4ouuPTQVppyHI5re8g/HUxUNOT1g==
dependencies:
"@reach/router" "^1.2.1"
"@types/reach__router" "^1.2.3"
core-js "^3.0.1"
global "^4.3.2"
lodash "^4.17.11"
memoizerific "^1.11.3"
qs "^6.6.0"

"@storybook/[email protected]":
version "5.1.11"
resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-5.1.11.tgz#0d1af46535f2e601293c999a314905069a93ec3b"
Expand Down Expand Up @@ -2579,6 +2690,24 @@
prop-types "^15.7.2"
resolve-from "^5.0.0"

"@storybook/[email protected]":
version "5.2.4"
resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-5.2.4.tgz#79c99f65992082fdb4d39fb652db435dd6bebaca"
integrity sha512-2ZlqBrmnm8N0352Fnu2+GB3pEsHL4Eb2eKxV0VLLgkjJuAlm7CK6+I/e4ZknQWxwYm2pQj1y6ta68A62fGBYyA==
dependencies:
"@emotion/core" "^10.0.14"
"@emotion/styled" "^10.0.14"
"@storybook/client-logger" "5.2.4"
common-tags "^1.8.0"
core-js "^3.0.1"
deep-object-diff "^1.1.0"
emotion-theming "^10.0.14"
global "^4.3.2"
memoizerific "^1.11.3"
polished "^3.3.1"
prop-types "^15.7.2"
resolve-from "^5.0.0"

"@storybook/[email protected]":
version "5.2.1"
resolved "https://registry.yarnpkg.com/@storybook/ui/-/ui-5.2.1.tgz#ceba1657a232efd10f839027f8ae274e370c89f6"
Expand Down Expand Up @@ -2901,6 +3030,11 @@
resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.3.tgz#856c99cdc1551d22c22b18b5402719affec9839a"
integrity sha512-cS5owqtwzLN5kY+l+KgKdRJ/Cee8tlmQoGQuIE9tWnSmS3JMKzmxo2HIAk2wODMifGwO20d62xZQLYz+RLfXmw==

"@types/is-function@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@types/is-function/-/is-function-1.0.0.tgz#1b0b819b1636c7baf0d6785d030d12edf70c3e83"
integrity sha512-iTs9HReBu7evG77Q4EC8hZnqRt57irBDkK9nvmHroiOIVwYMQc4IvYvdRgwKfYepunIY7Oh/dBuuld+Gj9uo6w==

"@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0":
version "2.0.1"
resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.1.tgz#42995b446db9a48a11a07ec083499a860e9138ff"
Expand Down Expand Up @@ -8639,7 +8773,7 @@ global-prefix@^3.0.0:
kind-of "^6.0.2"
which "^1.3.1"

global@^4.3.2:
global@^4.3.2, global@^4.4.0:
version "4.4.0"
resolved "https://registry.yarnpkg.com/global/-/global-4.4.0.tgz#3e7b105179006a323ed71aafca3e9c57a5cc6406"
integrity sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==
Expand Down Expand Up @@ -15927,6 +16061,20 @@ telejson@^2.2.2:
lodash "^4.17.11"
memoizerific "^1.11.3"

telejson@^3.0.2:
version "3.0.3"
resolved "https://registry.yarnpkg.com/telejson/-/telejson-3.0.3.tgz#442af55f78d791d3744c9e7a696be6cdf789a4b5"
integrity sha512-gUOh6wox1zJjbGMg+e26NquZcp/F18EbIaqVvjiGqikRqVB4fYEAM8Nyin8smgwX30XhaRBOg+kCj4vInmvwAg==
dependencies:
"@types/is-function" "^1.0.0"
global "^4.4.0"
is-function "^1.0.1"
is-regex "^1.0.4"
is-symbol "^1.0.2"
isobject "^4.0.0"
lodash "^4.17.15"
memoizerific "^1.11.3"

temp-dir@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/temp-dir/-/temp-dir-1.0.0.tgz#0a7c0ea26d3a39afa7e0ebea9c1fc0bc4daa011d"
Expand Down