Commit Graph

337 Commits

Author SHA1 Message Date
Stephen Burgess cca41ea544 Replace inline styles with CSS classes (BEM) (#2338)
* fix(classnames): Status icon style classnames

Take out inline css and put into classnames for the following components: account, avatar, icon button, status action bar, notification.

* fix(status): Move styles from inline to classes for statuses

Move styles to classnames in components.scss for the following components:

display name
media gallery
status
status content
video player

* fix(classnames): Add classnames to rest of components

Take out inline styles and apply them to classnames in the sass for the following components:

button
column back button
slim column back button
collapsable column
dropdown menu
loading indicator
status list

* fix(classnames): Remove all non-dynamic inline styles

Components affected:

autosuggested
permalink
action bar
header
character counter
compose form
emoji dropdown
privacy dropdown
reply indicator
upload form
account auth
followers
getting started
column settings
mutes
settings
reblogs
status checkbox
report
action bar
status
card
boost modal
media modal
video modal

* fix(permalink): Do not lose classname

* fix(tests): Add space back in display name

* fix(status__wrapper): Remove duplicate css name

Remove incorrect style attribute. Remove style attribute all together. Cursor defaults to "auto" when not specified as 'default'.

* fix(nl): do not lose translations
2017-04-23 04:26:55 +02:00
Stephen Burgess 4cfc155560 Improve aria support - Columns and Navigation Drawer Icons (#2299)
* feat(aria): Add aria-labels to underlabelled tab nav items

The drawer tabs which control primary navigation are only labelled by a title which is not available to many screenreaders. Add an aria-label attribute to each link to improve readability with screenreaders. Organize link attributes so link target is first followed by classname.
Issue #1349

* feat(aria): Replace abstract aria role of section with region

Abstract aria roles such as section should not be used in content. Use non-abstract 'region' aria role instead. That role expects an aria-labelledby attribute with an id. Pass an ID to the column header. Remove the aria-label attribute on the ColumnHeader because the same value is output in plaintext as its child.
Issue #1349

* fix(aria): Remove aria-controls attribute until solution is found

Columns do not have wrappers, so these icons can't point to a column wrapper which it controls. Instead these icons function as triggers to show or hide individual columns.
#1349

* fix(typo): Remove type of aria-labelledby instead of aria-label
2017-04-22 17:30:35 +02:00
Akihiko Odaki 5357329454 Fix TabsBar update (#2300)
This change allows to update TabsBar according to route changes.
2017-04-22 17:29:02 +02:00
Ashley 7fea36d155 Added strings for emoji category localization (#2302) 2017-04-22 17:28:36 +02:00
Ashley 6af21daac9 Allowed the emoji picker 'Search...' string to be localized (#2294) 2017-04-22 03:36:33 +02:00
Yamagishi Kazutoshi 1948f9e767 Remove deprecated features at React v15.5 (#1905)
* Remove deprecated features at React v15.5

- [x] React.PropTypes
- [x] react-addons-pure-render-mixin
- [x] react-addons-test-utils

* Uncommented out & Add browserify_rails options

* re-add react-addons-shallow

* Fix syntax error from resolve conflicts

* follow up 59a77923b3
2017-04-21 20:05:35 +02:00
Ash Furrow 78af88e1f4 Hides superluous details on small screens (#2175)
* Hides superluous details on small screans.

* Addressed feedback from #2175.
2017-04-21 18:17:55 +02:00
Andrey Blinov 972f6bc861 Fix Textarea height should be reset upon sending toot #2189 (#2236) 2017-04-20 23:53:54 +02:00
Shel R d2514445e1 Repair most egregious mistakes in onboarding modal (#1964)
* Repair most egregious mistakes

The deployed changes broke the pedagogy and curriculum built into the design of the onboarding modals, which had been reviewed and approved by various other contributors. While the changed layouts of the pages make some of the original decisions impossible to re-implement without substantial work, these changes should at least make the modals not outright terrible. 

The empty confusing description of Mastodon was replaced with an actual basic explanation of federation. The language was modified to be friendly and conversational again. Grammatical errors were fixed. The explanations of local and federated timelines were re-ordered to be in the direct that the menus go, top to bottom, and the sentence was re-added which explains that they are what "public timelines" refers to (since this phrasing is used elsewhere in the UI) and suggests the user use them to discover who to follow. A figure of the profile picture that lives above the compose box was padded to page two to serve as a landmark for less technically literate users to easily find the compose box and understand that the next page is moving upwards, so that they can find the search bar. 

Ideally, the elephant artwork should be either removed or replaced with something less depressing.  Room should be made to point users at the notifications column's settings icon because "how do I turn off the notification noise" is one of the most asked questions of new users and those icons are not easily noticeable. This last part may be made obsolete if the settings UI is later re-worked.

* Change copy

This commit addresses copy change suggestions made in the PR discussion

* Add periods to ends of sentences missing periods
* Made "Home" "Federated" "Local" and "Notifications" lowercase
* Separate explanation of "connecting" and the word "instance" into two sentences, to make the sentence less dense.
2017-04-20 18:20:40 +02:00
Yamagishi Kazutoshi fdb2689a14 Fix PropTypes warning in OnboardingModal (#2191) 2017-04-20 13:22:54 +02:00
Tomohiro Suwa 7832425fdd Fix css for toot button when uploading images (#2161) 2017-04-19 19:21:23 +02:00
matsurai25 30183c0a74 fix search text 'zero' (#2150) 2017-04-19 16:40:24 +02:00
Eugen bfbc2ca0d8 Attachment list for uncached attachments (#2110)
* For undownloaded attachments, set type :unknown, display them as a list in the web UI

* Fix case when attachment type is set explicitly
2017-04-19 15:37:18 +02:00
Isabelle Knott 97012487ed Do not show link preview card if toot has a spoiler (#1617)
* Do not show link preview card if toot has a spoiler

* == to ===
2017-04-19 14:28:00 +02:00
Ash Furrow 9a7ea7c870 Moves from hamburger icon to asterisk. (#2116) 2017-04-19 14:21:14 +02:00
Tomohiro Suwa f23281e31e Disable toot button when above 500 characters (#2088)
* Disable toot button when above 500 characters

* Consider multibyte characters

* Consider spoiler_text
2017-04-18 19:35:55 +02:00
JP DeVries 7525971561 Moving aria-label to div.column (#1769)
* Use landmark regions on columns

Closes mastodon#1720

* Moving aria-label to div.column
2017-04-18 17:21:25 +02:00
Andrey Blinov 880590ad0d Fix header icons in navigation bar (#2081) 2017-04-18 15:57:16 +02:00
geta6 75910abd8f Add hasMore field to account timeline (#2066) 2017-04-18 13:10:49 +02:00
Eugen Rochko 42d54dc9ea Adjust visuals of non-autoplaying GIFV 2017-04-18 01:57:50 +02:00
Eugen Rochko 57d784f1e4 Merge branch 'pause-gif' of git://github.com/patf/mastodon into patf-pause-gif 2017-04-18 01:25:50 +02:00
Patrick Figel ffb99325ca Add gif auto-play/pause preference
This introduces a new per-user preference called
"Auto-play animated GIFs", which is enabled by default. When a
user disables this setting, gifs in toots become click-to-play.

Previews of animated gifs were changed to display the video play
button so that users can distinguish them from regular images.

This setting also affects account avatars in the detailed account
view, which was changed to use the same hover-to-play mechanism
that is used for animated avatars in timelines.

Fixes #1652
2017-04-17 12:14:03 +02:00
usagi-f b87a08e160 Add function color remaining text (#1980) 2017-04-17 10:34:33 +02:00
Eugen 6d70a80263 Onboarding modal (#1883)
* Basic onboarding modal that's shown to users once

* Lay out pages 2 through 5, add images, style modals (#1509)

* Lay out pages 2 through 5

Added images and laid out pages 2 through 5 in the jsx file. SCSS will
come, still working on just seeing if this works at all.

* Fix jsx errors, add images to modal pages, style modal pages

* Add animations to onboarding pager changes, improve wording and styling

* Finishing touches on the onboarding

* Add missing propTypes

* Update wording
2017-04-16 20:32:00 +02:00
abcang 90760eae4c fix regex filter (#1845)
* fix regex filter

* fixed br to linebreak and, stlip tags.

* change to send raw content

* changed to unescape in reducer
2017-04-16 16:33:38 +02:00
Eugen e332552816 Indicate when a toot is part of a chain with a "reply all" icon (#1869) 2017-04-15 22:48:41 +02:00
Henry Smith b7ec2fd492 Fix function call name typo (#1851) 2017-04-15 16:41:22 +02:00
Zac Anger f4045ba3d9 Add eslint-plugin-jsx-a11y (#1651)
* Add eslint-plugin-jsx-a11y.

* Fix npm script.

* Adjust npm scripts so test also runs lint.

* Fix existing lint errors.

* Don't break on a11y issues.

* Add role and tabIndex.

* Add vim and Mac files to .gitignore and .dockerignore.

* Handle htmlFor (partially), a that's actually a button.

* Fix missing tabIndex.

* Add cursor:pointer to load-more

* Revert change to load_more.

* Fixes based on review.

* Update yarn.lock.

* Don't try to install fsevents on Linux (hides warning noise).
2017-04-15 13:27:27 +02:00
Alda Marteau-Hardi bddd36f260 Add a classname to the loading bar (#1826) 2017-04-15 13:17:54 +02:00
Koala Yeung 08059ddda9 jslint: fix jslint warnings (#1704)
* jslint: remove trailing space

* jslint: fix no-nested-ternary issue

Follow the jslint [no-nested-ternary](http://eslint.org/docs/rules/no-nested-ternary)
rule. Rewritten ternary with if-then.
2017-04-15 02:57:26 +02:00
Joachim Viide ef879a8839 Send initial state in a <script type="application/json"> tag (#1806) 2017-04-15 02:32:42 +02:00
Patrick Figel fe8dd58bc1 Add list of muted user to UI and Getting Started (#1799)
Add the same UI that already exists for blocked users for muted
ones and add it to the "Getting Started" menu.
2017-04-15 01:23:49 +02:00
JP DeVries 1467515d3d Use landmark regions on columns (#1732)
Closes mastodon#1720
2017-04-14 11:12:59 +02:00
Eugen c5afe573da Fix drag & drop overlay not appearing on firefox (#1721) 2017-04-13 22:21:34 +02:00
Eugen ac54da9394 Fix #1220, fix #1671 - Hook up comment box to the Redux comment value (#1699)
Fix username styling regression introduced in #1063
Fix report screen background regression introduced in #1415
2017-04-13 19:36:41 +02:00
Koala Yeung ce80d0b0a9 Fix minor jslint issue (#1697)
* Undefined propType in react component `ColumnSettings`.
  Add proper PropTypes definition.
2017-04-13 17:10:48 +02:00
Eugen Rochko 5f8155482a Add overlay style to buttons, continue video after expanding it 2017-04-13 17:01:09 +02:00
blackle 00cc3066a2 Allow video to be expanded into lightbox 2017-04-13 09:09:45 -04:00
Koala Yeung faefd8ec8f Update javascript English translation files and some defaultValue (#1676)
* Reorder javascript English locale file

 * Reorder translation string in order of the locale key.

* Add javascript English locale missing language keys

 * Search all javascript language keys by command:
   `grep -REho '<FormattedMessage .*\/>' ./app/assets/javascripts/.`

 * Add all the missing language keys and their values to `en.jsx`.

* Add javascript English locale missing language keys (2)

* Find all `defineMessages` calls with this command:
  `grep -Rl 'defineMessages({.*' ./app/assets/javascripts/.`

* Open all these files. Find the language key (`id`) in these
  statements.

* Add all the missing language keys and their values to `en.jsx`.

* Remove javascript English locale obsoleted language keys

 * Find all language keys that no longer exists in the source code
  and remove them. The removed keys include:

    * "compose_form.private"
    * "compose_form.unlisted"
    * "getting_started.about_addressing"
    * "getting_started.about_shortcuts"
    * "notification.mention"
    * "search.account"
    * "search.hashtag"
    * "tabs_bar.mentions"
    * "tabs_bar.public"

* Javascript English locale file add note

 * Add notes to contributors about the English translation files.
   Hope that will make translation process smoother.

* Update javascript locale defaultValue in code

 * Update the defaultValue in code according to the relevant
   translation in English locale file.
2017-04-13 12:57:41 +02:00
Isabelle Knott 1ea662963f Use shift+click instead of alt+click to bypass boost dialog (#1638) 2017-04-13 02:15:45 +02:00
lindwurm ee69ece7b5 [web] Moving docs link to tootsuite/documentation (#1581)
related: 1236529e39 and fc47c1d00e

Signed-off-by: lindwurm <lindwurm.q@gmail.com>
2017-04-12 17:13:19 +02:00
Eugen 8ead070b94 Improve emoji picker look (#1493)
* Improve emoji picker look

* Add hover animation to emojis in picker
2017-04-11 23:23:34 +02:00
Eugen b22b2cbfac Fix #1491 - Fix broken notifications, broken Link header parsing for exclude_types (#1548) 2017-04-11 22:53:58 +02:00
Henry Smith 1921c5416b Fix console error when scrolling a column with no scrollable content (#1574) 2017-04-11 21:58:28 +02:00
Eugen Rochko 960181fd99 Fix look of the modals 2017-04-11 21:24:17 +02:00
Eugen Rochko 2a7602cad4 Merge branch 'master' of https://github.com/blackle/mastodon into blackle-master 2017-04-11 20:43:56 +02:00
blackle 06444bf050 Allow user to disable the boost confirm dialog in preferences 2017-04-11 10:10:16 -04:00
blackle f53fb6aa66 Bypass boost confirm modal if alt is pressed 2017-04-11 08:34:14 -04:00
blackle 01e5447e35 Add boost confirm modal 2017-04-10 22:35:55 -04:00
Eugen 12f72e1740 When avatar/header are GIF, generate static versions (#1428)
* When avatar/header are GIF, generate static versions.
Account API returns "avatar"/"avatar_static", "header"/"header_static"
Static version is the same as original for other cases
Web UI de-animates avatars in toots, lists of users

Fix #441, fix #596, prerequisite for #1064

* Fix JS test

* Add rake task to generate static avatars/headers from GIF ones, add test
2017-04-11 00:38:58 +02:00