Javi Martín 25e9065913 Use icons with text in admin table actions
In commit 9794ffbbf, we replaced "buttons" with icons in order to make
the admin interface consistent with the planned budget investments
redesign.

However, using icons has some issues. For once, icons like a trash for
the "delete" action might be obvious, but other icons like "confirm
moderation" or "send pending" might be a bit confusing.

It's true that we were adding tooltips on hover. We tried two
approaches: using Foundation's tooltips and using CSS tooltips.

Foundation tooltips are not activated on focus (only on hover), while
CSS tooltips always appear below the icon, which might be a problem when
the icons are at the bottom of the screen (one of our milestone tests
was failing because of that and we can now run it with JavaScript
enabled).

Both Foundation and CSS tooltips have other issues:

* They force users to make an extra step and move the mouse over the
  link just to know what the link is about
* They aren't available on touch screens, so these users will have to
  memorize what each icon does
* They are not hoverable, and making them hoverable would cause a
  different issue because the tooltip might cover links below it, making
  it impossible to click these links without moving the mouse away
  first
* They are not dismissable, which is considered an accessibility issue
  and a requirement in the Web Content Accessibility Guidelines [1]

For all these reasons, we're using both texts and icons. As Thomas
Byttebier said "The best icon is a text label [2]". Heydon Pickering
also makes a point towards providing text alongside icons in his book
"Inclusive Components" [3].

Note that, since we're now adding text and some of the colors we use for
actions are hard to read against a white/gray background, we're making a
few colors darker.

With these changes, actions take more space in the admin table compared
to the space they took in version 1.3, but they are more usable and
accessible while they still take less space than they did in version
1.2.

[1] https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus
[2] https://thomasbyttebier.be/blog/the-best-icon-is-a-text-label
[3] https://inclusive-components.design/tooltips-toggletips/
2021-06-30 14:33:37 +02:00
2021-03-20 19:20:46 +01:00
2015-07-15 13:32:13 +02:00
2021-05-20 16:43:56 +02:00
2015-08-17 19:55:28 +02:00
2021-05-20 16:43:56 +02:00
2021-06-03 17:24:46 +02:00
2020-08-11 12:13:23 +02:00
2019-03-15 10:29:07 +01:00
2021-05-20 16:43:56 +02:00
2021-05-20 18:38:17 +02:00
2021-06-03 17:24:46 +02:00
2021-05-20 16:43:56 +02:00
2021-05-20 16:43:56 +02:00

CONSUL logo

CONSUL

Citizen Participation and Open Government Application

Build status Code Climate Coverage Status Crowdin License: AGPL v3

Accessibility conformance A11y issues checked with Rocket Validator

Join the chat at https://gitter.im/consul/consul Help wanted

Knapsack Pro Parallel CI builds for RSpec tests

This is the opensource code repository of the eParticipation website CONSUL, originally developed for the Madrid City government eParticipation website

Documentation

Check the ongoing documentation at https://docs.consulproject.org to learn more about how to start your own CONSUL fork, install it, customize it and learn to use it from an administrator/maintainer perspective.

CONSUL Project main website

You can access the main website of the project at http://consulproject.org where you can find documentation about the use of the platform, videos, and links to the community space.

Configuration for development and test environments

NOTE: For more detailed instructions check the docs

Prerequisites: install git, Ruby 2.6.7, CMake, pkg-config, shared-mime-info, Node.js and PostgreSQL (>=9.5).

git clone https://github.com/consul/consul.git
cd consul
bundle install
cp config/database.yml.example config/database.yml
cp config/secrets.yml.example config/secrets.yml
bin/rake db:create
bin/rake db:migrate
bin/rake db:dev_seed
RAILS_ENV=test rake db:setup

Run the app locally:

bin/rails s

Run the tests with:

bin/rspec

You can use the default admin user from the seeds file:

user: admin@consul.dev pass: 12345678

But for some actions like voting, you will need a verified user, the seeds file also includes one:

user: verified@consul.dev pass: 12345678

Configuration for production environments

See installer

Current state

Development started on 2015 July 15th. Code was deployed to production on 2015 september 7th to decide.madrid.es. Since then new features are added often. You can take a look at the current features at the project's website and future features at the Roadmap and open issues list.

License

Code published under AFFERO GPL v3 (see LICENSE-AGPLv3.txt)

Contributions

See CONTRIBUTING.md

Description
This is the repository for a demo instance for Nairobi County
Readme 104 MiB
Languages
Ruby 76.1%
HTML 14.6%
SCSS 5.7%
JavaScript 2.3%
Python 1.2%