Commit graph

33 commits

Author SHA1 Message Date
Suzanne Aitchison
5069cd681a
Markdown editor toolbar (#14876)
* rough starting point, roving tabindex in toolbar, bold and italic buttons

* refactor, add link

* add ul

* add ordered list

* core formatters in place, wip

* overflow options

* add keyboard shortcuts

* tidy up some dodgy classes

* add mocks for runtime in test and storybook, use correct modifier key for tooltip

* style tweaks

* refactor tooltips

* add markdown formatters tests

* add tests for toolbar component, fix mistake in overflow menu tooltips

* undo change no longer needed to button

* fix issue accessing runtime in formatters file

* only show darkened buttons and tooltips when focus-visible is true

* mobile view

* fix for responsive buttons & roving tabindex

* tweaks from PR review

* update cursor position on link insertion

* add a new line after block selection formatting

* align icons in center

* tidy up overflow menu listeners

* small refactors

* test for new text area util

* tidy up new lines after syntaxes

* fix logic in cursor offsets for links

* prevent scroll jumps after inserting syntax

* some style tweaks

* insert level 2 heading with new lines above and below

* update icons

* use margin instead of gap
2021-10-19 09:22:54 +01:00
Nick Taylor
924ea41fd0
Migrated Storybook to webpack 5. (#15050) 2021-10-12 14:49:10 -05:00
Suzanne Aitchison
3b67810b9d
Add support for JSX copy paste in Storybook (#14591)
* add support for JSX and HTML copy paste

* remove html addon, refactor dropdown story

* undo html addon settings
2021-08-30 09:36:01 +01:00
Suzanne Aitchison
bfb4f00aae
Add copy to HTML feature for storybook (#14599)
* Add copy to HTML feature for storybook, inc fix for article markup

* remove html stories no longer needed
2021-08-27 16:09:21 +01:00
Nick Taylor
bd46c1ff57
Added react aliases in Storybook webpack configuration. (#12825) 2021-02-26 09:25:38 +00:00
Nick Taylor
2bba2a6ee4
Added the @components webpack alias to the project (#12808)
* Added the @shared webpack alias to the project.

* Added some documentation.

* Fixed a copy paste error.

* Renamed @shared to @components.

* Update docs/frontend/webpacker.md

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
2021-02-24 16:07:48 +01:00
ludwiczakpawel
3b2480ed0a
CSS size reduce + cleanups. (#12625)
* tooltips 1.0.1

* tooltips 1.0.1

* fixes and cleanups

* whoops

* aria

* revert
2021-02-16 13:44:26 +01:00
Suzanne Aitchison
516bab133f
Storybook dropdown should be accessible 11724 (#12295)
* allow keyboard access to dropdown stories

* add accessibility notes to dropdown stories

* manage focus in html example

* Update reference to aria attributes in notes

Co-authored-by: Vaidehi Joshi <vaidehi.sj@gmail.com>

* add focus style to link for keyboard users

Co-authored-by: Vaidehi Joshi <vaidehi.sj@gmail.com>
2021-01-19 08:51:37 +00:00
rhymes
8a9bb8e9ff
Switch node-sass to dart-sass (#11873)
* Quiet StoryBook on Travis

* Fix StoryBook glob

* Switch node-sass to dart-sass

* Fix Netlify build error

* Tell Netlify to install Yarn

* Netlify defaults to npm, let's stick to it
2020-12-14 22:06:06 -05:00
Lisa Sy
ea00c808bd
Storybook: Add DocsPage and test out static content (#11397)
* Update naming of guidelines section and improve Introduction page

* Add Docs

* Add docs

* Install Docs add-on

- Rename top-level folders and sort manually
- Add MDX static pages

* Updated all Storybook addons to 6.1.3 except for notes as it's currently 5.3.21

* Fixed naming of section for the select component.

* Updated yarn.lock file.

* Added missing dependency @storybook/addon-docs

Co-authored-by: Nick Taylor <nick@dev.to>
2020-12-02 09:56:38 -08:00
Nick Taylor
df31a94f2e
Prep work to sync mobile search in #10424 (#11525)
* Prep work to sync mobile search in #10424

* Added a comment about the custom search event.

* Refactor to fix already defined error caused by const and InstantClick.

* Moved <SearchFormSync /> out of the pack file.

* Fixed broken tests.

* Renamed getInitialSearchTerm utility function to getSearchTermFromUrl

* Added some API docs to getSearchTermFromUrl

* Fixed a typo.

* Added some more API docs.

* Switched to a custom event so a custom payload can be passed.

* Added some API docs.

* Fixed bad destructuring statement.

* wip for some more tests.

* Refactored getSearchTermFromUrl to use URLSearchParams

* lazy loaded state for search term initial value.

* test broken still. Need to think on it.

* filterXSS is now set up in testSetup.js

* Fixed tests.

* Added the @utilities alias to Storybooks webpack config.

* Almost 100% coverage with two useful tests.

* Added some comments explaining document.body usage in the tests.

* Fixed issue where search attemps to get results on first load.

* Small refactor for setting the window.location in tests.

* Clarified an explanation in a comment.
2020-11-30 06:13:06 -05:00
Rafi
906811ef3c
Extracting prettier config (#10847)
Co-authored-by: Nick Taylor <nick@iamdeveloper.com>
2020-10-14 22:28:31 -04:00
Rafi
9514df9ea6
Showing example code in storybook (#10765)
Co-authored-by: Nick Taylor <nick@dev.to>
2020-10-14 10:39:32 -04:00
ludwiczakpawel
9d384e1a93
CSS Cleanups, part 2 (#10527)
* padding-top on body

* padding-top on body

* move cheese around

* .

* :(

* rename
2020-10-03 06:57:57 +02:00
Emma Goto
977e8aec45
Bump storybook to version 6 (#9766)
* Bump storybook to version 6

* Remove storybook addon-docs and revert back to storybook/addon-notes

Co-authored-by: Nick Taylor <nick@dev.to>
2020-08-17 10:34:43 +02:00
Nick Taylor
7f3217f156
Sass loader 9.0.1 upgrade (#9146)
* Bump sass-loader from 8.0.2 to 9.0.1

* Fixed breaking changes related to sass-loader@9.0.1
2020-07-06 09:40:53 +02:00
Nick Taylor
2130269f91
Documentation Improvements to Storybook (#8947) 2020-06-29 08:25:57 -05:00
Nick Taylor
a9c18b4359
Theme switcher in Storybook persists theme between stories and sessions now (#8855) 2020-06-23 09:05:24 -04:00
Nick Taylor
52ac36dd0a
Added a11y Storybook addon. (#8814) 2020-06-22 10:56:03 +02:00
Nick Taylor
653ec12300
Upgrade to Preact 10.4.4 (#8739)
Co-authored-by: Nick Taylor <nick@iamdeveloper.com>
Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
2020-06-18 10:07:17 -04:00
Nick Taylor
c83cad6fb6
Sorting Storybook stories (#8058)
* Added story sorting to Storybook.

* Added design system guidelines.

* Made Base in Storybook tree 2nd in the tree view.

* Now Components are 3rd in the treeview of Storybook.

* Now App Components are 4th in the treeview of Storybook.

* Froze node version to 12.16.0

* Revert "Froze node version to 12.16.0"

This reverts commit 093b119c7d7ca05ecb4e1c0234b24bcf8e7b10a4.
2020-05-27 13:10:16 -04:00
Nick Taylor
f0c4d56117
Added a theme switcher to Storybook. (#7364)
* Added the theme switcher to storybook.

* Renamed method to align it more with what it actually does.

* Renamed method to align it more with what it actually does.

* Changed order of themes in select to match order in UX settings.
2020-04-17 10:39:05 -04:00
Nick Taylor
5ba10c96a2
Add webpack aliases for Crayons components (#6958)
* Added webpack alias for @crayons.

* Added @crayons to eslint import/no-unresolved rule ignore list.

* Added path mappings for VS Code for webpack aliases.
2020-03-31 07:16:29 -04:00
Nick Taylor
749ee2a946
Added crayon.scss to Storybook. (#6853) 2020-03-26 12:27:54 +01:00
Nick Taylor
52c2f40256
Upgrade Storybook to 5.3.17 (#6754)
* Renabled building Storybook.

* Explicitly added webpack style loaders for Storybook custom webpack config.

* Upgraded Storybook configuration.

* Added mixin/function to handle SASS compilation for Sprockets and Storybook's webpack.

* Readded stylesheets/js required for crayons to run.

* Added a custom title to Storybook.

* Fixed custom Storybook CSS.

* Migrated Search storybook stories.

* Migrated crayons' box stories.

* Migrated crayons' modal stories.

* Migrated crayons' button stories.

* Changed title a bit until we get a logo.

* Migrated crayons' notice stories.

* Migrated crayons' dropdown stories.

* Migrated crayons' indicator stories.

* Migrated crayons' typography stories.

* Migrated crayons' form element stories.

* Migrated crayons' navigation stories.

* Migrated crayons' avatar & logo stories.

* Migrated fatured article stories.

* Migrated article loading stories.

* Migrated today's podcast episodes stories.

* Migrated podcast episode stories.

* Migrated rest of article stories.

* Update app/javascript/.storybook/manager.js

Co-Authored-By: rhymes <rhymesete@gmail.com>

* Commented new SASS function and mixin.

Co-authored-by: rhymes <rhymesete@gmail.com>
2020-03-23 09:46:50 -04:00
Nick Taylor
7bd99ad2da
Nickytonline/add crayons to storybook (#6578)
Added crayons (design system) to Storybook
2020-03-12 15:00:32 -04:00
Nick Taylor
5253ccaa75
Fixed centering of Storybook display area. (#6594) 2020-03-11 15:23:22 -04:00
Nick Taylor
5e677daac1
Homepage feed components (#6052)
* wip - <PodcastArticle /> component.

* Added filler user avatar for other article types.

* Added <LoadingArticle /> component.

* wip

* wip on <Article /> component.

* Added <Article /> component to barrel file.

* Deleted assets from dummy storybook assets folder.

* Updated podcast article story avatar.

* More work on <Article /> component.

* Refactoring Storybook stories.

* Refactored so main component is just the <Article /> component.

* Added a missing video article property.

* Some refactoring of <Article /> component.

* Added Storybook knobs addon.

* Now <Article /> component supports an isBookmarked prop.

* Fixed podcast Storybook story.

* Made the knobs Storybook addon the first tab

* Added more <Article /> Storybook stories.

* More <Article /> component tweaks.

* Added publish time to <Article /> component stories.

* Made the timeAgo function compatible with Preact.

* Added loading="lazy" attribute to <img /> in <Article /> component.

* Added <Article /> Storybook story for past published date.

* Fixed publish date for <Article /> story data.

* Scrapped random avatars.

* Added snapshots for <Article /> component.

* Added snapshots for <LoadingArticle /> component.

* Now test article entities are shared.

* Fixed some wording of Storybook stories.

* Breaking up Article.jsx to make codeclimate happy.

* Now <Article /> component receives icon props.

* Added knobs for <Article /> icon props.

* Added *.stories.jsx to codeclimate exclusion list.

* Added **/*.stories.jsx to codeclimate exclusion list.

* Alright now we have the good glob for excluding Storybook from codeclimate 😆

* Added org headline changes from low hanging fruit PR.

* Updated <Article /> snapshot for org headline.
2020-02-19 11:39:13 -06:00
Nick Taylor
a7dc893f50
Updates to Storybook for home page makeover. (#6130) 2020-02-18 08:42:37 -06:00
Curtis Maloney
8d50956f1a Optimise images (#2966) 2019-05-30 17:37:10 -04:00
Nick Taylor
851bb4e336 Nick/task/onboarding article stories (#392)
* Updated lock file.

* Added an assets folder for Storybook.

* 👷Refactor

* Added some standard prop types for dev.to.

* Extracted onboarding article as it's own component.

* 👷Refactor

* Added Storybook stories for onboarding articles.
2018-06-06 10:29:46 -04:00
Nick Taylor
261b6683b3 Onboarding welcome Storybook stories (#385) 2018-06-05 14:50:30 -04:00
Nick Taylor
6a8df8c8dd Add (P)react Storybook. (#142) 2018-03-26 11:56:32 -04:00