diff --git a/.gitignore b/.gitignore index aebd7c9ecef..b18320e46b5 100644 --- a/.gitignore +++ b/.gitignore @@ -50,11 +50,17 @@ Vagrantfile /kitchen/cookbooks /log/* /private_certs/* +/public/*.ico +/public/*.png +/public/*.svg +/public/browserconfig.xml +/public/manifest.json /public/system /public/user_flows /spec/tmp /test /tmp/* +/vendor/assets/fonts /vendor/bundle /node_modules diff --git a/.reek b/.reek index d3182612dcd..ddb112d50fc 100644 --- a/.reek +++ b/.reek @@ -106,7 +106,6 @@ UtilityFunction: - WorkerHealthChecker::Middleware#call - UserEncryptedAttributeOverrides#create_fingerprint - LocaleHelper#locale_url_param - - Verify::Base#mock_vendor_partial - IdvSession#timed_out_vendor_error 'app/controllers': InstanceVariableAssumption: @@ -115,6 +114,7 @@ UtilityFunction: ControlParameter: exclude: - complete_idv_session + - visit_idp_from_sp_with_loa3 DuplicateMethodCall: enabled: false FeatureEnvy: @@ -137,7 +137,9 @@ UtilityFunction: UncommunicativeMethodName: exclude: - visit_idp_from_sp_with_loa1 + - visit_idp_from_sp_with_loa3 - visit_idp_from_mobile_app_with_loa1 + - visit_idp_from_oidc_sp_with_loa3 UncommunicativeParameterName: exclude: - begin_sign_up_with_sp_and_loa diff --git a/.snyk b/.snyk new file mode 100644 index 00000000000..07a3827ae46 --- /dev/null +++ b/.snyk @@ -0,0 +1,10 @@ +version: v1.38.1 +ignore: + 'SNYK-RUBY-NOKOGIRI-20299': + - '* > nokogiri': + reason: 'We do not opt in to DTDLOAD and do not opt out of NONET' + expires: '2018-01-01T00:00:00.000Z' + 'SNYK-RUBY-ACTIONCABLE-20338': + - '* > actioncable': + reason: 'We do not use actioncable' + expires: '2017-09-10T00:00:00.000Z' diff --git a/.travis.yml b/.travis.yml index 6c27c2712e0..a8d124fb2ba 100644 --- a/.travis.yml +++ b/.travis.yml @@ -14,6 +14,7 @@ before_install: - nvm install stable - nvm use stable - npm install + - npm run build # Install PhantomJS 2.1.1 manually - "export PHANTOMJS_VERSION=2.1.1" - "phantomjs --version" diff --git a/Dockerfile b/Dockerfile index 75f3b3a2a9b..747766aa4a1 100644 --- a/Dockerfile +++ b/Dockerfile @@ -24,6 +24,7 @@ WORKDIR /upaya COPY package.json /upaya RUN npm install +RUN npm run build COPY Gemfile /upaya COPY Gemfile.lock /upaya diff --git a/Gemfile b/Gemfile index cebbb9caaeb..00cf77b0301 100644 --- a/Gemfile +++ b/Gemfile @@ -3,7 +3,7 @@ git_source(:github) { |repo_name| "https://github.com/#{repo_name}.git" } ruby '~> 2.3.3' -gem 'rails', '~> 4.2.6' +gem 'rails', '~> 5.1.3' gem 'ahoy_matey' gem 'american_date' @@ -12,7 +12,6 @@ gem 'base32-crockford' gem 'browserify-rails' gem 'device_detector' gem 'devise', '~> 4.1' -gem 'devise_security_extension' gem 'dotiw' gem 'figaro' gem 'foundation_emails' @@ -38,7 +37,7 @@ gem 'redis-session-store', github: '18F/redis-session-store', branch: 'master' gem 'rqrcode' gem 'ruby-progressbar' gem 'ruby-saml' -gem 'saml_idp', git: 'https://github.com/18F/saml_idp.git', tag: 'v0.4.1-18f' +gem 'saml_idp', git: 'https://github.com/18F/saml_idp.git', tag: 'v0.4.3-18f' gem 'sass-rails', '~> 5.0' gem 'savon' gem 'scrypt' @@ -74,7 +73,6 @@ group :development do gem 'fasterer', require: false gem 'guard-rspec', require: false gem 'overcommit', require: false - gem 'quiet_assets' gem 'rack-mini-profiler', require: false gem 'rails-erd' gem 'rails_layout' @@ -86,7 +84,6 @@ group :development, :test do gem 'bullet' gem 'front_matter_parser' gem 'i18n-tasks' - gem 'mailcatcher', require: false gem 'pry-byebug' gem 'rspec-rails', '~> 3.5.2' gem 'slim_lint' @@ -106,8 +103,8 @@ group :test do gem 'poltergeist' gem 'rack-test' gem 'rack_session_access' + gem 'rails-controller-testing' gem 'shoulda-matchers', '~> 3.0', require: false - gem 'test_after_commit' gem 'timecop' gem 'webmock' gem 'zonebie' diff --git a/Gemfile.lock b/Gemfile.lock index 5597dc22c35..9ecc2a0fdc9 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -20,19 +20,19 @@ GIT GIT remote: https://github.com/18F/redis-session-store.git - revision: 101df477da93d47cbd61fe0ead8ddca6c60ce48e + revision: 7400dcc1c12f458da5c5dabb0fdc7ca789a66f0b branch: master specs: redis-session-store (0.9.1) - actionpack (>= 3, < 5.1) + actionpack (>= 3, < 5.2) redis (~> 3) GIT remote: https://github.com/18F/saml_idp.git - revision: 9c1a308bb0c454bd603218f1f156a45a69cb50f2 - tag: v0.4.1-18f + revision: f9917394698a3671e08058cf743e25a276887a79 + tag: v0.4.3-18f specs: - saml_idp (0.4.0) + saml_idp (0.4.3.pre.18f) activesupport builder httparty @@ -62,39 +62,42 @@ GIT GEM remote: https://rubygems.org/ specs: - actionmailer (4.2.8) - actionpack (= 4.2.8) - actionview (= 4.2.8) - activejob (= 4.2.8) + actioncable (5.1.3) + actionpack (= 5.1.3) + nio4r (~> 2.0) + websocket-driver (~> 0.6.1) + actionmailer (5.1.3) + actionpack (= 5.1.3) + actionview (= 5.1.3) + activejob (= 5.1.3) mail (~> 2.5, >= 2.5.4) - rails-dom-testing (~> 1.0, >= 1.0.5) - actionpack (4.2.8) - actionview (= 4.2.8) - activesupport (= 4.2.8) - rack (~> 1.6) - rack-test (~> 0.6.2) - rails-dom-testing (~> 1.0, >= 1.0.5) + rails-dom-testing (~> 2.0) + actionpack (5.1.3) + actionview (= 5.1.3) + activesupport (= 5.1.3) + rack (~> 2.0) + rack-test (~> 0.6.3) + rails-dom-testing (~> 2.0) rails-html-sanitizer (~> 1.0, >= 1.0.2) - actionview (4.2.8) - activesupport (= 4.2.8) + actionview (5.1.3) + activesupport (= 5.1.3) builder (~> 3.1) - erubis (~> 2.7.0) - rails-dom-testing (~> 1.0, >= 1.0.5) + erubi (~> 1.4) + rails-dom-testing (~> 2.0) rails-html-sanitizer (~> 1.0, >= 1.0.3) - activejob (4.2.8) - activesupport (= 4.2.8) - globalid (>= 0.3.0) - activemodel (4.2.8) - activesupport (= 4.2.8) - builder (~> 3.1) - activerecord (4.2.8) - activemodel (= 4.2.8) - activesupport (= 4.2.8) - arel (~> 6.0) - activesupport (4.2.8) + activejob (5.1.3) + activesupport (= 5.1.3) + globalid (>= 0.3.6) + activemodel (5.1.3) + activesupport (= 5.1.3) + activerecord (5.1.3) + activemodel (= 5.1.3) + activesupport (= 5.1.3) + arel (~> 8.0) + activesupport (5.1.3) + concurrent-ruby (~> 1.0, >= 1.0.2) i18n (~> 0.7) minitest (~> 5.1) - thread_safe (~> 0.3, >= 0.3.4) tzinfo (~> 1.1) addressable (2.5.1) public_suffix (~> 2.0, >= 2.0.2) @@ -115,13 +118,13 @@ GEM gyoku (>= 0.4.0) nokogiri american_date (1.1.1) - arel (6.0.4) + arel (8.0.0) ast (2.3.0) - aws-sdk-core (2.10.1) + aws-sdk-core (2.10.23) aws-sigv4 (~> 1.0) jmespath (~> 1.0) - aws-sigv4 (1.0.0) - axe-matchers (1.3.3) + aws-sigv4 (1.0.1) + axe-matchers (1.3.4) dumb_delegator (~> 0.8) virtus (~> 1.0) axiom-types (0.1.1) @@ -131,24 +134,24 @@ GEM base32-crockford (0.1.0) bcrypt (3.1.11) benchmark-ips (2.7.2) - better_errors (2.1.1) + better_errors (2.3.0) coderay (>= 1.0.0) - erubis (>= 2.6.6) + erubi (>= 1.0.0) rack (>= 0.9.0) bindata (2.4.0) binding_of_caller (0.7.2) debug_inspector (>= 0.0.1) - brakeman (3.6.2) + brakeman (3.7.0) browser (2.4.0) browserify-rails (4.2.0) addressable (>= 2.4.0) railties (>= 4.0.0, < 5.2) sprockets (>= 3.6.0) builder (3.2.3) - bullet (5.5.1) + bullet (5.6.1) activesupport (>= 3.0.0) uniform_notifier (~> 1.10.0) - bummr (0.1.8) + bummr (0.2.1) rainbow thor byebug (9.0.6) @@ -171,14 +174,14 @@ GEM capistrano-sidekiq (0.10.0) capistrano sidekiq (>= 3.4) - capybara (2.14.0) + capybara (2.15.1) addressable - mime-types (>= 1.16) + mini_mime (>= 0.1.3) nokogiri (>= 1.3.3) rack (>= 1.0.0) rack-test (>= 0.5.4) xpath (~> 2.0) - childprocess (0.6.3) + childprocess (0.7.1) ffi (~> 1.0, >= 1.0.11) choice (0.2.0) chronic (0.10.2) @@ -224,14 +227,11 @@ GEM railties (>= 4.1.0, < 5.2) responders warden (~> 1.2.3) - devise_security_extension (0.9.2) - devise (>= 2.0.0) - rails (>= 3.1.1) diff-lcs (1.3) docile (1.1.5) dotenv (2.2.1) - dotiw (3.1.1) - actionpack (>= 3) + dotiw (4.0.0) + actionpack (>= 4) i18n dumb_delegator (0.8.0) easy_translate (0.5.0) @@ -245,8 +245,9 @@ GEM encryptor (3.0.0) equalizer (0.0.11) errbase (0.0.3) + erubi (1.6.1) erubis (2.7.0) - eventmachine (1.0.9.1) + eventmachine (1.2.5) excon (0.57.0) execjs (2.7.0) factory_girl (4.8.0) @@ -254,8 +255,10 @@ GEM factory_girl_rails (4.8.0) factory_girl (~> 4.8.0) railties (>= 3.0.0) - faker (1.7.3) + faker (1.8.4) i18n (~> 0.5) + faraday (0.12.2) + multipart-post (>= 1.2, < 3) fasterer (0.3.2) colorize (~> 0.7) ruby_parser (~> 3.7) @@ -267,7 +270,7 @@ GEM thor (~> 0.14) formatador (0.2.5) foundation_emails (2.2.1.0) - front_matter_parser (0.1.0) + front_matter_parser (0.1.1) geocoder (1.4.4) get_process_mem (0.2.1) gibberish (2.1.0) @@ -290,19 +293,19 @@ GEM gyoku (1.3.1) builder (>= 2.1.2) hashdiff (0.3.2) - hashie (3.5.5) + hashie (3.5.6) heapy (0.1.2) highline (1.7.8) hiredis (0.6.1) htmlentities (4.3.4) - http_accept_language (2.1.0) - httparty (0.15.4) + http_accept_language (2.1.1) + httparty (0.15.6) multi_xml (>= 0.5.2) httpi (2.4.2) rack socksify i18n (0.8.6) - i18n-tasks (0.9.15) + i18n-tasks (0.9.16) activesupport (>= 4.0.2) ast (>= 2.1.0) easy_translate (>= 0.5.0) @@ -313,7 +316,7 @@ GEM rainbow (~> 2.2) terminal-table (>= 1.5.1) ice_nine (0.11.2) - iniparse (1.4.2) + iniparse (1.4.4) jmespath (1.3.1) json (1.8.6) json-jwt (1.7.2) @@ -325,30 +328,24 @@ GEM jwt (1.5.6) launchy (2.4.3) addressable (~> 2.3) + libxml-ruby (3.0.0) listen (3.1.5) rb-fsevent (~> 0.9, >= 0.9.4) rb-inotify (~> 0.9, >= 0.9.7) ruby_dep (~> 1.2) logger (1.2.8) - lograge (0.5.1) + lograge (0.6.0) actionpack (>= 4, < 5.2) activesupport (>= 4, < 5.2) railties (>= 4, < 5.2) + request_store (~> 1.0) loofah (2.0.3) nokogiri (>= 1.5.9) lumberjack (1.0.11) macaddr (1.7.1) systemu (~> 2.6.2) - mail (2.6.5) + mail (2.6.6) mime-types (>= 1.16, < 4) - mailcatcher (0.6.5) - eventmachine (= 1.0.9.1) - mail (~> 2.3) - rack (~> 1.5) - sinatra (~> 1.2) - skinny (~> 0.2.3) - sqlite3 (~> 1.3) - thin (~> 1.5.0) mandrill-api (1.0.53) excon (>= 0.16.0, < 1.0) json (>= 1.7.7, < 2.0) @@ -360,17 +357,21 @@ GEM mime-types (3.1) mime-types-data (~> 3.2015) mime-types-data (3.2016.0521) + mini_mime (0.1.3) mini_portile2 (2.2.0) - minitest (5.10.2) + minitest (5.10.3) multi_json (1.12.1) multi_xml (0.6.0) + multipart-post (2.0.0) + mustermann (1.0.0) nenv (0.3.0) net-scp (1.2.1) net-ssh (>= 2.6.5) net-sftp (2.1.2) net-ssh (>= 2.6.5) net-ssh (4.1.0) - newrelic_rpm (4.2.0.334) + newrelic_rpm (4.3.0.335) + nio4r (2.1.0) nokogiri (1.8.0) mini_portile2 (~> 2.2.0) nori (2.6.0) @@ -378,19 +379,19 @@ GEM nenv (~> 0.1) shellany (~> 0.0) orm_adapter (0.5.0) - overcommit (0.39.1) - childprocess (~> 0.6.3) + overcommit (0.40.0) + childprocess (~> 0.6, >= 0.6.3) iniparse (~> 1.4) parallel (1.11.2) parser (2.4.0.0) ast (~> 2.2) pg (0.21.0) - phonelib (0.6.12) + phonelib (0.6.13) phony (2.15.44) phony_rails (0.14.6) activesupport (>= 3.0) phony (> 2.15) - poltergeist (1.15.0) + poltergeist (1.16.0) capybara (~> 2.1) cliver (~> 0.3.1) websocket-driver (>= 0.2.0) @@ -399,7 +400,7 @@ GEM addressable css_parser (>= 1.4.10) htmlentities (>= 4.0.0) - premailer-rails (1.9.6) + premailer-rails (1.9.7) actionmailer (>= 3, < 6) premailer (~> 1.7, >= 1.7.9) pry (0.10.4) @@ -410,38 +411,38 @@ GEM byebug (~> 9.0) pry (~> 0.10) public_suffix (2.0.5) - quiet_assets (1.1.0) - railties (>= 3.1, < 5.0) - rack (1.6.8) + rack (2.0.3) rack-attack (5.0.1) rack rack-cors (0.4.1) rack-mini-profiler (0.10.5) rack (>= 1.2.0) - rack-protection (1.5.3) + rack-protection (2.0.0) rack rack-test (0.6.3) rack (>= 1.0) rack_session_access (0.1.1) builder (>= 2.0.0) rack (>= 1.0.0) - rails (4.2.8) - actionmailer (= 4.2.8) - actionpack (= 4.2.8) - actionview (= 4.2.8) - activejob (= 4.2.8) - activemodel (= 4.2.8) - activerecord (= 4.2.8) - activesupport (= 4.2.8) - bundler (>= 1.3.0, < 2.0) - railties (= 4.2.8) - sprockets-rails - rails-deprecated_sanitizer (1.0.3) - activesupport (>= 4.2.0.alpha) - rails-dom-testing (1.0.8) - activesupport (>= 4.2.0.beta, < 5.0) - nokogiri (~> 1.6) - rails-deprecated_sanitizer (>= 1.0.1) + rails (5.1.3) + actioncable (= 5.1.3) + actionmailer (= 5.1.3) + actionpack (= 5.1.3) + actionview (= 5.1.3) + activejob (= 5.1.3) + activemodel (= 5.1.3) + activerecord (= 5.1.3) + activesupport (= 5.1.3) + bundler (>= 1.3.0) + railties (= 5.1.3) + sprockets-rails (>= 2.0.0) + rails-controller-testing (1.0.2) + actionpack (~> 5.x, >= 5.0.1) + actionview (~> 5.x, >= 5.0.1) + activesupport (~> 5.x) + rails-dom-testing (2.0.3) + activesupport (>= 4.2.0) + nokogiri (>= 1.6) rails-erd (1.5.2) activerecord (>= 3.2) activesupport (>= 3.2) @@ -450,9 +451,10 @@ GEM rails-html-sanitizer (1.0.3) loofah (~> 2.0) rails_layout (1.0.41) - railties (4.2.8) - actionpack (= 4.2.8) - activesupport (= 4.2.8) + railties (5.1.3) + actionpack (= 5.1.3) + activesupport (= 5.1.3) + method_source rake (>= 0.8.7) thor (>= 0.18.1, < 2.0) rainbow (2.2.2) @@ -466,7 +468,7 @@ GEM connection_pool (~> 2.1) redis (~> 3.0) redis (3.3.3) - reek (4.7.1) + reek (4.7.2) codeclimate-engine-rb (~> 0.4.0) parser (>= 2.4.0.0, < 2.5) rainbow (~> 2.0) @@ -523,7 +525,7 @@ GEM sprockets (>= 2.8, < 4.0) sprockets-rails (>= 2.0, < 4.0) tilt (>= 1.1, < 3) - savon (2.11.1) + savon (2.11.2) akami (~> 1.2) builder (>= 2.1.2) gyoku (~> 1.2) @@ -533,14 +535,14 @@ GEM wasabi (~> 3.4) scrypt (3.0.5) ffi-compiler (>= 1.0, < 2.0) - secure_headers (3.6.5) + secure_headers (3.6.7) useragent securecompare (1.0.0) sexp_processor (4.8.0) shellany (0.0.1) - shoulda-matchers (3.1.1) + shoulda-matchers (3.1.2) activesupport (>= 4.0.0) - sidekiq (5.0.3) + sidekiq (5.0.4) concurrent-ruby (~> 1.0) connection_pool (~> 2.2, >= 2.2.0) rack-protection (>= 1.5.0) @@ -553,13 +555,11 @@ GEM json (>= 1.8, < 3) simplecov-html (~> 0.10.0) simplecov-html (0.10.0) - sinatra (1.4.8) - rack (~> 1.5) - rack-protection (~> 1.4) - tilt (>= 1.3, < 3) - skinny (0.2.4) - eventmachine (~> 1.0.0) - thin (>= 1.5, < 1.7) + sinatra (2.0.0) + mustermann (~> 1.0) + rack (~> 2.0) + rack-protection (= 2.0.0) + tilt (~> 2.0) slim (3.0.8) temple (>= 0.7.6, < 0.9) tilt (>= 1.3.3, < 2.1) @@ -581,7 +581,6 @@ GEM actionpack (>= 4.0) activesupport (>= 4.0) sprockets (>= 3.0.0) - sqlite3 (1.3.13) sshkit (1.13.1) net-scp (>= 1.1.2) net-ssh (>= 2.8.0) @@ -595,21 +594,19 @@ GEM temple (0.8.0) terminal-table (1.8.0) unicode-display_width (~> 1.1, >= 1.1.1) - test_after_commit (1.1.0) - activerecord (>= 3.2) - thin (1.5.1) - daemons (>= 1.0.9) - eventmachine (>= 0.12.6) - rack (>= 1.0.0) + thin (1.7.2) + daemons (~> 1.0, >= 1.0.9) + eventmachine (~> 1.0, >= 1.0.4) + rack (>= 1, < 3) thor (0.19.4) thread (0.2.2) thread_safe (0.3.6) - tilt (2.0.7) - timecop (0.9.0) - twilio-ruby (4.13.0) - builder (>= 2.1.2) - jwt (~> 1.0) - multi_json (>= 1.3.0) + tilt (2.0.8) + timecop (0.9.1) + twilio-ruby (5.1.0) + faraday (~> 0.9) + jwt (~> 1.5) + libxml-ruby (= 3.0.0) tzinfo (1.2.3) thread_safe (~> 0.1) uglifier (3.2.0) @@ -652,10 +649,10 @@ GEM xmlmapper (~> 0.6) xmlmapper (0.7.2) nokogiri (~> 1.5) - xpath (2.0.0) + xpath (2.1.0) nokogiri (~> 1.3) zonebie (0.6.1) - zxcvbn-js (4.4.2) + zxcvbn-js (4.4.3) execjs PLATFORMS @@ -685,7 +682,6 @@ DEPENDENCIES derailed device_detector devise (~> 4.1) - devise_security_extension dotiw email_spec equifax! @@ -705,7 +701,6 @@ DEPENDENCIES i18n-tasks json-jwt lograge - mailcatcher mandrill_dm net-sftp newrelic_rpm @@ -717,13 +712,13 @@ DEPENDENCIES premailer-rails proofer! pry-byebug - quiet_assets rack-attack rack-cors rack-mini-profiler rack-test rack_session_access - rails (~> 4.2.6) + rails (~> 5.1.3) + rails-controller-testing rails-erd rails_layout readthis @@ -747,7 +742,6 @@ DEPENDENCIES slim_lint stringex teaspoon-mocha - test_after_commit thin timecop twilio-ruby @@ -765,4 +759,4 @@ RUBY VERSION ruby 2.3.3p222 BUNDLED WITH - 1.15.1 + 1.15.3 diff --git a/Procfile b/Procfile index a4a50cd2a39..6ccc9da9196 100644 --- a/Procfile +++ b/Procfile @@ -1,3 +1,3 @@ web: bundle exec rackup config.ru --port ${PORT:-3000} worker: bundle exec sidekiq --config config/sidekiq.yml -mail: bundle exec mailcatcher -f +mailcatcher: mailcatcher -f diff --git a/README.md b/README.md index c4aa2aba38e..9f4b9548932 100644 --- a/README.md +++ b/README.md @@ -125,7 +125,12 @@ more information. Once it is up and running, the app will be accessible at `http://localhost:3000/` by default. -Email messages will be visible in MailCatcher at `http://localhost:1080/`. +To view email messages, Mailcatcher must be running. You can check if it's +running by visiting http://localhost:1080/. To run Mailcatcher: + +``` +$ mailcatcher +``` If you would like to run the application on a different port: diff --git a/app/assets/javascripts/app/i18n-dropdown.js b/app/assets/javascripts/app/i18n-dropdown.js index 431765f0f47..1b5b9157b29 100644 --- a/app/assets/javascripts/app/i18n-dropdown.js +++ b/app/assets/javascripts/app/i18n-dropdown.js @@ -1,18 +1,36 @@ import 'classlist.js'; document.addEventListener('DOMContentLoaded', () => { - const mobileLink = document.querySelector('.i18n-mobile-toggle'); + const mobileLink = document.querySelector('.i18n-mobile-toggle > a'); const mobileDropdown = document.querySelector('.i18n-mobile-dropdown'); - const desktopLink = document.querySelector('.i18n-desktop-toggle'); + const desktopLink = document.querySelector('.i18n-desktop-toggle > a'); const desktopDropdown = document.querySelector('.i18n-desktop-dropdown'); - function initDropdown (trigger, dropdown) { - trigger.addEventListener('click', function() { - this.classList.toggle('focused'); - dropdown.classList.toggle('focused'); + function addListenerMulti(el, s, fn) { + s.split(' ').forEach(e => el.addEventListener(e, fn, false)); + } + + function toggleAriaExpanded(element) { + if (element.getAttribute('aria-expanded') === 'true') { + element.setAttribute('aria-expanded', 'false'); + } else { + element.setAttribute('aria-expanded', 'true'); + } + } + + function languagePicker(trigger, dropdown) { + addListenerMulti(trigger, 'click keypress', function(event) { + const eventType = event.type; + + event.preventDefault(); + if (eventType === 'click' || (eventType === 'keypress' && event.which === 13)) { + this.parentNode.classList.toggle('focused'); + dropdown.classList.toggle('display-none'); + toggleAriaExpanded(this); + } }); } - if (mobileLink) initDropdown(mobileLink, mobileDropdown); - if (desktopLink) initDropdown(desktopLink, desktopDropdown); + if (desktopLink) languagePicker(desktopLink, desktopDropdown); + if (mobileLink) languagePicker(mobileLink, mobileDropdown); }); diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index 7aa578a51f0..36142a61986 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -1,18 +1,5 @@ @import 'fonts'; -@import 'variables/colors'; -@import 'variables/web'; - -// imported from node_modules -@import 'normalize.css/normalize'; -@import 'hint.css/hint'; - -@import 'basscss-sass/basscss'; -@import 'basscss/margin'; -@import 'basscss/padding'; -@import 'basscss/responsive-margin'; -@import 'basscss/responsive-padding'; - -@import 'components/all'; +@import 'identity-style-guide/src/css/app'; @import 'print'; diff --git a/app/assets/stylesheets/components/_abbr.scss b/app/assets/stylesheets/components/_abbr.scss deleted file mode 100644 index 6048d5e322b..00000000000 --- a/app/assets/stylesheets/components/_abbr.scss +++ /dev/null @@ -1,3 +0,0 @@ -// normalize.css adds a text underline by default -// scss-lint:disable QualifyingElement -abbr[title] { text-decoration: none; } diff --git a/app/assets/stylesheets/components/_accordion.scss b/app/assets/stylesheets/components/_accordion.scss deleted file mode 100644 index 3a59a7e044c..00000000000 --- a/app/assets/stylesheets/components/_accordion.scss +++ /dev/null @@ -1,87 +0,0 @@ -.no-js { - .accordion { - .accordion-header { - cursor: initial; - } - - .accordion-footer { - display: none; - } - - .accordion-content { - display: block; - } - - [class*="btn-"] { - display: none; - } - } -} - -.accordion { - border: $border-width solid $border-color; - border-radius: $border-radius-md; - - .accordion-header { - color: $blue; - cursor: pointer; - position: relative; - - img { - position: absolute; - right: 1rem; - top: .8rem; - } - } - - .accordion-content { - border-top: $border-width solid $border-color; - display: none; - opacity: 1; - - &.shown { - display: block; - } - } - - .accordion-footer { - background-color: $blue-lightest; - border-top: $border-width solid $border-color; - color: $blue; - cursor: pointer; - text-align: center; - - img { - margin-top: -2px; - vertical-align: middle; - } - } -} - -.animate-in { - animation: accordionIn .2s normal ease-in both 1; -} - -.animate-out { - animation: accordionOut .15s normal ease-out both 1; -} - -@keyframes accordionIn { - 0% { - opacity: 0; - } - - 100% { - opacity: 1; - } -} - -@keyframes accordionOut { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - } -} diff --git a/app/assets/stylesheets/components/_alert.scss b/app/assets/stylesheets/components/_alert.scss deleted file mode 100644 index 48dd85515eb..00000000000 --- a/app/assets/stylesheets/components/_alert.scss +++ /dev/null @@ -1,58 +0,0 @@ -$ico-size: 1rem; -$ico-offset: 1rem; - -.alert { - background-color: $blue-lighter; - border-radius: $space-1; - color: #5b616a; - font-size: 1rem; - line-height: 1.5rem; - margin-bottom: $space-4; - padding: 12px $space-2; - position: relative; - - &::before { - background-image: none; - background-repeat: no-repeat; - content: ''; - height: $ico-size; - left: $ico-offset; - position: absolute; - top: $ico-offset; - width: $ico-size; - } -} - -.alert-success { - background-color: #ebfcef; - padding-left: $space-4; - - &::before { background-image: url(image-path('alert/success.svg')); } -} - -.alert-thumb { - background-color: #ebfcef; - padding-left: $space-4; - - &::before { background-image: url(image-path('alert/ico-thumb.svg')); } -} - -.alert-error, -.alert-alert { - background-color: #fff0f3; - padding-left: $space-4; - - &::before { background-image: url(image-path('alert/error.svg')); } -} - -.alert-warning { - background-color: #fffdd7; - padding-left: $space-4; - - &::before { background-image: url(image-path('alert/warning.svg')); } -} - -.alert-notice { - padding-left: $space-4; - &::before { background-image: url(image-path('alert/notice.svg')); } -} diff --git a/app/assets/stylesheets/components/_background.scss b/app/assets/stylesheets/components/_background.scss deleted file mode 100644 index 9c26230e10c..00000000000 --- a/app/assets/stylesheets/components/_background.scss +++ /dev/null @@ -1,9 +0,0 @@ -.bg-gray-lighter { background-color: $gray-lighter; } -.bg-light-blue { background-color: $blue-light; } -.bg-lightest-blue { background-color: $blue-lightest; } - -@media #{$breakpoint-sm} { - .sm-bg-light-blue { background-color: $blue-light; } - .sm-bg-none { background-color: transparent; } - .sm-bg-navy { background-color: $navy; } -} diff --git a/app/assets/stylesheets/components/_border.scss b/app/assets/stylesheets/components/_border.scss deleted file mode 100644 index 12256d68ed6..00000000000 --- a/app/assets/stylesheets/components/_border.scss +++ /dev/null @@ -1,16 +0,0 @@ -.bw1 { border-width: 1px; } -.bw2 { border-width: 2px; } -.bw3 { border-width: 3px; } -.bw4 { border-width: 4px; } - -.border-dashed { border-style: dashed; } - -.rounded-md { border-radius: $border-radius-md; } -.rounded-lg { border-radius: $border-radius-lg; } -.rounded-xl { border-radius: $border-radius-xl; } -.rounded-xxl { border-radius: $border-radius-xxl; } - -@media #{$breakpoint-sm} { - .sm-border-none { border: 0; } - .sm-rounded-md { border-radius: $border-radius-md; } -} diff --git a/app/assets/stylesheets/components/_btn.scss b/app/assets/stylesheets/components/_btn.scss deleted file mode 100644 index 5f7c5d2f972..00000000000 --- a/app/assets/stylesheets/components/_btn.scss +++ /dev/null @@ -1,80 +0,0 @@ -@media #{$breakpoint-sm} { - .btn { font-size: $button-font-size-sm; } -} - -.btn { - white-space: normal; -} - -%btn-basic { - background: transparent; - border: 0; - box-shadow: none; - color: $blue; - font-size: $base-font-size; - font-weight: normal; - line-height: $line-height; - outline: none; - padding: 0; -} - -.btn-primary { - border-radius: $border-radius-lg; -} - -.btn-secondary { - border: 1px solid $blue; - border-radius: $border-radius-lg; - color: $blue; - - &:hover { - background-color: $blue-lightest; - } -} - -.btn-wide { - box-sizing: border-box; - min-width: 220px; - text-align: center; -} - -.btn-transparent { - @extend %btn-basic; - cursor: pointer; -} - -.btn-link { - @extend %btn-basic; - text-decoration: underline; - vertical-align: baseline; - - &:active, - &:focus, - &:hover, { - border: 0; - box-shadow: none; - text-decoration: underline; - } -} - -.btn-border { - border-color: $border-color; - border-radius: $border-radius-lg; - border-style: solid; - border-width: $border-width; - box-sizing: border-box; - display: inline-block; - padding: $space-1 $space-2; - - &.is-focused { - border-color: $field-focus-color; - box-shadow: 0 0 0 2px rgba($field-focus-color, .5); - outline: none; - } -} - -.btn-disabled { - background-color: $gray-light; - border-color: $gray; - color: $gray; -} diff --git a/app/assets/stylesheets/components/_card.scss b/app/assets/stylesheets/components/_card.scss deleted file mode 100644 index 017d0addade..00000000000 --- a/app/assets/stylesheets/components/_card.scss +++ /dev/null @@ -1,23 +0,0 @@ -.card { - background-color: $white; - max-width: $container-skinny-width; - - &-wide { - max-width: 100%; - padding-bottom: 0; - padding-left: 0; - padding-right: 0; - } - - @media #{$breakpoint-sm} { - border-radius: 5px; - - &-wide { - margin-top: $space-4; - max-width: 100%; - padding-bottom: 0; - padding-left: 0; - padding-right: 0; - } - } -} diff --git a/app/assets/stylesheets/components/_color.scss b/app/assets/stylesheets/components/_color.scss deleted file mode 100644 index 572de70adf1..00000000000 --- a/app/assets/stylesheets/components/_color.scss +++ /dev/null @@ -1,3 +0,0 @@ -@media #{$breakpoint-sm} { - .sm-white { color: $white; } -} diff --git a/app/assets/stylesheets/components/_container.scss b/app/assets/stylesheets/components/_container.scss deleted file mode 100644 index 5bed3a6d2c0..00000000000 --- a/app/assets/stylesheets/components/_container.scss +++ /dev/null @@ -1,7 +0,0 @@ -.cntnr-skinny { max-width: $container-skinny-width; } -.cntnr-xskinny { max-width: $container-xskinny-width; } -.cntnr-xxskinny { max-width: $container-xxskinny-width; } - -@media #{$breakpoint-sm} { - .cntnr-xxskinny { max-width: $container-xskinny-width; } -} diff --git a/app/assets/stylesheets/components/_footer.scss b/app/assets/stylesheets/components/_footer.scss deleted file mode 100644 index 4b9e8042f51..00000000000 --- a/app/assets/stylesheets/components/_footer.scss +++ /dev/null @@ -1,31 +0,0 @@ -// 1. Avoid the IE 10-11 `min-height` bug. -// 2. Set `flex-shrink` to `0` to prevent some browsers from -// letting these items shrink to smaller than their content's default -// minimum size. See http://bit.ly/1Mn35US for details. -// 3. Use `%` instead of `vh` since `vh` is buggy in older mobile Safari. -html { - height: 100%; -} - -.site { - display: flex; - flex-direction: column; - height: 100%; // 1, 3 -} - -.footer { - flex: none; // 2 - position: relative; -} - -.site-wrap { - flex: 1 0 auto; // 2 - width: 100%; -} - -.site-wrap::after { - content: '\00a0'; //   - display: block; - height: 0; - visibility: hidden; -} diff --git a/app/assets/stylesheets/components/_form.scss b/app/assets/stylesheets/components/_form.scss deleted file mode 100644 index 71df7c2435c..00000000000 --- a/app/assets/stylesheets/components/_form.scss +++ /dev/null @@ -1,272 +0,0 @@ -$radio-checkbox-space: 1.5rem; - -@media #{$breakpoint-sm} { - input, - select, - textarea { - font-size: $form-field-font-size-sm; - } -} - -label { - display: inline-block; - margin-bottom: $space-tiny; -} - -textarea { - resize: vertical; -} - -.field { - background-color: #f2f9ff; - color: $gray; - font-weight: $bold-font-weight; - - &[type=number], - &.phone { - font-family: $monospace-font-family; - } - - &:focus, - &.is-focused { - border-color: $field-focus-color; - box-shadow: 0 0 0 2px rgba($field-focus-color, .5); - outline: none; - } - - &:invalid, - &.is-error { - border-color: $border-color; - } -} - -.radio-extra { - margin-left: $radio-checkbox-space; -} - - -// error states -.has-error input { - background-image: url(image-path('alert/error.svg')); - background-position: center right $form-field-padding-x; - background-repeat: no-repeat; - background-size: 1rem 1rem; - border-color: $red; - - &.date, - &.select { - background-image: none; - } - - &:focus { - border-color: $red; - box-shadow: 0 0 0 2px rgba($red, .5); - } -} - -// hide number field input spin box as per: -// http://stackoverflow.com/questions/3790935/can-i-hide-the-html5-number-input-s-spin-box -// and added .mfa class selector as per CodeClimate warning to: -// 'Avoid qualifying attribute selectors with an element.' -.mfa { - -moz-appearance: textfield; -} - -input::-webkit-outer-spin-button, -input::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; -} - - -// wtf-forms.css -.checkbox, -.radio { - cursor: pointer; - padding-left: 24px; - position: relative; -} - -.checkbox input, -.radio input, { - opacity: 0; - position: absolute; - z-index: -1; -} - -// scss-lint:disable VendorPrefix -.indicator { - background-position: center center; - background-repeat: no-repeat; - background-size: .5rem .5rem; - box-sizing: border-box; - display: block; - font-size: 65%; - height: 1rem; - left: 0; - line-height: 1rem; - position: absolute; - text-align: center; - top: .25rem; - -moz-user-select: none; - -ms-user-select: none; - -webkit-user-select: none; - user-select: none; - width: 1rem; -} - -.checkbox input:focus ~ .indicator, -.radio input:focus ~ .indicator { - box-shadow: 0 0 0 2px rgba($blue, .5); -} - -.checkbox input:checked ~ .indicator, -.radio input:checked ~ .indicator { - background-color: $blue; - color: $white; -} - -.checkbox input:active ~ .indicator, -.radio input:active ~ .indicator { - background-color: $blue-light; - color: $white; -} - -.checkbox .indicator { - background-color: $white; - border: $border-width solid $blue; - border-radius: .25rem; -} - -.checkbox input:checked ~ .indicator { - background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTYuNCwxTDUuNywxLjdMMi45LDQuNUwyLjEsMy43TDEuNCwzTDAsNC40bDAuNywwLjdsMS41LDEuNWwwLjcsMC43bDAuNy0wLjdsMy41LTMuNWwwLjctMC43TDYuNCwxTDYuNCwxeiINCgkvPg0KPC9zdmc+DQo=); -} - -.radio .indicator { - background-color: #f2f9ff; - border: $border-width solid $blue; - border-radius: 50%; -} - -.radio input:checked ~ .indicator { - background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQsMUMyLjMsMSwxLDIuMywxLDRzMS4zLDMsMywzczMtMS4zLDMtM1M1LjcsMSw0LDF6Ii8+DQo8L3N2Zz4NCg==); -} - -.radio input:disabled ~ .indicator { - background-color: $gray-light; - border-color: $gray; -} - -.select-alt { - color: $white; - display: inline-block; - position: relative; - width: 100%; - - select { - -moz-appearance: none; - -webkit-appearance: none; - appearance: none; - background-color: $navy; - border-right: 1px solid $blue; - color: $white; - cursor: pointer; - display: inline-block; - font-weight: normal; - line-height: 1.5; - padding-right: 2.25rem; - width: 100%; - } - - // Undo the Firefox inner focus ring - select:focus:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 $white; - } - - select:active { - background-color: $navy; - color: $white; - } - - // Hide the arrow in IE10 and up - select::-ms-expand { - display: none; - } - - // Separator - &::before { - border-right: 1px solid $blue; - content: ''; - height: -moz-calc(3rem - 2px); - height: -webkit-calc(3rem - 2px); - height: calc(3rem - 2px); - position: absolute; - right: 3rem; - top: 1px; - width: 0; - } - - // Dropdown arrow - &::after { - border-bottom: .35rem solid transparent; - border-left: .35rem solid transparent; - border-right: .35rem solid transparent; - border-top: .35rem solid; - content: ''; - display: inline-block; - height: 0; - margin-top: -.15rem; - pointer-events: none; - position: absolute; - right: 1.25rem; - top: 50%; - width: 0; - } -} - -// Media query to target Firefox only -@-moz-document url-prefix() { - // Firefox hack to hide the arrow - .select-alt select { - padding-right: 1rem; - text-indent: .01px; - text-overflow: ''; - } - - //