Commit graph

117 commits

Author SHA1 Message Date
Suzanne Aitchison
ad5caa1f67
remove extra margin (#14086) 2021-06-29 07:01:03 +02:00
Suzanne Aitchison
845a5fade5
Profile Preview Cards (RFC#222) - author name in comments (#14056)
* show dropdowns on pre-existing comments

* show preview on comments, v rough version of showing preview on recently added comments

* tidy up error, add some comments

* show the ama icon when appropriate

* add to comment on article cypress spec

* add test for preview card on article comment

* tidy up

* small refactors

* wait for button init in cypress test

* add test for article author byline on organization post

* Trigger CI builds

* Trigger CI builds
2021-06-25 10:05:37 +01:00
Suzanne Aitchison
7e322e4f7b
Optimise dropdowns for accessibility - Post comments and share (#13868)
* WIP - basic init of comment dropdowns with open and close on click

* WIP - initialize the share dropdown

* initialize all post dropdowns within packs, init copy to clipboard announcer

* refactor and add JSDocs to helper

* undo changes to base jsx

* update accessible name of post actions button in cypress test

* make sure dropdowns pack loaded on comment index page

* undo prettier changes in base jsx

* undo prettier changes in base jsx

* initialize comment dropdowns in podcasts

* add test for the post actions

* add article comment tests

* add cypress tests for comment dropdowns
2021-06-03 09:13:17 +01:00
Dan Wallis
521bb09394
Add loading=lazy to image tags (#10888)
* Add loading=lazy to image tags

* Fix test

* Lazy-load some obvious templates

* Lazy-load more verified templates
2021-05-27 19:01:21 +02:00
Suzanne Aitchison
4aebfb62f2
Improve keyboard accessibility of comment rate limit and error modals (#13536)
* add modal code to Forem namespace, use showModal in the rate limit modal generator

* add cypress tests for both modals

* styling tweaks

* tidy up

* make sure modal trap selector is unique to page, update Modal JSDoc

* add additional jest test for focusTrapSelector
2021-05-03 07:14:23 +01:00
Nick Taylor
aee1d041d6
Fixed aria label for edit menu item of a comment. (#13594) 2021-04-30 11:28:47 +02:00
Suzanne Aitchison
9a693d3ac6
add skip link to tag page (#13485) 2021-04-23 16:10:28 +01:00
Suzanne Aitchison
5bed8f56d4
improve keyboard accessibility of modals 12427 10610 (#12511)
* adds focusTrap wrapper to preact Modal component

* add view specific code for focus trap in admin add nav link

* add script to return a focustrap toggle, use in add nav link modal partial

* add trap to edit nav link modal

* add handlers for sign up modal

* update modal controller for admin section, update nav link modals to use

* update other admin modals with new data values for trap

* remove unneeded erb script file

* remove unneeded target

* refactor to remove extra unneeded param

* remove duplicate code, store getFocusTrapToggle in window

* trap focus in comment and bookmark showModal instances for not logged in user

* remove need for activator id

* clean up id refs no longer needed

* remove custom code and re-use focsu-trap lib

* update storybook docs

* update default export in focusTrap

* prevent close button click triggering a modal toggle twice

* ensure if user navigates from a modal the trap is deactivated

* add jsdoc comments and add dynamic import

* ensure admin controller modal traps are cleaned up on disconnect

* update sign up modal to use crayons

* update modal controller and admin nav links modals to use preact modal

* update profile fields modals for new controller

* tweak styling of sign up and admin modals to match previous

* update listings modal to use crayons modal, adapt focus trap to work with click outside

* memoize deactivate callback to ensure modal can be presented on first page load

* add missed focustrap changes

* fix focus trap issues in onboarding flow

* refactor onboarding focus trap, remove getFocusTrapToggle

* tweaks for styling and article modal toggle

* add click outside tests to modal

* add cypress tests for the login modal

* update liquid tag tests affected by change

* refactors to address review comments

* fix issue with login modal presented twice on comment add

* change ids to selectors in admin modals

* small pr comment refactors

* add listings e2e tests

* add nav link modal tests

* fix issue with help modal

* tweak to fix ui bug from merge

* remove context from showLoginModal

* rename toggleModal

* rename state property for clarity

Co-authored-by: Nick Taylor <nick@dev.to>
2021-02-24 16:01:10 +00:00
Jacob Herrington
0c6f4113f2
Fix irregular comment count buttons (#12724)
* Fix irregular comment count buttons

* Fix irregular comments button on tag and user page

* Add regression tests for irregular comment buttons
2021-02-22 12:11:44 -06:00
Dan Ott
544fa8d33e
Fixing gap property for all occurrences of flex to work in Safari (#12667)
* Use grid instead of flex

* Use child margin instead of flex gap

* use .grid instead of .flex.flex-column

* Missed one conditional flex gap

* gap-2 safely deleted since there’s only one element

* Add class for crayons-btn-actions

This pattern occurs pretty often. Easy class addition and easy swap out once flex gap is supported in target browsers

* Use crayons-btn-actions

* Adjust styling to use negative margins

* apply crayons-btn-actions

* use margin-right instead of gap

* use .grid instead of .flex.flex-column

* use margin instead of gap for indicators/tooltips in headings

* remove unused class for clarity

* use flex and add margin to small element

* remove gap from flex container and add margin to figure

* crayons-article__main has neither flex nor grid thus gap has no effect

* fix typo

* use actual grid columns

* use gap instead of flex-column

* Apply crayons-btn-actions

* Fix modal window display

* Safari bein a real pain here

Apparently Safari uses a different model to calculate height than other browsers. who knew.
2021-02-17 11:40:38 +01:00
Arit Amana
23f3386f3f
Don't display '0 reactions' on article feed (#12425)
* Implement for Feed Card only

* update snapshot

* write tests

* Implement changes in other article-feed-card views

* modify failing spec

* Address code review comments
2021-01-27 11:13:10 -05:00
Ben Halpern
c668496e9a
Remove swipe gestures and other unnecessary code (#12027) 2020-12-30 12:17:29 -05:00
Mac Siri
ab95635dc6
Filter XSS in navigationLink's title (#12003) 2020-12-22 12:05:41 +01:00
Marcy Sutton
b04b5bcb57
Headings and alt text roundup (#11721)
* Adjust heading order

No skipping levels, adding an h1 for the homepage

* Add missing image alt text

* Update after PR review

* Update test snapshot

Co-authored-by: rhymes <rhymes@hey.com>
2020-12-04 09:41:45 -05:00
Nick Taylor
bf7780cd2c
Ran prettier on *.js, *.jsx and *.md files. (#11586) 2020-11-23 20:45:50 -05:00
Rafi
f88bf5a0b1
Fixing overflow of comment button (#11562) 2020-11-23 12:17:30 +01:00
ludwiczakpawel
70706d0a62
Comments UI update (#11283)
* tooltips 1.0.1

* tooltips 1.0.1

* init

* .

* drop not needed files

* .

* init

* init

* .

* comments

* border

* missing bits

* build comment JS

* .

* .

* specs

* sloan avatar fix

* bunch of fixes

* specs and fixes

* specs

* .

* swap order of links

* contrast

* js for dropdown

* icons

* op-author

* three dots icon

* reverts

* test: capybara- make sure that we click the dropdown before clicking on edit

* permalink --> link

* tiny fixes

* aria-label on form

* proper alt on user's avatar

* aria has popup

* use UL > LI instead of DIV

* add aria-labels to dropdown items

* another aria-label

* better links: nav

* contrast

Co-authored-by: Ridhwana <ridhwana.khan16@gmail.com>
2020-11-18 18:21:19 -05:00
Robin Gagnon
4fabc3a5e6
fix: Add hidden navigation link to article HTML (#11465) 2020-11-18 14:50:19 +01:00
Fernando Valverde
449cf89737
Uses template literals to more clearly interpolate a complex string in buildArticleHTML.js (#11457) 2020-11-17 14:45:32 -06:00
rhymes
f9506affb5
Use faster JS selection methods (#11409)
* Add JS tips section to frontend documentation

* Replace document.getElementsByTagName('body') with document.body

* Replace querySelectorAll with faster selecting methods where appropriate

* Replace querySelector with faster selecting methods where appropriate

* Fix typo

* Fix forEach and getElementsByClassName

* Change querySelector* to faster methods in erb files

* Change querySelector* to faster methods in ruby files

* Fix runkit tag

* Various fixes

* Update app/assets/javascripts/initializers/initializeEllipsisMenu.js

Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>

* Update app/assets/javascripts/utilities/slideSidebar.js

Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>

* Commenting out flaky spec

Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
2020-11-16 17:35:50 +01:00
rhymes
f8f3795b88
Remove mascot from JS template for modals (#11388) 2020-11-12 14:58:50 +01:00
Lisa Sy
3fd6aa5c89
Update rate limit modal (#11344) 2020-11-11 18:10:20 -05:00
Nizar
7058d628af
Added Copy Permalink Functionality to Comment Dropdown (#8311)
* Added Copy Permalink Functionality to Comment Dropdown

Copy functionality is similar to the way 'copy article link' is implemented. It checks for the android bridge first, then the navigator, then fallsback to the default document copy command

Since the codes were really similar, I moved the copy functionality to a function of its own with callbacks and fallbacks as lambdas, and triggered it with the copyArticleLink and the copyPermalink

* Replaced Copy Permalink Callbacks with Promises

* Keep anchor tags instead of buttons (#1)

* copy permalink using anchor tag

* Missing closing button tag

* Adds 'Copied to Clipboard' Snackbar Message

* Patches bug introduced in #10323

Patch suggested in following comment: https://github.com/forem/forem/pull/8311\#pullrequestreview-492011202

* Removes import statement for addSnackbarItem and Suppresses ESLint Error

Initializer runs in global scope

* Unhandles exception when copying permalink so Honeybadger can handle it

* Replaces ButtonListener suffix for copyPermalink method with Listener

Co-authored-by: Fernando Valverde <fernando@visualcosita.com>
2020-11-11 08:32:10 -05:00
Robin Gagnon
27a3df7d73
A11y: Add keyboard navigation to article feed (#10468)
Co-authored-by: Andrew Bone <AndrewB05@gmail.com>
Co-authored-by: Nick Taylor <nick@dev.to>
2020-11-10 22:38:15 -05:00
Arit Amana
08796b5cee
[Team Email Login] Refactor Authentication Provider Enable/Disable (#11185)
* Starting out

* Building away...

* Hooking buttons up

* Hook Auth Provider buttons to Array Field

* trying to fix NoNameError

* Remains InviteOnlyMode disable and tests

* Smashing remaining tasks

* Last of tasks

* add tests

* Complete specs and tests 😅

* Fix bug

* Additional guard

* pass event to functions

* Position Email Auth first

* Fix bug in Email Auth Modal

* Fix spacing issue

* Update docs for adminModal.js

* Show/hide Enabled Indicator with Enable/Undo buttons

* Complete Auth Providers functionality

* Update app/javascript/admin/controllers/config_controller.js

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

* Update app/javascript/admin/controllers/config_controller.js

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

* Update app/controllers/admin/configs_controller.rb

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

* Update helper names

* better implementation of EnabledIndicator show/hide

* Small copy changes

* Update spec/helpers/authentication_helper_spec.rb

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

* Update app/views/admin/configs/show.html.erb

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

* Update app/helpers/authentication_helper.rb

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

Co-authored-by: Vaidehi Joshi <vaidehi.sj@gmail.com>
2020-11-06 18:19:34 -05:00
Josh Puetz
542ee58ab8
Rate Limit Modal - Comments (#11102)
* Non-preact modal

* Some cleanup

* Toggle modal on navigation

* Use rate limit modal on comments page

* Added JSdocs

* Remove explanation link

* Comment rate limit test

* Tests and method renaming
2020-11-03 15:49:20 -06:00
ludwiczakpawel
1636bdf4c8
Autoresize on comment textarea + comment submit on CMD/CTRL+Return (#11115)
* .

* whoops

* revert typo

* Handle glitches and edge cases.

Co-authored-by: Ben Halpern <bendhalpern@gmail.com>
2020-10-29 09:33:11 +01:00
Robin Gagnon
10d7da2878
feat: Add shortcut to bookmark an article (#11116) 2020-10-27 12:44:03 -04:00
Akshay Mahajan
ff918daa20
Remove flare tag from title and hightlight it within the tags row (#10528)
* Remove flare tag from title and hightlight it within the tags row

* wrap flare tag # in a span with class crayons-tag__prefix

* updated buildArticleHTML.js to show flare tag in the tags row

* updated _single_story.html.erb to show flare tag in the tags row

* fixed missing opening tag

* removed crayons-story__flare-tag class and containers

* added .crayons-story__flare-tag back to stories.scss for search results

* added check for undefined tagList in buildArticleHTML.js
2020-10-15 16:09:14 +02:00
ludwiczakpawel
1375e8a4df
[deploy] Redesigned Comment Form (#10355)
* init

* .

* .

* better

* last bits

* specs

* merge

* fix response templates for replies

* copy

* active inactive buttons + cleanup

* labels

* specs

* specs

* response templates fix

* ....

* wtf

* .
2020-10-05 12:01:48 +02:00
ludwiczakpawel
4bf69e64c5
Update search menu to use Crayons styling, v2 (#10347)
* Replace old query style with crayons link block

* Add Crayons layout

* Rename nav file and refactor how it's referenced in parent file

* Rename sidebar file

* style updates

* more changes

* podcasts

* .

* code format

Co-authored-by: Lisa Sy <lisasyis@gmail.com>
2020-09-16 22:03:34 +02:00
Ben Halpern
3e09a7768f
[deploy] Remove need for ENV vars during asset precompile (#10349)
* Remove need for ENV vars during asset precompile

* Add open-search test
2020-09-16 13:57:05 -04:00
Rafi
ea74a3d390
Using global util function for displaying date in listing dashboard (#10244)
* Common date util function for listing dashboard

* Making dateTime required

* Fixing typo

* Fixing tests

* Fixing deletion of function in globalThis
2020-09-09 09:35:05 +02:00
ludwiczakpawel
503b1e3be6
Remove dimmed buttons on feed (#9894)
* flare tag line height

* .

* dropdown fix + actions bar fix

* actions bar on mob

* fix
2020-08-26 08:08:31 +02:00
Lisa Sy
aea5615a8e
Style logged-out authentication modal (#9827)
* WIP Update modal styling

* Update styles of logged out auth modal

Co-authored-by: Ben Halpern <bendhalpern@gmail.com>
2020-08-18 17:38:08 +02:00
ludwiczakpawel
dbbe158d21
Buttons: Ghost Dimmed (#9626)
* flare tag line height

* .

* dropdown fix + actions bar fix

* actions bar on mob

* ghost dimmed

* add to page/crayons
2020-08-06 11:03:06 +02:00
Ben Halpern
2deadc2385
Change three-dots svg (#8746) 2020-06-17 15:53:55 -04:00
ludwiczakpawel
16f4d7d46a
[deploy] Article Design update (#8234)
* flare tag line height

* .

* init

* widgets

* widgets lists

* new tabs on home

* instantclick

* .

* rethinking css

* .

* .

* empty space

* init

* campaign widget

* .

* merge

* .

* update layout

* fix sidebars on home page

* .

* fix onboarding x

* test

* spec

* test

* toolbar fix

* more

* test

* better handling ads

* .

* spec

* card border

* .

* .

* actions bar

* cleanup

* animation

* test

* button width

* .

* better responsiveness and author boxes

* meta info

* padding

* better animation

* optimize videos

* fixes

* spec

* .

* codeblocks in comments

* whoops

* Use .present? correctly as it preloads items

* sticky nav

* Update app/views/articles/_sticky_nav.html.erb

I don't know what I'm doing but @benhalpern says so! e8c0f337a5 (r440248874)

Co-authored-by: Ben Halpern <bendhalpern@gmail.com>

* Update app/views/articles/show.html.erb

I don't know what I'm doing but @benhalpern says so! e8c0f337a5 (r440247802)

Co-authored-by: Ben Halpern <bendhalpern@gmail.com>

* little fixes

* Update app/assets/stylesheets/article-show.scss

Co-authored-by: Ben Halpern <bendhalpern@gmail.com>

* pawel updating ruby code......

* actually better merge

* semantic updates

* .

Co-authored-by: rhymes <rhymesete@gmail.com>
Co-authored-by: Ben Halpern <bendhalpern@gmail.com>
2020-06-17 09:57:57 -04:00
icncsx
d86b9d9ce5
Replace querySelector and getElementsByTagName when selecting for head and body (#8315)
Co-authored-by: Ben Halpern <bendhalpern@gmail.com>
2020-06-08 20:08:40 -04:00
rhymes
ce28c0b5e5
[deploy] Remove ERB pre-processing from pure JS files and cleanup (#8030) 2020-05-27 08:25:39 -05:00
Andy Zhao
c42fd3461e
[deploy] Rename positive_reactions_count to public_reactions_count in logic (#7926)
* Rename positive_reactions_count to public_reactions_count

* Add positive reactions count back in so we can remove it

* Use public_category method for reactions

* Add positive_reactions_count in case any old caches rely on it

* Add positive_rxn_count to account for API endpoints

* Remove unused method

* One more spot...

* Add method back in because of caches

* Update specs to match new functionality

* Fix typo

* Remove unused methods
2020-05-26 12:36:28 -04:00
Mac Siri
9c58ebc61e
[deploy] Apply HTML encoder to FeedContent's query (#7985)
* Use .textContent to apply Search Snippets

* Improve var name

* Apply HTML encoder to FeedContent's query

* Add spec

* Expand FeedContent specs

* Actually let's not use approval
2020-05-25 13:06:35 -04:00
Dmitry Maksyoma
f63c7f9289
Fix Runkit tags not being activated when comment is added (#6767)
* Fix Runkit tags not being activated when comment is added

* Runkit tag activation was ran once, on page load. I've changed it to
  run on on comment preview and submit.
* It was necessary to add a check to skip already activated Runkit
  tags. The code didn't take into account that a tag could be already
  processed, and would just crash.

* Fix Runkit tags and add tests

* Add test for previewing article with Runkit tag

* "Fix CodeClimate not finding waitForRunkitAndActivateTags()

* Refactor a test for readability

* Make Rubocop happy

* Improve test for previewing article with Runkit tag

* Use one method for determining active Runkit tags

* Defer loading of JS from embed.runkit.com

* Add utility function dynamicallyLoadScript(url)

* Switch to dynamic loading of Runkit

* parsed content code block is also hidden now to avoid displaying <code /> block before runkit iframe loads.

* Fix Runkit test

* Remove Runkit script caching in v2 form

* Use <%== instead of .html_safe in v2 form

* Update app/assets/javascripts/utilities/dynamicallyLoadScript.js

Co-authored-by: Nick Taylor <nick@iamdeveloper.com>

Co-authored-by: Nick Taylor <nick@iamdeveloper.com>
2020-05-15 14:27:46 +02:00
ludwiczakpawel
5cc0821b71
Hotfix video icon in feed (#7792)
* hotfix video

* test
2020-05-13 09:40:39 -04:00
Josh Puetz
2abe830377
[deploy] Home Page Feed redesign + top comments (#7579)
* feed cards

* frontend

* preactify

* preactify

* .

* fix

* fixing things and adding dropdown

* whoops.

* whoops 2.

* revert body bg color change

* search snippet

* search snippet

* get rid of featured article

* get rid of featured article...

* cover to its own component

* videos

* videos

* reading time

* small-save-filled asset

* author adjustments

* adjustments

* Author --> Meta

* whoops.

* loader

* logged out state

* .

* dropping what's not needed for now

* better name for cover

* get rid of nav overflow

* bringin comments placeholder back

* bringing comments placeholder back

* publish date

* fix

* date

* .

* save button icon

* ghost button

* lets skip the icon for saving for now

* more buttons

* counting logic

* Display top comments on homepage feed

* Comment list and item components

* Remove 'Top Comments' title

* Remove subscribe button, add reading time

* Update snapshots and tests

* Fix article and follower scrolling

* Added reading time

* (Try) to do flare tags

* Button component from Pawel

* More button styles from Pawel

* Comment count style from Pawel

* Handle empty parens for age on older articles

* Dont show 'more comment' button for more than 2 comments

* cover ratio

* flare tag

* cover fix

* fix buttons

* more button fixes

* tags fix

* responsiveness fix

* reading time  + a bit of responsiveness

* Reading time in more places

* snapshots

* default color for flare tag

* Update CommentsList test snapshot with new styles

* fixing search results

* fixing buttons

* Fix podcast card tests by updating snapshots

* Line clamping for top comments

* Reflect save button state after click before mouseout

* Now the entire feed card is clickable. (#7638)

* Now pointer cursor is only on feed posts. (#7727)

* Revert podcast card styling

* Update test snapshot

* merge

* Fix rspec on feed page

* Reduce complexity of class check for feed card clicking

* PR feedback/fixes

* Fix featured article test and snapshot

* Last minute test tweaks

* clean up crayons

* padding issue + empty div

* Correct merge error

* Fix search results tests

* Test fixes and snapshot updates

* themes

* podcasts colors

Co-authored-by: ludwiczakpawel <ludwiczakpawel@gmail.com>
Co-authored-by: Nick Taylor <nick@iamdeveloper.com>
2020-05-12 07:57:57 -05:00
Molly Struve
ea1d38d3b8
[deploy] Bulk Fetch Follow Button Data for Users (#7676) 2020-05-08 13:58:58 -05:00
Andy Zhao
fded16b8dc
[deploy] Add a more helpful msg for response templates (#7543) 2020-04-27 13:28:28 -04:00
Ridhwana
a2f1a0049f
Removal of morrrre hardcoded dev.to links (#7390)
* feat: remove 90% of hardcoded dev.to links now

* chore: update tests

* chore: implement suggested changes

* chore: update url

* chore: update to use URL helper
2020-04-21 11:50:18 +02:00
Ben Halpern
2171fe3255
[deploy] Add missing parentheses to video html (#7379) 2020-04-18 16:34:48 -04:00
Ben Halpern
3d4944ebae
[deploy] Add video duration to search results (#7377) 2020-04-18 15:16:38 -04:00