diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index 06287561a9a418dc4dd92095049e1326759789e5..563f775c0b33d4d1c8cfade0a94d78eb6afa06b2 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,4 +1,4 @@
-image: timbru31/ruby-node:2.6-fermium
+image: timbru31/ruby-node:3.2
stages:
- build
@@ -18,23 +18,25 @@ before_script:
- export LANG=en_US.UTF-8
- export LANGUAGE=en_US:en
- export LC_ALL=en_US.UTF-8
+ - export BUNDLE_PATH=~
+ - bundle config set --local path ~
build_production:
stage: build
tags:
- build
script:
- - bundle install --path vendor
+ - bundle install
- mkdir public
- cp _config_production.yml _config.yml
- cp _layouts/presentation_production.html _layouts/presentation.html
- - bundle exec jekyll build -d public
+ - bundle exec jekyll build -d public
variables:
- quarter: 23au
- course: cse493e
+ quarter: ##xx
+ course: cse###
source_path: public
only:
- - UACCESS-23fa
+ - XACCESS-##xx
artifacts:
paths:
- public/
@@ -48,11 +50,11 @@ pre_deploy_production:
script:
- /www/utils/deploycourseweb.sh
variables:
- quarter: 23au
- course: cse493e
+ quarter: ##xx
+ course: cse###
source_path: public
only:
- - UACCESS-23fa
+ - XACCESS-##xx
generate_pdf:
stage: generatepdf
@@ -65,11 +67,11 @@ generate_pdf:
- bundle install --path vendor
- script/deployslidepdf
variables:
- quarter: 23au
- course: cse493e
+ quarter: ##xx
+ course: cse###
source_path: public
only:
- - UACCESS-23fa
+ - XACCESS-##xx
artifacts:
paths:
- public/
@@ -83,8 +85,8 @@ after_deploy_production:
script:
- /www/utils/deploycourseweb.sh
variables:
- quarter: 23au
- course: cse493e
+ quarter: ##xx
+ course: cse###
source_path: public
only:
- - UACCESS-23fa
+ - XACCESS-##xx
\ No newline at end of file
diff --git a/Gemfile b/Gemfile
index ce7212766c6d8cb4c96e34ddfa152ee52ca85002..a256b07f2f86667f6a31e8d5d45a9b75fb097915 100644
--- a/Gemfile
+++ b/Gemfile
@@ -10,25 +10,25 @@ source "https://rubygems.org"
# Happy Jekylling!
-gem "jekyll", "< 4.0"
-gem 'sassc', '~> 2.4.0'
+gem "jekyll", "~> 4.2.2"
+gem 'execjs'
+gem 'sassc', '~> 2.4'
+gem 'mini_racer', platforms: :ruby
# If you have any plugins, put them here!
group :jekyll_plugins do
- gem 'execjs'
gem 'jekyll-redirect-from'
gem 'jekyll-target-blank'
gem "jekyll-feed"
gem "jekyll-paginate"
gem "jekyll-contentblocks"
gem "jekyll-assets"
- gem 'jekyll-font-awesome-sass'
- gem "font-awesome-sass"
- gem "sprockets", "~> 3.7"
+ gem "sprockets"
gem "kramdown-parser-gfm"
gem 'remark'
gem 'jekyll-mermaid'
gem 'uglifier'
+ gem 'jekyll-seo-tag'
end
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
@@ -38,4 +38,4 @@ gem "tzinfo-data", platforms: [:mingw, :mswin, :x64_mingw, :jruby]
gem "wdm", "~> 0.1.0" if Gem.win_platform?
-gemspec
+gem "webrick", "~> 1.8"
diff --git a/README.md b/README.md
index c6bc146be556ca5d3e1565e189dbef8ca561f5b1..4d9b9079d8085fa699e8c4d8928af4dad7c62070 100644
--- a/README.md
+++ b/README.md
@@ -31,7 +31,7 @@ To use this website, the following steps are necessary:
# Basic use:
-rvm use ruby 2.7 # on M1 install with rvm install 2.7
+rbenv global ruby 3.2.3 # on M1 install with rvm install 2.7
bundle install # if needed
@@ -39,6 +39,15 @@ bundle exec jekyll build
bundle exec jekyll serve &
+# To set up a runner
+
+1. on gitlab.cs.washington.edu, goto the project you want add a runner for.
+2. Go to settings -> CI/CD -> Runners and press the new runner button
+3. Follow the prompts and it will give you a code snippet
+4. ssh to gitlab04 and gitlab05 and run the following command:
+sudo gitlab-runner register and use the information from step 3 for the prompts
+for the name, use cseNNN-QQYY-gitlab0[4|5] and "shell" for the executor.
+
# Updates
There are generic names and XXX and such in
@@ -47,3 +56,9 @@ There are generic names and XXX and such in
- _data/navigation.yml
You'll need to update them once you merge this in
+
+# Merges
+- Merge the branch from the relevant class website into an equivalent branch in accessibility-website
+- remove all references to a specific quarter or class
+- Decide whether to make a copy of assignments that are significantly different
+- merge into main
diff --git a/_config.yml b/_config.yml
index 7ba0be28082cfd1aa4385810735b4aa9b22ff491..3430e8342d7242ecc6f8ad914f0461883baa8c04 100644
--- a/_config.yml
+++ b/_config.yml
@@ -4,25 +4,28 @@
# You can create any custom variable you would like, and they will be accessible
# in the templates via {{ site.myvariable }}.
-title: Accessibility
+title: [fill in]
description: Learn about app accessibility; how accessibility can be incorporated into cutting edge computer science topics like machine learning and fabrication; and the interaction of accessibilty technology and society
-baseurl: "/courses/cse493e/23au"
+baseurl: "/courses/[cse###/##xx]"
url: https://courses.cs.washington.edu # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: jcmankoff
git_username: jmankoff
-staff_email: uaccess@cs.washington.edu
-canvas_course: 1665828
-git_url: https://gitlab.cs.washington.edu/teaching-materials/undergrad-accessibility-website
-git_branch: UACCESS-23fa
-discussion: https://edstem.org/us/courses/41400/discussion
-canvas: https://canvas.uw.edu/courses/1665828
-warning:
-
-paginate: 5
-classnum: CSE493
-quarter: "Fall 2023"
-copydate: "4/12/23"
+staff_email: [x]access@cs.washington.edu
+canvas_course: [#######]
+git_url: https://gitlab.cs.washington.edu/teaching-materials/[fill in]
+git_branch: [XACCESS-##xx]
+discussion: https://edstem.org/us/courses/[####]/discussion
+canvas: https://canvas.uw.edu/courses/[#######]
+closed:
+warning: true
+
+paginate: 5
+room: [Fill in]
+time: [Fill in]
+classnum: [CSE###]
+quarter: "[Quarter Year]"
+copydate: "7/4/24"
author:
name: Jennifer Mankoff
url: "https://make4all.org/jennifer-mankoff/"
@@ -35,18 +38,18 @@ reveal_theme: black.css
# Build settings
markdown: kramdown
-theme: jekyll-theme-cayman
+# theme: jekyll-theme-cayman
plugins:
- jekyll-feed
- jekyll-seo-tag
- - jekyll-font-awesome-sass
- jekyll-paginate
- jekyll-redirect-from
- jekyll-assets
- uglifier
- jekyll-mermaid
- jekyll-target-blank
+ - jekyll-seo-tag
highlighter: rouge
@@ -61,7 +64,7 @@ assets:
sass:
sass_dir: "./_scss"
-# style: compressed
+ style: compressed
kramdown:
toc_levels: '1'
diff --git a/_config_production.yml b/_config_production.yml
index c87e2cb3ff64d9e7f0e4bb3ac6f86addec9a1f3e..3430e8342d7242ecc6f8ad914f0461883baa8c04 100644
--- a/_config_production.yml
+++ b/_config_production.yml
@@ -4,25 +4,28 @@
# You can create any custom variable you would like, and they will be accessible
# in the templates via {{ site.myvariable }}.
-title: Accessibility
+title: [fill in]
description: Learn about app accessibility; how accessibility can be incorporated into cutting edge computer science topics like machine learning and fabrication; and the interaction of accessibilty technology and society
-baseurl: "/courses/cse493e/23au"
+baseurl: "/courses/[cse###/##xx]"
url: https://courses.cs.washington.edu # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: jcmankoff
git_username: jmankoff
-staff_email: uaccess@cs.washington.edu
-canvas_course: 1665828
-git_url: https://gitlab.cs.washington.edu/teaching-materials/undergrad-accessibility-website
-git_branch: UACCESS-23fa
-discussion: https://edstem.org/us/courses/41400/discussion
-canvas: https://canvas.uw.edu/courses/1665828
-warning:
-
-paginate: 5
-classnum: CSE493e
-quarter: "Fall 2023"
-copydate: "4/12/23"
+staff_email: [x]access@cs.washington.edu
+canvas_course: [#######]
+git_url: https://gitlab.cs.washington.edu/teaching-materials/[fill in]
+git_branch: [XACCESS-##xx]
+discussion: https://edstem.org/us/courses/[####]/discussion
+canvas: https://canvas.uw.edu/courses/[#######]
+closed:
+warning: true
+
+paginate: 5
+room: [Fill in]
+time: [Fill in]
+classnum: [CSE###]
+quarter: "[Quarter Year]"
+copydate: "7/4/24"
author:
name: Jennifer Mankoff
url: "https://make4all.org/jennifer-mankoff/"
@@ -35,18 +38,18 @@ reveal_theme: black.css
# Build settings
markdown: kramdown
-theme: jekyll-theme-cayman
+# theme: jekyll-theme-cayman
plugins:
- jekyll-feed
- jekyll-seo-tag
- - jekyll-font-awesome-sass
- jekyll-paginate
- jekyll-redirect-from
- jekyll-assets
- uglifier
- jekyll-mermaid
- jekyll-target-blank
+ - jekyll-seo-tag
highlighter: rouge
@@ -61,7 +64,7 @@ assets:
sass:
sass_dir: "./_scss"
-# style: compressed
+ style: compressed
kramdown:
toc_levels: '1'
diff --git a/_data/navigation.yml b/_data/navigation.yml
index 8ea20dcc1471973e631a24c282390bb93ea14937..00cfbdbf8a4938a221c28ba9c212c53c62d2ae73 100644
--- a/_data/navigation.yml
+++ b/_data/navigation.yml
@@ -6,5 +6,7 @@ nav_list:
url: /schedule.html
- title: Assignments
url: /assignments/
+- title: Final Projects
+ url: /projects/
- title: Academic Conduct
url: /academic-conduct.html
\ No newline at end of file
diff --git a/_includes/footer.html b/_includes/footer.html
index 0908d08ae640e7991a6f3e6cc99aeb279a16d93c..bf64c3532b58d46d0e609ddad67c25e56801fc93 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -12,15 +12,6 @@
{%- endif -%}
</span>
- {% if site.github.is_project_page %}
- <span class="site-footer-owner"><a href="{{
- site.github.repository_url }}">{{ site.github.repository_name }}'s
- github repository </a> is maintained by <a href="{{ site.github.owner_url }}">{{ site.github.owner_name }}</a>@github.</span>
- {% endif %}
- <!-- <div class="footer-col footer-col-2"> -->
- <!-- {%- include social.html -%} -->
- <!-- </div> -->
-
</div>
</div>
diff --git a/_includes/head.html b/_includes/head.html
index ec13b5a7f5a7691d66a039de7506640296b6c7d7..47a7dfe6ae1a8040c60d1ab614464c6b0be21d0f 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -5,12 +5,11 @@
<meta name="theme-color" content="#157878">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+<link rel="stylesheet" href="{{site.baseurl}}/assets/css/rouge.css">
+<link rel="stylesheet" href="{{site.baseurl}}/assets/css/scrolling-nav.css">
+<link rel="stylesheet" href="{{site.baseurl}}/assets/css/mermaid.css">
<link rel="stylesheet" href="{{site.baseurl}}/assets/css/site.css">
<link rel="stylesheet" href="{{site.baseurl}}/assets/css/style.css">
- <link rel="stylesheet" href="{{site.baseurl}}/assets/css/rouge.css">
- <link rel="stylesheet" href="{{site.baseurl}}/assets/css/scrolling-nav.css">
- <link rel="stylesheet" href="{{site.baseurl}}/assets/css/mermaid.css">
{%- feed_meta -%}
{%- if jekyll.environment == 'production' and site.google_analytics -%}
diff --git a/_includes/header.html b/_includes/header.html
index 89f48b47e56af74f4ae51f507291a03b1bd42cb9..4cff422be14a5b78af4ceda5a26c3221954b4992 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -1,7 +1,7 @@
<header class="page-header" role="banner">
{% include navigation.html %}
<br> <br> <br> <br>
- <h1 class="project-name">{{ page.title | default: site.title }}</h1>
+ <h1 class="project-name">{{site.title}} ({{site.classnum}}) | <strong>{{ page.title | default: site.title }}</strong></h1>
<h2 class="project-tagline">{{ page.description | default: site.description }}</h2>
<script type="text/javascript">
diff --git a/_includes/navigation.html b/_includes/navigation.html
index 7b59c5ff4346035c29f9d1692d69fd55467c7506..fa02aebf5c2378fc06aa1709c2b89d2a2bbd8fe5 100644
--- a/_includes/navigation.html
+++ b/_includes/navigation.html
@@ -23,9 +23,9 @@
href="https://www.cs.washington.edu" aria-label="{{site.data.navigation.nav_list_title}}">
<img src="{{site.baseurl}}/assets/img/Allen-School-white-RGB-sm.png" alt="Allen School Logo" align=left style="max-width: 100%; height: auto;">
<a class="navbar-brand js-scroll-trigg"
- href="{{site.baseurl}}/" aria-label="{{site.data.navigation.nav_list_title}}">
- <img src="{{site.baseurl}}/assets/img/favicon.png" alt="Make4all/class Logo" align=left style="max-width: 10%; height: auto;">
- </a>
+ href="{{site.baseurl}}/" aria-label="{{site.data.navigation.nav_list_title}}"
+ <img src="{{site.baseurl}}/assets/img/favicon.png" alt="Make4all/class Logo" align=left style="max-width: 10%; height: auto;"> </a>
+
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
diff --git a/_layouts/assignment.html b/_layouts/assignment.html
index ba676f5bfebd4a762bcfc4e56fc1652ff3e34afe..4c8a19fd9eedaafb2ffb1c43fd54d696503f70d8 100644
--- a/_layouts/assignment.html
+++ b/_layouts/assignment.html
@@ -18,35 +18,11 @@
{% endif %}
<div id="assignment-name">
- <h1>{{ page.code }}: {{ page.title }}</h1>
+ <h1>{{ page.title }}</h1>
<span>Last revised: {{ page.revised }}</span>
</div>
- <div id="due dates">
-
- {% if page.assigned.size > 1 %}
-<h2>Assigned</h2>
- <ul>
- {% for day in page.assigned %}
- <li>{{day}}</li>
- {% endfor %}
- </ul>
- {% else %}
-<h2>Assigned</h2>: {{page.assigned}}
- {% endif %}
-
-{% if page.due.size > 1 %}
- <br> <h2>Due</h2>
- <ul>
- {% for day in page.due %}
- <li>{{day}}</li>
- {% endfor %}
- </ul>
- {% else %}
-   <h2>Due</h2>: {{page.assigned}}
- {% endif %}
-</div>
{{ content }}
diff --git a/_layouts/default.html b/_layouts/default.html
index 7bc249ba5a068b017db29f315b2cdba4004d3395..038b2aa33db2185472b2fceebb4577f6b60b2753 100755
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -11,6 +11,16 @@
<main id="content" class="main-content" role="main">
+{% if site.closed != none %}
+ <div id="unpublished-warning">
+ This is the {{site.quarter}} {{site.status}} final website.
+ </div>
+{% elsif page.closed != none %}
+ <div id="unpublished-warning">
+ This is the {{site.quarter}} {{site.status}} final website.
+ </div>
+{% endif %}
+
{% if site.warning != none %}
<div id="unpublished-warning">
This is the {{site.quarter}} {{site.status}} draft website.
diff --git a/_sass/cayman.scss b/_sass/cayman.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ff073aa593ce7eef6ce4232c36b625a227fd2e39
--- /dev/null
+++ b/_sass/cayman.scss
@@ -0,0 +1,4 @@
+// Placeholder file. If your site uses
+// @import "{{ site.theme }}";
+// Then using this theme with jekyll-remote-theme will work fine.
+@import "jekyll-theme-cayman";
diff --git a/_sass/jekyll-theme-cayman.scss b/_sass/jekyll-theme-cayman.scss
new file mode 100644
index 0000000000000000000000000000000000000000..d3196e4af3c2f7b4ca9e2076555c180c430d91e1
--- /dev/null
+++ b/_sass/jekyll-theme-cayman.scss
@@ -0,0 +1,378 @@
+@import "normalize";
+@import "rouge-github";
+@import "variables";
+@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap');
+
+@mixin large {
+ @media screen and (min-width: #{$large-breakpoint}) {
+ @content;
+ }
+}
+
+@mixin medium {
+ @media screen and (min-width: #{$medium-breakpoint}) and (max-width: #{$large-breakpoint}) {
+ @content;
+ }
+}
+
+@mixin small {
+ @media screen and (max-width: #{$medium-breakpoint}) {
+ @content;
+ }
+}
+
+* {
+ box-sizing: border-box;
+}
+
+body {
+ padding: 0;
+ margin: 0;
+ font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 16px;
+ line-height: 1.5;
+ color: $body-text-color;
+}
+
+#skip-to-content {
+ height: 1px;
+ width: 1px;
+ position: absolute;
+ overflow: hidden;
+ top: -10px;
+
+ &:focus {
+ position: fixed;
+ top: 10px;
+ left: 10px;
+ height: auto;
+ width: auto;
+ background: invert($body-link-color);
+ outline: thick solid invert($body-link-color);
+ }
+}
+
+a {
+ color: $body-link-color;
+ text-decoration: none;
+
+ &:hover {
+ text-decoration: underline;
+ }
+}
+
+.btn {
+ display: inline-block;
+ margin-bottom: 1rem;
+ color: rgba(255, 255, 255, 0.7);
+ background-color: rgba(255, 255, 255, 0.08);
+ border-color: rgba(255, 255, 255, 0.2);
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 0.3rem;
+ transition: color 0.2s, background-color 0.2s, border-color 0.2s;
+
+ &:hover {
+ color: rgba(255, 255, 255, 0.8);
+ text-decoration: none;
+ background-color: rgba(255, 255, 255, 0.2);
+ border-color: rgba(255, 255, 255, 0.3);
+ }
+
+ + .btn {
+ margin-left: 1rem;
+ }
+
+ @include large {
+ padding: 0.75rem 1rem;
+ }
+
+ @include medium {
+ padding: 0.6rem 0.9rem;
+ font-size: 0.9rem;
+ }
+
+ @include small {
+ display: block;
+ width: 100%;
+ padding: 0.75rem;
+ font-size: 0.9rem;
+
+ + .btn {
+ margin-top: 1rem;
+ margin-left: 0;
+ }
+ }
+}
+
+.page-header {
+ color: $header-heading-color;
+ text-align: center;
+ background-color: $header-bg-color;
+ background-image: linear-gradient(120deg, $header-bg-color-secondary, $header-bg-color);
+
+ @include large {
+ padding: 5rem 6rem;
+ }
+
+ @include medium {
+ padding: 3rem 4rem;
+ }
+
+ @include small {
+ padding: 2rem 1rem;
+ }
+}
+
+.project-name {
+ margin-top: 0;
+ margin-bottom: 0.1rem;
+
+ @include large {
+ font-size: 3.25rem;
+ }
+
+ @include medium {
+ font-size: 2.25rem;
+ }
+
+ @include small {
+ font-size: 1.75rem;
+ }
+}
+
+.project-tagline {
+ margin-bottom: 2rem;
+ font-weight: normal;
+ opacity: 0.7;
+
+ @include large {
+ font-size: 1.25rem;
+ }
+
+ @include medium {
+ font-size: 1.15rem;
+ }
+
+ @include small {
+ font-size: 1rem;
+ }
+}
+
+.main-content {
+ word-wrap: break-word;
+
+ :first-child {
+ margin-top: 0;
+ }
+
+ @include large {
+ max-width: 64rem;
+ padding: 2rem 6rem;
+ margin: 0 auto;
+ font-size: 1.1rem;
+ }
+
+ @include medium {
+ padding: 2rem 4rem;
+ font-size: 1.1rem;
+ }
+
+ @include small {
+ padding: 2rem 1rem;
+ font-size: 1rem;
+ }
+
+ kbd {
+ background-color: #fafbfc;
+ border: 1px solid #c6cbd1;
+ border-bottom-color: #959da5;
+ border-radius: 3px;
+ box-shadow: inset 0 -1px 0 #959da5;
+ color: #444d56;
+ display: inline-block;
+ font-size: 11px;
+ line-height: 10px;
+ padding: 3px 5px;
+ vertical-align: middle;
+ }
+
+ img {
+ max-width: 100%;
+ }
+
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ margin-top: 2rem;
+ margin-bottom: 1rem;
+ font-weight: normal;
+ color: $section-headings-color;
+ }
+
+ p {
+ margin-bottom: 1em;
+ }
+
+ code {
+ padding: 2px 4px;
+ font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
+ font-size: 0.9rem;
+ color: $code-text-color;
+ background-color: $code-bg-color;
+ border-radius: 0.3rem;
+ }
+
+ pre {
+ padding: 0.8rem;
+ margin-top: 0;
+ margin-bottom: 1rem;
+ font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
+ color: $code-text-color;
+ word-wrap: normal;
+ background-color: $code-bg-color;
+ border: solid 1px $border-color;
+ border-radius: 0.3rem;
+
+ > code {
+ padding: 0;
+ margin: 0;
+ font-size: 0.9rem;
+ color: $code-text-color;
+ word-break: normal;
+ white-space: pre;
+ background: transparent;
+ border: 0;
+ }
+ }
+
+ .highlight {
+ margin-bottom: 1rem;
+
+ pre {
+ margin-bottom: 0;
+ word-break: normal;
+ }
+ }
+
+ .highlight pre,
+ pre {
+ padding: 0.8rem;
+ overflow: auto;
+ font-size: 0.9rem;
+ line-height: 1.45;
+ border-radius: 0.3rem;
+ -webkit-overflow-scrolling: touch;
+ }
+
+ pre code,
+ pre tt {
+ display: inline;
+ max-width: initial;
+ padding: 0;
+ margin: 0;
+ overflow: initial;
+ line-height: inherit;
+ word-wrap: normal;
+ background-color: transparent;
+ border: 0;
+
+ &:before,
+ &:after {
+ content: normal;
+ }
+ }
+
+ ul,
+ ol {
+ margin-top: 0;
+ }
+
+ blockquote {
+ padding: 0 1rem;
+ margin-left: 0;
+ color: $blockquote-text-color;
+ border-left: 0.3rem solid $border-color;
+
+ > :first-child {
+ margin-top: 0;
+ }
+
+ > :last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ table {
+ display: block;
+ width: 100%;
+ overflow: auto;
+ word-break: normal;
+ word-break: keep-all; // For Firefox to horizontally scroll wider tables.
+ -webkit-overflow-scrolling: touch;
+
+ th {
+ font-weight: bold;
+ }
+
+ th,
+ td {
+ padding: 0.5rem 1rem;
+ border: 1px solid $table-border-color;
+ }
+ }
+
+ dl {
+ padding: 0;
+
+ dt {
+ padding: 0;
+ margin-top: 1rem;
+ font-size: 1rem;
+ font-weight: bold;
+ }
+
+ dd {
+ padding: 0;
+ margin-bottom: 1rem;
+ }
+ }
+
+ hr {
+ height: 2px;
+ padding: 0;
+ margin: 1rem 0;
+ background-color: $hr-border-color;
+ border: 0;
+ }
+}
+
+.site-footer {
+ padding-top: 2rem;
+ margin-top: 2rem;
+ border-top: solid 1px $hr-border-color;
+
+ @include large {
+ font-size: 1rem;
+ }
+
+ @include medium {
+ font-size: 1rem;
+ }
+
+ @include small {
+ font-size: 0.9rem;
+ }
+}
+
+.site-footer-owner {
+ display: block;
+ font-weight: bold;
+}
+
+.site-footer-credits {
+ color: $blockquote-text-color;
+}
diff --git a/_sass/normalize.scss b/_sass/normalize.scss
new file mode 100644
index 0000000000000000000000000000000000000000..30366a6e9837b9c3b160a7b785e780e065870436
--- /dev/null
+++ b/_sass/normalize.scss
@@ -0,0 +1,424 @@
+/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
+ * user zoom.
+ */
+
+html {
+ font-family: sans-serif; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/**
+ * Remove default margin.
+ */
+
+body {
+ margin: 0;
+}
+
+/* HTML5 display definitions
+ ========================================================================== */
+
+/**
+ * Correct `block` display not defined for any HTML5 element in IE 8/9.
+ * Correct `block` display not defined for `details` or `summary` in IE 10/11
+ * and Firefox.
+ * Correct `block` display not defined for `main` in IE 11.
+ */
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+ display: block;
+}
+
+/**
+ * 1. Correct `inline-block` display not defined in IE 8/9.
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
+ */
+
+audio,
+canvas,
+progress,
+video {
+ display: inline-block; /* 1 */
+ vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Prevent modern browsers from displaying `audio` without controls.
+ * Remove excess height in iOS 5 devices.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/**
+ * Address `[hidden]` styling not present in IE 8/9/10.
+ * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
+ */
+
+[hidden],
+template {
+ display: none;
+}
+
+/* Links
+ ========================================================================== */
+
+/**
+ * Remove the gray background color from active links in IE 10.
+ */
+
+a {
+ background-color: transparent;
+}
+
+/**
+ * Improve readability when focused and also mouse hovered in all browsers.
+ */
+
+a:active,
+a:hover {
+ outline: 0;
+}
+
+/* Text-level semantics
+ ========================================================================== */
+
+/**
+ * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
+ */
+
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+
+/**
+ * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+ */
+
+b,
+strong {
+ font-weight: bold;
+}
+
+/**
+ * Address styling not present in Safari and Chrome.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/**
+ * Address variable `h1` font-size and margin within `section` and `article`
+ * contexts in Firefox 4+, Safari, and Chrome.
+ */
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+/**
+ * Address styling not present in IE 8/9.
+ */
+
+mark {
+ background: #ff0;
+ color: #000;
+}
+
+/**
+ * Address inconsistent and variable font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` affecting `line-height` in all browsers.
+ */
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sup {
+ top: -0.5em;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+/* Embedded content
+ ========================================================================== */
+
+/**
+ * Remove border when inside `a` element in IE 8/9/10.
+ */
+
+img {
+ border: 0;
+}
+
+/**
+ * Correct overflow not hidden in IE 9/10/11.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* Grouping content
+ ========================================================================== */
+
+/**
+ * Address margin not present in IE 8/9 and Safari.
+ */
+
+figure {
+ margin: 1em 40px;
+}
+
+/**
+ * Address differences between Firefox and other browsers.
+ */
+
+hr {
+ box-sizing: content-box;
+ height: 0;
+}
+
+/**
+ * Contain overflow in all browsers.
+ */
+
+pre {
+ overflow: auto;
+}
+
+/**
+ * Address odd `em`-unit font size rendering in all browsers.
+ */
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+
+/* Forms
+ ========================================================================== */
+
+/**
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
+ * styling of `select`, unless a `border` property is set.
+ */
+
+/**
+ * 1. Correct color not being inherited.
+ * Known issue: affects color of disabled elements.
+ * 2. Correct font properties not being inherited.
+ * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ color: inherit; /* 1 */
+ font: inherit; /* 2 */
+ margin: 0; /* 3 */
+}
+
+/**
+ * Address `overflow` set to `hidden` in IE 8/9/10/11.
+ */
+
+button {
+ overflow: visible;
+}
+
+/**
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
+ * All other form control elements do not inherit `text-transform` values.
+ * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+ * Correct `select` style inheritance in Firefox.
+ */
+
+button,
+select {
+ text-transform: none;
+}
+
+/**
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+ * and `video` controls.
+ * 2. Correct inability to style clickable `input` types in iOS.
+ * 3. Improve usability and consistency of cursor style between image-type
+ * `input` and others.
+ */
+
+button,
+html input[type="button"], /* 1 */
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+ cursor: pointer; /* 3 */
+}
+
+/**
+ * Re-set default cursor for disabled elements.
+ */
+
+button[disabled],
+html input[disabled] {
+ cursor: default;
+}
+
+/**
+ * Remove inner padding and border in Firefox 4+.
+ */
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+/**
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+ * the UA stylesheet.
+ */
+
+input {
+ line-height: normal;
+}
+
+/**
+ * It's recommended that you don't attempt to style these elements.
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
+ *
+ * 1. Address box sizing set to `content-box` in IE 8/9/10.
+ * 2. Remove excess padding in IE 8/9/10.
+ */
+
+input[type="checkbox"],
+input[type="radio"] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+ * `font-size` values of the `input`, it causes the cursor style of the
+ * decrement button to change from `default` to `text`.
+ */
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+/**
+ * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
+ * (include `-moz` to future-proof).
+ */
+
+input[type="search"] {
+ -webkit-appearance: textfield; /* 1 */ /* 2 */
+ box-sizing: content-box;
+}
+
+/**
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+ * Safari (but not Chrome) clips the cancel button when the search input has
+ * padding (and `textfield` appearance).
+ */
+
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/**
+ * Define consistent border, margin, and padding.
+ */
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+/**
+ * 1. Correct `color` not being inherited in IE 8/9/10/11.
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
+ */
+
+legend {
+ border: 0; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Remove default vertical scrollbar in IE 8/9/10/11.
+ */
+
+textarea {
+ overflow: auto;
+}
+
+/**
+ * Don't inherit the `font-weight` (applied by a rule above).
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
+ */
+
+optgroup {
+ font-weight: bold;
+}
+
+/* Tables
+ ========================================================================== */
+
+/**
+ * Remove most spacing between table cells.
+ */
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+td,
+th {
+ padding: 0;
+}
diff --git a/_sass/rouge-github.scss b/_sass/rouge-github.scss
new file mode 100644
index 0000000000000000000000000000000000000000..daf76adee98955fbdf9afff089d13dd87c201b9c
--- /dev/null
+++ b/_sass/rouge-github.scss
@@ -0,0 +1,209 @@
+.highlight table td { padding: 5px; }
+.highlight table pre { margin: 0; }
+.highlight .cm {
+ color: #999988;
+ font-style: italic;
+}
+.highlight .cp {
+ color: #999999;
+ font-weight: bold;
+}
+.highlight .c1 {
+ color: #999988;
+ font-style: italic;
+}
+.highlight .cs {
+ color: #999999;
+ font-weight: bold;
+ font-style: italic;
+}
+.highlight .c, .highlight .cd {
+ color: #999988;
+ font-style: italic;
+}
+.highlight .err {
+ color: #a61717;
+ background-color: #e3d2d2;
+}
+.highlight .gd {
+ color: #000000;
+ background-color: #ffdddd;
+}
+.highlight .ge {
+ color: #000000;
+ font-style: italic;
+}
+.highlight .gr {
+ color: #aa0000;
+}
+.highlight .gh {
+ color: #999999;
+}
+.highlight .gi {
+ color: #000000;
+ background-color: #ddffdd;
+}
+.highlight .go {
+ color: #888888;
+}
+.highlight .gp {
+ color: #555555;
+}
+.highlight .gs {
+ font-weight: bold;
+}
+.highlight .gu {
+ color: #aaaaaa;
+}
+.highlight .gt {
+ color: #aa0000;
+}
+.highlight .kc {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .kd {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .kn {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .kp {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .kr {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .kt {
+ color: #445588;
+ font-weight: bold;
+}
+.highlight .k, .highlight .kv {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .mf {
+ color: #009999;
+}
+.highlight .mh {
+ color: #009999;
+}
+.highlight .il {
+ color: #009999;
+}
+.highlight .mi {
+ color: #009999;
+}
+.highlight .mo {
+ color: #009999;
+}
+.highlight .m, .highlight .mb, .highlight .mx {
+ color: #009999;
+}
+.highlight .sb {
+ color: #d14;
+}
+.highlight .sc {
+ color: #d14;
+}
+.highlight .sd {
+ color: #d14;
+}
+.highlight .s2 {
+ color: #d14;
+}
+.highlight .se {
+ color: #d14;
+}
+.highlight .sh {
+ color: #d14;
+}
+.highlight .si {
+ color: #d14;
+}
+.highlight .sx {
+ color: #d14;
+}
+.highlight .sr {
+ color: #009926;
+}
+.highlight .s1 {
+ color: #d14;
+}
+.highlight .ss {
+ color: #990073;
+}
+.highlight .s {
+ color: #d14;
+}
+.highlight .na {
+ color: #008080;
+}
+.highlight .bp {
+ color: #999999;
+}
+.highlight .nb {
+ color: #0086B3;
+}
+.highlight .nc {
+ color: #445588;
+ font-weight: bold;
+}
+.highlight .no {
+ color: #008080;
+}
+.highlight .nd {
+ color: #3c5d5d;
+ font-weight: bold;
+}
+.highlight .ni {
+ color: #800080;
+}
+.highlight .ne {
+ color: #990000;
+ font-weight: bold;
+}
+.highlight .nf {
+ color: #990000;
+ font-weight: bold;
+}
+.highlight .nl {
+ color: #990000;
+ font-weight: bold;
+}
+.highlight .nn {
+ color: #555555;
+}
+.highlight .nt {
+ color: #000080;
+}
+.highlight .vc {
+ color: #008080;
+}
+.highlight .vg {
+ color: #008080;
+}
+.highlight .vi {
+ color: #008080;
+}
+.highlight .nv {
+ color: #008080;
+}
+.highlight .ow {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .o {
+ color: #000000;
+ font-weight: bold;
+}
+.highlight .w {
+ color: #bbbbbb;
+}
+.highlight {
+ background-color: #f8f8f8;
+}
diff --git a/_sass/variables.scss b/_sass/variables.scss
new file mode 100644
index 0000000000000000000000000000000000000000..bf564509c845773b83e9cdb564c564721e294c3a
--- /dev/null
+++ b/_sass/variables.scss
@@ -0,0 +1,23 @@
+// Breakpoints
+$large-breakpoint: 64em !default;
+$medium-breakpoint: 42em !default;
+
+// Headers
+$header-heading-color: #fff !default;
+$header-bg-color: #159957 !default;
+$header-bg-color-secondary: #155799 !default;
+
+// Text
+$section-headings-color: #159957 !default;
+$body-text-color: #606c71 !default;
+$body-link-color: #1e6bb8 !default;
+$blockquote-text-color: #819198 !default;
+
+// Code
+$code-bg-color: #f3f6fa !default;
+$code-text-color: #567482 !default;
+
+// Borders
+$border-color: #dce6f0 !default;
+$table-border-color: #e9ebec !default;
+$hr-border-color: #eff0f1 !default;
diff --git a/_scss/access-website.scss b/_scss/access-website.scss
new file mode 100644
index 0000000000000000000000000000000000000000..16d906f7ef652bcee226667e885476d1b503e746
--- /dev/null
+++ b/_scss/access-website.scss
@@ -0,0 +1,8 @@
+/* TYPE_ON_STRAP Main style sheet */
+
+/* External */
+// CSS from external sources
+@import 'font-awesome';
+
+// Other files ...
+
diff --git a/_scss/font-awesome/_animated.scss b/_scss/font-awesome/_animated.scss
new file mode 100644
index 0000000000000000000000000000000000000000..93555b2f43767cf620103860a6110b13cc8b7dbd
--- /dev/null
+++ b/_scss/font-awesome/_animated.scss
@@ -0,0 +1,153 @@
+// animating icons
+// --------------------------
+
+.#{$fa-css-prefix}-beat {
+ animation-name: #{$fa-css-prefix}-beat;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, ease-in-out);
+}
+
+.#{$fa-css-prefix}-bounce {
+ animation-name: #{$fa-css-prefix}-bounce;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(0.280, 0.840, 0.420, 1));
+}
+
+.#{$fa-css-prefix}-fade {
+ animation-name: #{$fa-css-prefix}-fade;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
+}
+
+.#{$fa-css-prefix}-beat-fade {
+ animation-name: #{$fa-css-prefix}-beat-fade;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
+}
+
+.#{$fa-css-prefix}-flip {
+ animation-name: #{$fa-css-prefix}-flip;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, ease-in-out);
+}
+
+.#{$fa-css-prefix}-shake {
+ animation-name: #{$fa-css-prefix}-shake;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, linear);
+}
+
+.#{$fa-css-prefix}-spin {
+ animation-name: #{$fa-css-prefix}-spin;
+ animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 2s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, linear);
+}
+
+.#{$fa-css-prefix}-spin-reverse {
+ --#{$fa-css-prefix}-animation-direction: reverse;
+}
+
+.#{$fa-css-prefix}-pulse,
+.#{$fa-css-prefix}-spin-pulse {
+ animation-name: #{$fa-css-prefix}-spin;
+ animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
+ animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
+ animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+ animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, steps(8));
+}
+
+// if agent or operating system prefers reduced motion, disable animations
+// see: https://www.smashingmagazine.com/2020/09/design-reduced-motion-sensitivities/
+// see: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion
+@media (prefers-reduced-motion: reduce) {
+ .#{$fa-css-prefix}-beat,
+ .#{$fa-css-prefix}-bounce,
+ .#{$fa-css-prefix}-fade,
+ .#{$fa-css-prefix}-beat-fade,
+ .#{$fa-css-prefix}-flip,
+ .#{$fa-css-prefix}-pulse,
+ .#{$fa-css-prefix}-shake,
+ .#{$fa-css-prefix}-spin,
+ .#{$fa-css-prefix}-spin-pulse {
+ animation-delay: -1ms;
+ animation-duration: 1ms;
+ animation-iteration-count: 1;
+ transition-delay: 0s;
+ transition-duration: 0s;
+ }
+}
+
+@keyframes #{$fa-css-prefix}-beat {
+ 0%, 90% { transform: scale(1); }
+ 45% { transform: scale(var(--#{$fa-css-prefix}-beat-scale, 1.25)); }
+}
+
+@keyframes #{$fa-css-prefix}-bounce {
+ 0% { transform: scale(1,1) translateY(0); }
+ 10% { transform: scale(var(--#{$fa-css-prefix}-bounce-start-scale-x, 1.1),var(--#{$fa-css-prefix}-bounce-start-scale-y, 0.9)) translateY(0); }
+ 30% { transform: scale(var(--#{$fa-css-prefix}-bounce-jump-scale-x, 0.9),var(--#{$fa-css-prefix}-bounce-jump-scale-y, 1.1)) translateY(var(--#{$fa-css-prefix}-bounce-height, -0.5em)); }
+ 50% { transform: scale(var(--#{$fa-css-prefix}-bounce-land-scale-x, 1.05),var(--#{$fa-css-prefix}-bounce-land-scale-y, 0.95)) translateY(0); }
+ 57% { transform: scale(1,1) translateY(var(--#{$fa-css-prefix}-bounce-rebound, -0.125em)); }
+ 64% { transform: scale(1,1) translateY(0); }
+ 100% { transform: scale(1,1) translateY(0); }
+}
+
+@keyframes #{$fa-css-prefix}-fade {
+ 50% { opacity: var(--#{$fa-css-prefix}-fade-opacity, 0.4); }
+}
+
+@keyframes #{$fa-css-prefix}-beat-fade {
+ 0%, 100% {
+ opacity: var(--#{$fa-css-prefix}-beat-fade-opacity, 0.4);
+ transform: scale(1);
+ }
+ 50% {
+ opacity: 1;
+ transform: scale(var(--#{$fa-css-prefix}-beat-fade-scale, 1.125));
+ }
+}
+
+@keyframes #{$fa-css-prefix}-flip {
+ 50% {
+ transform: rotate3d(var(--#{$fa-css-prefix}-flip-x, 0), var(--#{$fa-css-prefix}-flip-y, 1), var(--#{$fa-css-prefix}-flip-z, 0), var(--#{$fa-css-prefix}-flip-angle, -180deg));
+ }
+}
+
+@keyframes #{$fa-css-prefix}-shake {
+ 0% { transform: rotate(-15deg); }
+ 4% { transform: rotate(15deg); }
+ 8%, 24% { transform: rotate(-18deg); }
+ 12%, 28% { transform: rotate(18deg); }
+ 16% { transform: rotate(-22deg); }
+ 20% { transform: rotate(22deg); }
+ 32% { transform: rotate(-12deg); }
+ 36% { transform: rotate(12deg); }
+ 40%, 100% { transform: rotate(0deg); }
+}
+
+@keyframes #{$fa-css-prefix}-spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
diff --git a/_scss/font-awesome/_bordered-pulled.scss b/_scss/font-awesome/_bordered-pulled.scss
new file mode 100644
index 0000000000000000000000000000000000000000..9068253a7421d8abf8d7c20f56f826cad77503ff
--- /dev/null
+++ b/_scss/font-awesome/_bordered-pulled.scss
@@ -0,0 +1,20 @@
+// bordered + pulled icons
+// -------------------------
+
+.#{$fa-css-prefix}-border {
+ border-color: var(--#{$fa-css-prefix}-border-color, #{$fa-border-color});
+ border-radius: var(--#{$fa-css-prefix}-border-radius, #{$fa-border-radius});
+ border-style: var(--#{$fa-css-prefix}-border-style, #{$fa-border-style});
+ border-width: var(--#{$fa-css-prefix}-border-width, #{$fa-border-width});
+ padding: var(--#{$fa-css-prefix}-border-padding, #{$fa-border-padding});
+}
+
+.#{$fa-css-prefix}-pull-left {
+ float: left;
+ margin-right: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin});
+}
+
+.#{$fa-css-prefix}-pull-right {
+ float: right;
+ margin-left: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin});
+}
diff --git a/_scss/font-awesome/_core.scss b/_scss/font-awesome/_core.scss
new file mode 100644
index 0000000000000000000000000000000000000000..1b2fd992052ad21b344fee368946758c136fdde1
--- /dev/null
+++ b/_scss/font-awesome/_core.scss
@@ -0,0 +1,43 @@
+// base icon class definition
+// -------------------------
+
+.#{$fa-css-prefix} {
+ font-family: var(--#{$fa-css-prefix}-style-family, '#{$fa-style-family}');
+ font-weight: var(--#{$fa-css-prefix}-style, #{$fa-style});
+}
+
+.#{$fa-css-prefix},
+.#{$fa-css-prefix}-classic,
+.#{$fa-css-prefix}-sharp,
+.fas,
+.#{$fa-css-prefix}-solid,
+.far,
+.#{$fa-css-prefix}-regular,
+.fab,
+.#{$fa-css-prefix}-brands {
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ display: var(--#{$fa-css-prefix}-display, #{$fa-display});
+ font-style: normal;
+ font-variant: normal;
+ line-height: 1;
+ text-rendering: auto;
+}
+
+.fas,
+.#{$fa-css-prefix}-classic,
+.#{$fa-css-prefix}-solid,
+.far,
+.#{$fa-css-prefix}-regular {
+ font-family: 'Font Awesome 6 Free';
+}
+
+.fab,
+.#{$fa-css-prefix}-brands {
+ font-family: 'Font Awesome 6 Brands';
+}
+
+
+%fa-icon {
+ @include fa-icon;
+}
diff --git a/_scss/font-awesome/_fixed-width.scss b/_scss/font-awesome/_fixed-width.scss
new file mode 100644
index 0000000000000000000000000000000000000000..72342368af23453b0a00e4ffc81e86bb0f563afc
--- /dev/null
+++ b/_scss/font-awesome/_fixed-width.scss
@@ -0,0 +1,7 @@
+// fixed-width icons
+// -------------------------
+
+.#{$fa-css-prefix}-fw {
+ text-align: center;
+ width: $fa-fw-width;
+}
diff --git a/_scss/font-awesome/_font-awesome.scss b/_scss/font-awesome/_font-awesome.scss
new file mode 100644
index 0000000000000000000000000000000000000000..8c9ab34e815444c4075cc5c5ce9f1a8f3adb4107
--- /dev/null
+++ b/_scss/font-awesome/_font-awesome.scss
@@ -0,0 +1,11 @@
+// Overriding variables
+$fa-inverse: var(--background); // For it to use the theme's background colour
+$fa-font-path: "../fonts/font-awesome" !default; // To define the font's path
+
+// Importing font-awesome's main files
+@import 'font-awesome/fontawesome';
+@import 'font-awesome/brands';
+@import 'font-awesome/regular';
+@import 'font-awesome/solid';
+@import 'font-awesome/v4-shims';
+
diff --git a/_scss/font-awesome/_functions.scss b/_scss/font-awesome/_functions.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a17ffe87cc48215081b6af9ad4a6ddb1b20ca3b7
--- /dev/null
+++ b/_scss/font-awesome/_functions.scss
@@ -0,0 +1,57 @@
+// functions
+// --------------------------
+
+// fa-content: convenience function used to set content property
+@function fa-content($fa-var) {
+ @return unquote("\"#{ $fa-var }\"");
+}
+
+// fa-divide: Originally obtained from the Bootstrap https://github.com/twbs/bootstrap
+//
+// Licensed under: The MIT License (MIT)
+//
+// Copyright (c) 2011-2021 Twitter, Inc.
+// Copyright (c) 2011-2021 The Bootstrap Authors
+//
+// Permission is hereby granted, free of charge, to any person obtaining a copy
+// of this software and associated documentation files (the "Software"), to deal
+// in the Software without restriction, including without limitation the rights
+// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+// copies of the Software, and to permit persons to whom the Software is
+// furnished to do so, subject to the following conditions:
+//
+// The above copyright notice and this permission notice shall be included in
+// all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+// THE SOFTWARE.
+
+@function fa-divide($dividend, $divisor, $precision: 10) {
+ $sign: if($dividend > 0 and $divisor > 0, 1, -1);
+ $dividend: abs($dividend);
+ $divisor: abs($divisor);
+ $quotient: 0;
+ $remainder: $dividend;
+ @if $dividend == 0 {
+ @return 0;
+ }
+ @if $divisor == 0 {
+ @error "Cannot divide by 0";
+ }
+ @if $divisor == 1 {
+ @return $dividend;
+ }
+ @while $remainder >= $divisor {
+ $quotient: $quotient + 1;
+ $remainder: $remainder - $divisor;
+ }
+ @if $remainder > 0 and $precision > 0 {
+ $remainder: fa-divide($remainder * 10, $divisor, $precision - 1) * .1;
+ }
+ @return ($quotient + $remainder) * $sign;
+}
diff --git a/_scss/font-awesome/_icons.scss b/_scss/font-awesome/_icons.scss
new file mode 100644
index 0000000000000000000000000000000000000000..0f5592650f5ca8fc3e0a8416e5b4903f32f24df3
--- /dev/null
+++ b/_scss/font-awesome/_icons.scss
@@ -0,0 +1,10 @@
+// specific icon class definition
+// -------------------------
+
+/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
+readers do not read off random characters that represent icons */
+
+@each $name, $icon in $fa-icons {
+ .#{$fa-css-prefix}-#{$name}::before { content: unquote("\"#{ $icon }\""); }
+}
+
diff --git a/_scss/font-awesome/_list.scss b/_scss/font-awesome/_list.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ced36e20a25ca84f4e8936654ce5bab94daedbcc
--- /dev/null
+++ b/_scss/font-awesome/_list.scss
@@ -0,0 +1,18 @@
+// icons in a list
+// -------------------------
+
+.#{$fa-css-prefix}-ul {
+ list-style-type: none;
+ margin-left: var(--#{$fa-css-prefix}-li-margin, #{$fa-li-margin});
+ padding-left: 0;
+
+ > li { position: relative; }
+}
+
+.#{$fa-css-prefix}-li {
+ left: calc(var(--#{$fa-css-prefix}-li-width, #{$fa-li-width}) * -1);
+ position: absolute;
+ text-align: center;
+ width: var(--#{$fa-css-prefix}-li-width, #{$fa-li-width});
+ line-height: inherit;
+}
diff --git a/_scss/font-awesome/_mixins.scss b/_scss/font-awesome/_mixins.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e06b69aa54bd7e0c1674e489227a977ce8bca33e
--- /dev/null
+++ b/_scss/font-awesome/_mixins.scss
@@ -0,0 +1,75 @@
+// mixins
+// --------------------------
+
+// base rendering for an icon
+@mixin fa-icon {
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ display: inline-block;
+ font-style: normal;
+ font-variant: normal;
+ font-weight: normal;
+ line-height: 1;
+}
+
+// sets relative font-sizing and alignment (in _sizing)
+@mixin fa-size ($font-size) {
+ font-size: fa-divide($font-size, $fa-size-scale-base) * 1em; // converts step in sizing scale into an em-based value that's relative to the scale's base
+ line-height: fa-divide(1, $font-size) * 1em; // sets the line-height of the icon back to that of it's parent
+ vertical-align: (fa-divide(6, $font-size) - fa-divide(3, 8)) * 1em; // vertically centers the icon taking into account the surrounding text's descender
+}
+
+// only display content to screen readers
+// see: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
+// see: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
+@mixin fa-sr-only() {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0, 0, 0, 0);
+ white-space: nowrap;
+ border-width: 0;
+}
+
+// use in conjunction with .sr-only to only display content when it's focused
+@mixin fa-sr-only-focusable() {
+ &:not(:focus) {
+ @include fa-sr-only();
+ }
+}
+
+// sets a specific icon family to use alongside style + icon mixins
+
+// convenience mixins for declaring pseudo-elements by CSS variable,
+// including all style-specific font properties, and both the ::before
+// and ::after elements in the duotone case.
+@mixin fa-icon-solid($fa-var) {
+ @extend %fa-icon;
+ @extend .fa-solid;
+
+ &::before {
+ content: unquote("\"#{ $fa-var }\"");
+ }
+}
+
+@mixin fa-icon-regular($fa-var) {
+ @extend %fa-icon;
+ @extend .fa-regular;
+
+ &::before {
+ content: unquote("\"#{ $fa-var }\"");
+ }
+}
+
+@mixin fa-icon-brands($fa-var) {
+ @extend %fa-icon;
+ @extend .fa-brands;
+
+ &::before {
+ content: unquote("\"#{ $fa-var }\"");
+ }
+}
+
diff --git a/_scss/font-awesome/_rotated-flipped.scss b/_scss/font-awesome/_rotated-flipped.scss
new file mode 100644
index 0000000000000000000000000000000000000000..f27fabee400cc181e32a3dfe19d30c7b9e899626
--- /dev/null
+++ b/_scss/font-awesome/_rotated-flipped.scss
@@ -0,0 +1,31 @@
+// rotating + flipping icons
+// -------------------------
+
+.#{$fa-css-prefix}-rotate-90 {
+ transform: rotate(90deg);
+}
+
+.#{$fa-css-prefix}-rotate-180 {
+ transform: rotate(180deg);
+}
+
+.#{$fa-css-prefix}-rotate-270 {
+ transform: rotate(270deg);
+}
+
+.#{$fa-css-prefix}-flip-horizontal {
+ transform: scale(-1, 1);
+}
+
+.#{$fa-css-prefix}-flip-vertical {
+ transform: scale(1, -1);
+}
+
+.#{$fa-css-prefix}-flip-both,
+.#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical {
+ transform: scale(-1, -1);
+}
+
+.#{$fa-css-prefix}-rotate-by {
+ transform: rotate(var(--#{$fa-css-prefix}-rotate-angle, none));
+}
diff --git a/_scss/font-awesome/_screen-reader.scss b/_scss/font-awesome/_screen-reader.scss
new file mode 100644
index 0000000000000000000000000000000000000000..2beb887b491b865b8259ad43a43281f317b2cdc1
--- /dev/null
+++ b/_scss/font-awesome/_screen-reader.scss
@@ -0,0 +1,14 @@
+// screen-reader utilities
+// -------------------------
+
+// only display content to screen readers
+.sr-only,
+.#{$fa-css-prefix}-sr-only {
+ @include fa-sr-only;
+}
+
+// use in conjunction with .sr-only to only display content when it's focused
+.sr-only-focusable,
+.#{$fa-css-prefix}-sr-only-focusable {
+ @include fa-sr-only-focusable;
+}
diff --git a/_scss/font-awesome/_shims.scss b/_scss/font-awesome/_shims.scss
new file mode 100644
index 0000000000000000000000000000000000000000..7809aa649012c517cce2b692cfc881b18d9057b1
--- /dev/null
+++ b/_scss/font-awesome/_shims.scss
@@ -0,0 +1,2042 @@
+.#{$fa-css-prefix}.#{$fa-css-prefix}-glass:before { content: unquote("\"#{ $fa-var-martini-glass-empty }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-envelope-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-envelope-o:before { content: unquote("\"#{ $fa-var-envelope }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-o:before { content: unquote("\"#{ $fa-var-star }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-remove:before { content: unquote("\"#{ $fa-var-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-close:before { content: unquote("\"#{ $fa-var-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gear:before { content: unquote("\"#{ $fa-var-gear }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-trash-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-trash-o:before { content: unquote("\"#{ $fa-var-trash-can }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-home:before { content: unquote("\"#{ $fa-var-house }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-o:before { content: unquote("\"#{ $fa-var-file }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-clock-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-clock-o:before { content: unquote("\"#{ $fa-var-clock }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-down {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-down:before { content: unquote("\"#{ $fa-var-circle-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-up {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-up:before { content: unquote("\"#{ $fa-var-circle-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-play-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-play-circle-o:before { content: unquote("\"#{ $fa-var-circle-play }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-repeat:before { content: unquote("\"#{ $fa-var-arrow-rotate-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rotate-right:before { content: unquote("\"#{ $fa-var-arrow-rotate-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-refresh:before { content: unquote("\"#{ $fa-var-arrows-rotate }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-list-alt {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-list-alt:before { content: unquote("\"#{ $fa-var-rectangle-list }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dedent:before { content: unquote("\"#{ $fa-var-outdent }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-video-camera:before { content: unquote("\"#{ $fa-var-video }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-picture-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-picture-o:before { content: unquote("\"#{ $fa-var-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-photo {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-photo:before { content: unquote("\"#{ $fa-var-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-image {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-image:before { content: unquote("\"#{ $fa-var-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-map-marker:before { content: unquote("\"#{ $fa-var-location-dot }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pencil-square-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pencil-square-o:before { content: unquote("\"#{ $fa-var-pen-to-square }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-edit {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-edit:before { content: unquote("\"#{ $fa-var-pen-to-square }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-share-square-o:before { content: unquote("\"#{ $fa-var-share-from-square }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-check-square-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-check-square-o:before { content: unquote("\"#{ $fa-var-square-check }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrows:before { content: unquote("\"#{ $fa-var-up-down-left-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-times-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-times-circle-o:before { content: unquote("\"#{ $fa-var-circle-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-check-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-check-circle-o:before { content: unquote("\"#{ $fa-var-circle-check }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mail-forward:before { content: unquote("\"#{ $fa-var-share }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-expand:before { content: unquote("\"#{ $fa-var-up-right-and-down-left-from-center }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-compress:before { content: unquote("\"#{ $fa-var-down-left-and-up-right-to-center }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eye {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eye-slash {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-warning:before { content: unquote("\"#{ $fa-var-triangle-exclamation }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar:before { content: unquote("\"#{ $fa-var-calendar-days }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrows-v:before { content: unquote("\"#{ $fa-var-up-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrows-h:before { content: unquote("\"#{ $fa-var-left-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bar-chart:before { content: unquote("\"#{ $fa-var-chart-column }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bar-chart-o:before { content: unquote("\"#{ $fa-var-chart-column }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-twitter-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-twitter-square:before { content: unquote("\"#{ $fa-var-square-twitter }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-square:before { content: unquote("\"#{ $fa-var-square-facebook }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gears:before { content: unquote("\"#{ $fa-var-gears }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thumbs-o-up {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thumbs-o-up:before { content: unquote("\"#{ $fa-var-thumbs-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thumbs-o-down {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thumbs-o-down:before { content: unquote("\"#{ $fa-var-thumbs-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-heart-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-heart-o:before { content: unquote("\"#{ $fa-var-heart }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sign-out:before { content: unquote("\"#{ $fa-var-right-from-bracket }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linkedin-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linkedin-square:before { content: unquote("\"#{ $fa-var-linkedin }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thumb-tack:before { content: unquote("\"#{ $fa-var-thumbtack }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-external-link:before { content: unquote("\"#{ $fa-var-up-right-from-square }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sign-in:before { content: unquote("\"#{ $fa-var-right-to-bracket }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-github-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-github-square:before { content: unquote("\"#{ $fa-var-square-github }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lemon-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lemon-o:before { content: unquote("\"#{ $fa-var-lemon }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-square-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-square-o:before { content: unquote("\"#{ $fa-var-square }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bookmark-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bookmark-o:before { content: unquote("\"#{ $fa-var-bookmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-twitter {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook:before { content: unquote("\"#{ $fa-var-facebook-f }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-f {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-f:before { content: unquote("\"#{ $fa-var-facebook-f }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-github {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-credit-card {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-feed:before { content: unquote("\"#{ $fa-var-rss }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hdd-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hdd-o:before { content: unquote("\"#{ $fa-var-hard-drive }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-right {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-right:before { content: unquote("\"#{ $fa-var-hand-point-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-left {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-left:before { content: unquote("\"#{ $fa-var-hand-point-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-up {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-up:before { content: unquote("\"#{ $fa-var-hand-point-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-down {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-o-down:before { content: unquote("\"#{ $fa-var-hand-point-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-globe:before { content: unquote("\"#{ $fa-var-earth-americas }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tasks:before { content: unquote("\"#{ $fa-var-bars-progress }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrows-alt:before { content: unquote("\"#{ $fa-var-maximize }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-group:before { content: unquote("\"#{ $fa-var-users }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-chain:before { content: unquote("\"#{ $fa-var-link }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cut:before { content: unquote("\"#{ $fa-var-scissors }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-files-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-files-o:before { content: unquote("\"#{ $fa-var-copy }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-floppy-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-floppy-o:before { content: unquote("\"#{ $fa-var-floppy-disk }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-save {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-save:before { content: unquote("\"#{ $fa-var-floppy-disk }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-navicon:before { content: unquote("\"#{ $fa-var-bars }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-reorder:before { content: unquote("\"#{ $fa-var-bars }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-magic:before { content: unquote("\"#{ $fa-var-wand-magic-sparkles }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pinterest {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pinterest-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pinterest-square:before { content: unquote("\"#{ $fa-var-square-pinterest }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-square:before { content: unquote("\"#{ $fa-var-square-google-plus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus:before { content: unquote("\"#{ $fa-var-google-plus-g }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-money:before { content: unquote("\"#{ $fa-var-money-bill-1 }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-unsorted:before { content: unquote("\"#{ $fa-var-sort }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-desc:before { content: unquote("\"#{ $fa-var-sort-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-asc:before { content: unquote("\"#{ $fa-var-sort-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linkedin {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linkedin:before { content: unquote("\"#{ $fa-var-linkedin-in }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rotate-left:before { content: unquote("\"#{ $fa-var-arrow-rotate-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-legal:before { content: unquote("\"#{ $fa-var-gavel }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tachometer:before { content: unquote("\"#{ $fa-var-gauge-high }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dashboard:before { content: unquote("\"#{ $fa-var-gauge-high }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-comment-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-comment-o:before { content: unquote("\"#{ $fa-var-comment }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-comments-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-comments-o:before { content: unquote("\"#{ $fa-var-comments }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-flash:before { content: unquote("\"#{ $fa-var-bolt }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-clipboard:before { content: unquote("\"#{ $fa-var-paste }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lightbulb-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lightbulb-o:before { content: unquote("\"#{ $fa-var-lightbulb }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-exchange:before { content: unquote("\"#{ $fa-var-right-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cloud-download:before { content: unquote("\"#{ $fa-var-cloud-arrow-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cloud-upload:before { content: unquote("\"#{ $fa-var-cloud-arrow-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bell-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bell-o:before { content: unquote("\"#{ $fa-var-bell }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cutlery:before { content: unquote("\"#{ $fa-var-utensils }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-text-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-text-o:before { content: unquote("\"#{ $fa-var-file-lines }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-building-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-building-o:before { content: unquote("\"#{ $fa-var-building }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hospital-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hospital-o:before { content: unquote("\"#{ $fa-var-hospital }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tablet:before { content: unquote("\"#{ $fa-var-tablet-screen-button }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mobile:before { content: unquote("\"#{ $fa-var-mobile-screen-button }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mobile-phone:before { content: unquote("\"#{ $fa-var-mobile-screen-button }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-circle-o:before { content: unquote("\"#{ $fa-var-circle }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mail-reply:before { content: unquote("\"#{ $fa-var-reply }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-github-alt {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-folder-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-folder-o:before { content: unquote("\"#{ $fa-var-folder }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-folder-open-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-folder-open-o:before { content: unquote("\"#{ $fa-var-folder-open }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-smile-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-smile-o:before { content: unquote("\"#{ $fa-var-face-smile }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-frown-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-frown-o:before { content: unquote("\"#{ $fa-var-face-frown }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-meh-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-meh-o:before { content: unquote("\"#{ $fa-var-face-meh }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-keyboard-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-keyboard-o:before { content: unquote("\"#{ $fa-var-keyboard }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-flag-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-flag-o:before { content: unquote("\"#{ $fa-var-flag }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mail-reply-all:before { content: unquote("\"#{ $fa-var-reply-all }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-o:before { content: unquote("\"#{ $fa-var-star-half-stroke }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-empty {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-empty:before { content: unquote("\"#{ $fa-var-star-half-stroke }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-full {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-star-half-full:before { content: unquote("\"#{ $fa-var-star-half-stroke }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-code-fork:before { content: unquote("\"#{ $fa-var-code-branch }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-chain-broken:before { content: unquote("\"#{ $fa-var-link-slash }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-unlink:before { content: unquote("\"#{ $fa-var-link-slash }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-o:before { content: unquote("\"#{ $fa-var-calendar }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-maxcdn {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-html5 {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-css3 {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-unlock-alt:before { content: unquote("\"#{ $fa-var-unlock }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-minus-square-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-minus-square-o:before { content: unquote("\"#{ $fa-var-square-minus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-level-up:before { content: unquote("\"#{ $fa-var-turn-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-level-down:before { content: unquote("\"#{ $fa-var-turn-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pencil-square:before { content: unquote("\"#{ $fa-var-square-pen }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-external-link-square:before { content: unquote("\"#{ $fa-var-square-up-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-compass {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-down {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-down:before { content: unquote("\"#{ $fa-var-square-caret-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-down {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-down:before { content: unquote("\"#{ $fa-var-square-caret-down }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-up {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-up:before { content: unquote("\"#{ $fa-var-square-caret-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-up {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-up:before { content: unquote("\"#{ $fa-var-square-caret-up }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-right {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-right:before { content: unquote("\"#{ $fa-var-square-caret-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-right {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-right:before { content: unquote("\"#{ $fa-var-square-caret-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eur:before { content: unquote("\"#{ $fa-var-euro-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-euro:before { content: unquote("\"#{ $fa-var-euro-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gbp:before { content: unquote("\"#{ $fa-var-sterling-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-usd:before { content: unquote("\"#{ $fa-var-dollar-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dollar:before { content: unquote("\"#{ $fa-var-dollar-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-inr:before { content: unquote("\"#{ $fa-var-indian-rupee-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rupee:before { content: unquote("\"#{ $fa-var-indian-rupee-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-jpy:before { content: unquote("\"#{ $fa-var-yen-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cny:before { content: unquote("\"#{ $fa-var-yen-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rmb:before { content: unquote("\"#{ $fa-var-yen-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yen:before { content: unquote("\"#{ $fa-var-yen-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rub:before { content: unquote("\"#{ $fa-var-ruble-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ruble:before { content: unquote("\"#{ $fa-var-ruble-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rouble:before { content: unquote("\"#{ $fa-var-ruble-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-krw:before { content: unquote("\"#{ $fa-var-won-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-won:before { content: unquote("\"#{ $fa-var-won-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-btc {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bitcoin {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bitcoin:before { content: unquote("\"#{ $fa-var-btc }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-text:before { content: unquote("\"#{ $fa-var-file-lines }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-alpha-asc:before { content: unquote("\"#{ $fa-var-arrow-down-a-z }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-alpha-desc:before { content: unquote("\"#{ $fa-var-arrow-down-z-a }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-amount-asc:before { content: unquote("\"#{ $fa-var-arrow-down-short-wide }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-amount-desc:before { content: unquote("\"#{ $fa-var-arrow-down-wide-short }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-numeric-asc:before { content: unquote("\"#{ $fa-var-arrow-down-1-9 }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sort-numeric-desc:before { content: unquote("\"#{ $fa-var-arrow-down-9-1 }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-youtube-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-youtube-square:before { content: unquote("\"#{ $fa-var-square-youtube }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-youtube {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-xing {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-xing-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-xing-square:before { content: unquote("\"#{ $fa-var-square-xing }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-youtube-play {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-youtube-play:before { content: unquote("\"#{ $fa-var-youtube }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dropbox {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stack-overflow {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-instagram {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-flickr {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-adn {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bitbucket {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bitbucket-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bitbucket-square:before { content: unquote("\"#{ $fa-var-bitbucket }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tumblr {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tumblr-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tumblr-square:before { content: unquote("\"#{ $fa-var-square-tumblr }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-long-arrow-down:before { content: unquote("\"#{ $fa-var-down-long }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-long-arrow-up:before { content: unquote("\"#{ $fa-var-up-long }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-long-arrow-left:before { content: unquote("\"#{ $fa-var-left-long }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-long-arrow-right:before { content: unquote("\"#{ $fa-var-right-long }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-apple {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-windows {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-android {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linux {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dribbble {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-skype {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-foursquare {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-trello {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gratipay {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gittip {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gittip:before { content: unquote("\"#{ $fa-var-gratipay }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sun-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sun-o:before { content: unquote("\"#{ $fa-var-sun }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-moon-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-moon-o:before { content: unquote("\"#{ $fa-var-moon }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vk {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-weibo {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-renren {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pagelines {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stack-exchange {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-right {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-right:before { content: unquote("\"#{ $fa-var-circle-right }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-left {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-arrow-circle-o-left:before { content: unquote("\"#{ $fa-var-circle-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-left {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-caret-square-o-left:before { content: unquote("\"#{ $fa-var-square-caret-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-left {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-toggle-left:before { content: unquote("\"#{ $fa-var-square-caret-left }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dot-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dot-circle-o:before { content: unquote("\"#{ $fa-var-circle-dot }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vimeo-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vimeo-square:before { content: unquote("\"#{ $fa-var-square-vimeo }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-try:before { content: unquote("\"#{ $fa-var-turkish-lira-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-turkish-lira:before { content: unquote("\"#{ $fa-var-turkish-lira-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-plus-square-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-plus-square-o:before { content: unquote("\"#{ $fa-var-square-plus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-slack {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wordpress {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-openid {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-institution:before { content: unquote("\"#{ $fa-var-building-columns }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bank:before { content: unquote("\"#{ $fa-var-building-columns }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mortar-board:before { content: unquote("\"#{ $fa-var-graduation-cap }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yahoo {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-reddit {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-reddit-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-reddit-square:before { content: unquote("\"#{ $fa-var-square-reddit }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stumbleupon-circle {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stumbleupon {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-delicious {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-digg {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pied-piper-pp {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pied-piper-alt {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-drupal {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-joomla {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-behance {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-behance-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-behance-square:before { content: unquote("\"#{ $fa-var-square-behance }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-steam {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-steam-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-steam-square:before { content: unquote("\"#{ $fa-var-square-steam }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-automobile:before { content: unquote("\"#{ $fa-var-car }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cab:before { content: unquote("\"#{ $fa-var-taxi }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-spotify {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-deviantart {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-soundcloud {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-pdf-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-pdf-o:before { content: unquote("\"#{ $fa-var-file-pdf }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-word-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-word-o:before { content: unquote("\"#{ $fa-var-file-word }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-excel-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-excel-o:before { content: unquote("\"#{ $fa-var-file-excel }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-powerpoint-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-powerpoint-o:before { content: unquote("\"#{ $fa-var-file-powerpoint }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-image-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-image-o:before { content: unquote("\"#{ $fa-var-file-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-photo-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-photo-o:before { content: unquote("\"#{ $fa-var-file-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-picture-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-picture-o:before { content: unquote("\"#{ $fa-var-file-image }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-archive-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-archive-o:before { content: unquote("\"#{ $fa-var-file-zipper }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-zip-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-zip-o:before { content: unquote("\"#{ $fa-var-file-zipper }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-audio-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-audio-o:before { content: unquote("\"#{ $fa-var-file-audio }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-sound-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-sound-o:before { content: unquote("\"#{ $fa-var-file-audio }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-video-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-video-o:before { content: unquote("\"#{ $fa-var-file-video }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-movie-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-movie-o:before { content: unquote("\"#{ $fa-var-file-video }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-code-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-file-code-o:before { content: unquote("\"#{ $fa-var-file-code }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vine {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-codepen {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-jsfiddle {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-life-bouy:before { content: unquote("\"#{ $fa-var-life-ring }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-life-buoy:before { content: unquote("\"#{ $fa-var-life-ring }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-life-saver:before { content: unquote("\"#{ $fa-var-life-ring }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-support:before { content: unquote("\"#{ $fa-var-life-ring }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-circle-o-notch:before { content: unquote("\"#{ $fa-var-circle-notch }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-rebel {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ra {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ra:before { content: unquote("\"#{ $fa-var-rebel }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-resistance {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-resistance:before { content: unquote("\"#{ $fa-var-rebel }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-empire {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ge {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ge:before { content: unquote("\"#{ $fa-var-empire }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-git-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-git-square:before { content: unquote("\"#{ $fa-var-square-git }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-git {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hacker-news {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-y-combinator-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-y-combinator-square:before { content: unquote("\"#{ $fa-var-hacker-news }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yc-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yc-square:before { content: unquote("\"#{ $fa-var-hacker-news }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-tencent-weibo {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-qq {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-weixin {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wechat {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wechat:before { content: unquote("\"#{ $fa-var-weixin }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-send:before { content: unquote("\"#{ $fa-var-paper-plane }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-paper-plane-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-paper-plane-o:before { content: unquote("\"#{ $fa-var-paper-plane }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-send-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-send-o:before { content: unquote("\"#{ $fa-var-paper-plane }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-circle-thin {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-circle-thin:before { content: unquote("\"#{ $fa-var-circle }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-header:before { content: unquote("\"#{ $fa-var-heading }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-futbol-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-futbol-o:before { content: unquote("\"#{ $fa-var-futbol }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-soccer-ball-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-soccer-ball-o:before { content: unquote("\"#{ $fa-var-futbol }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-slideshare {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-twitch {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yelp {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-newspaper-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-newspaper-o:before { content: unquote("\"#{ $fa-var-newspaper }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-paypal {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-wallet {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-visa {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-mastercard {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-discover {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-amex {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-paypal {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-stripe {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bell-slash-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bell-slash-o:before { content: unquote("\"#{ $fa-var-bell-slash }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-trash:before { content: unquote("\"#{ $fa-var-trash-can }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-copyright {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eyedropper:before { content: unquote("\"#{ $fa-var-eye-dropper }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-area-chart:before { content: unquote("\"#{ $fa-var-chart-area }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pie-chart:before { content: unquote("\"#{ $fa-var-chart-pie }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-line-chart:before { content: unquote("\"#{ $fa-var-chart-line }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lastfm {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lastfm-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-lastfm-square:before { content: unquote("\"#{ $fa-var-square-lastfm }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ioxhost {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-angellist {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc:before { content: unquote("\"#{ $fa-var-closed-captioning }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ils:before { content: unquote("\"#{ $fa-var-shekel-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-shekel:before { content: unquote("\"#{ $fa-var-shekel-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sheqel:before { content: unquote("\"#{ $fa-var-shekel-sign }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-buysellads {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-connectdevelop {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-dashcube {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-forumbee {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-leanpub {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sellsy {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-shirtsinbulk {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-simplybuilt {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-skyatlas {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-diamond {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-diamond:before { content: unquote("\"#{ $fa-var-gem }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-transgender:before { content: unquote("\"#{ $fa-var-mars-and-venus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-intersex:before { content: unquote("\"#{ $fa-var-mars-and-venus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-transgender-alt:before { content: unquote("\"#{ $fa-var-transgender }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-official {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-facebook-official:before { content: unquote("\"#{ $fa-var-facebook }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pinterest-p {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-whatsapp {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hotel:before { content: unquote("\"#{ $fa-var-bed }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-viacoin {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-medium {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-y-combinator {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yc {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yc:before { content: unquote("\"#{ $fa-var-y-combinator }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-optin-monster {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-opencart {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-expeditedssl {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery-4:before { content: unquote("\"#{ $fa-var-battery-full }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery:before { content: unquote("\"#{ $fa-var-battery-full }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery-3:before { content: unquote("\"#{ $fa-var-battery-three-quarters }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery-2:before { content: unquote("\"#{ $fa-var-battery-half }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery-1:before { content: unquote("\"#{ $fa-var-battery-quarter }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-battery-0:before { content: unquote("\"#{ $fa-var-battery-empty }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-object-group {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-object-ungroup {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sticky-note-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-sticky-note-o:before { content: unquote("\"#{ $fa-var-note-sticky }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-jcb {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-cc-diners-club {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-clone {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hourglass-o:before { content: unquote("\"#{ $fa-var-hourglass }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hourglass-1:before { content: unquote("\"#{ $fa-var-hourglass-start }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hourglass-2:before { content: unquote("\"#{ $fa-var-hourglass-half }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hourglass-3:before { content: unquote("\"#{ $fa-var-hourglass-end }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-rock-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-rock-o:before { content: unquote("\"#{ $fa-var-hand-back-fist }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-grab-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-grab-o:before { content: unquote("\"#{ $fa-var-hand-back-fist }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-paper-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-paper-o:before { content: unquote("\"#{ $fa-var-hand }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-stop-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-stop-o:before { content: unquote("\"#{ $fa-var-hand }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-scissors-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-scissors-o:before { content: unquote("\"#{ $fa-var-hand-scissors }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-lizard-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-lizard-o:before { content: unquote("\"#{ $fa-var-hand-lizard }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-spock-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-spock-o:before { content: unquote("\"#{ $fa-var-hand-spock }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-pointer-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-pointer-o:before { content: unquote("\"#{ $fa-var-hand-pointer }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-peace-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hand-peace-o:before { content: unquote("\"#{ $fa-var-hand-peace }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-registered {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-creative-commons {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gg {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gg-circle {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-odnoklassniki {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-odnoklassniki-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-odnoklassniki-square:before { content: unquote("\"#{ $fa-var-square-odnoklassniki }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-get-pocket {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wikipedia-w {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-safari {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-chrome {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-firefox {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-opera {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-internet-explorer {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-television:before { content: unquote("\"#{ $fa-var-tv }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-contao {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-500px {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-amazon {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-plus-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-plus-o:before { content: unquote("\"#{ $fa-var-calendar-plus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-minus-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-minus-o:before { content: unquote("\"#{ $fa-var-calendar-minus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-times-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-times-o:before { content: unquote("\"#{ $fa-var-calendar-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-check-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-calendar-check-o:before { content: unquote("\"#{ $fa-var-calendar-check }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-map-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-map-o:before { content: unquote("\"#{ $fa-var-map }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-commenting:before { content: unquote("\"#{ $fa-var-comment-dots }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-commenting-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-commenting-o:before { content: unquote("\"#{ $fa-var-comment-dots }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-houzz {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vimeo {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vimeo:before { content: unquote("\"#{ $fa-var-vimeo-v }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-black-tie {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-fonticons {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-reddit-alien {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-edge {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-credit-card-alt:before { content: unquote("\"#{ $fa-var-credit-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-codiepie {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-modx {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-fort-awesome {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-usb {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-product-hunt {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-mixcloud {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-scribd {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pause-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pause-circle-o:before { content: unquote("\"#{ $fa-var-circle-pause }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stop-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-stop-circle-o:before { content: unquote("\"#{ $fa-var-circle-stop }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bluetooth {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bluetooth-b {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-gitlab {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wpbeginner {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wpforms {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-envira {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wheelchair-alt {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wheelchair-alt:before { content: unquote("\"#{ $fa-var-accessible-icon }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-question-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-question-circle-o:before { content: unquote("\"#{ $fa-var-circle-question }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-volume-control-phone:before { content: unquote("\"#{ $fa-var-phone-volume }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-asl-interpreting:before { content: unquote("\"#{ $fa-var-hands-asl-interpreting }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-deafness:before { content: unquote("\"#{ $fa-var-ear-deaf }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-hard-of-hearing:before { content: unquote("\"#{ $fa-var-ear-deaf }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-glide {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-glide-g {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-signing:before { content: unquote("\"#{ $fa-var-hands }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-viadeo {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-viadeo-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-viadeo-square:before { content: unquote("\"#{ $fa-var-square-viadeo }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snapchat {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snapchat-ghost {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snapchat-ghost:before { content: unquote("\"#{ $fa-var-snapchat }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snapchat-square {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snapchat-square:before { content: unquote("\"#{ $fa-var-square-snapchat }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-pied-piper {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-first-order {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-yoast {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-themeisle {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-official {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-official:before { content: unquote("\"#{ $fa-var-google-plus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-circle {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-google-plus-circle:before { content: unquote("\"#{ $fa-var-google-plus }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-font-awesome {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-fa {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-fa:before { content: unquote("\"#{ $fa-var-font-awesome }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-handshake-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-handshake-o:before { content: unquote("\"#{ $fa-var-handshake }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-envelope-open-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-envelope-open-o:before { content: unquote("\"#{ $fa-var-envelope-open }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-linode {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-address-book-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-address-book-o:before { content: unquote("\"#{ $fa-var-address-book }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vcard:before { content: unquote("\"#{ $fa-var-address-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-address-card-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-address-card-o:before { content: unquote("\"#{ $fa-var-address-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vcard-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-vcard-o:before { content: unquote("\"#{ $fa-var-address-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-user-circle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-user-circle-o:before { content: unquote("\"#{ $fa-var-circle-user }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-user-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-user-o:before { content: unquote("\"#{ $fa-var-user }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-id-badge {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-drivers-license:before { content: unquote("\"#{ $fa-var-id-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-id-card-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-id-card-o:before { content: unquote("\"#{ $fa-var-id-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-drivers-license-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-drivers-license-o:before { content: unquote("\"#{ $fa-var-id-card }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-quora {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-free-code-camp {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-telegram {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer-4:before { content: unquote("\"#{ $fa-var-temperature-full }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer:before { content: unquote("\"#{ $fa-var-temperature-full }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer-3:before { content: unquote("\"#{ $fa-var-temperature-three-quarters }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer-2:before { content: unquote("\"#{ $fa-var-temperature-half }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer-1:before { content: unquote("\"#{ $fa-var-temperature-quarter }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-thermometer-0:before { content: unquote("\"#{ $fa-var-temperature-empty }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bathtub:before { content: unquote("\"#{ $fa-var-bath }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-s15:before { content: unquote("\"#{ $fa-var-bath }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-window-maximize {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-window-restore {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-times-rectangle:before { content: unquote("\"#{ $fa-var-rectangle-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-window-close-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-window-close-o:before { content: unquote("\"#{ $fa-var-rectangle-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-times-rectangle-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-times-rectangle-o:before { content: unquote("\"#{ $fa-var-rectangle-xmark }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-bandcamp {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-grav {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-etsy {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-imdb {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-ravelry {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eercast {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-eercast:before { content: unquote("\"#{ $fa-var-sellcast }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snowflake-o {
+ font-family: 'Font Awesome 6 Free';
+ font-weight: 400;
+}
+.#{$fa-css-prefix}.#{$fa-css-prefix}-snowflake-o:before { content: unquote("\"#{ $fa-var-snowflake }\""); }
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-superpowers {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-wpexplorer {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
+.#{$fa-css-prefix}.#{$fa-css-prefix}-meetup {
+ font-family: 'Font Awesome 6 Brands';
+ font-weight: 400;
+}
+
diff --git a/_scss/font-awesome/_sizing.scss b/_scss/font-awesome/_sizing.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e171e7df4c75c48b48974e4750da07c0c0a256a6
--- /dev/null
+++ b/_scss/font-awesome/_sizing.scss
@@ -0,0 +1,16 @@
+// sizing icons
+// -------------------------
+
+// literal magnification scale
+@for $i from 1 through 10 {
+ .#{$fa-css-prefix}-#{$i}x {
+ font-size: $i * 1em;
+ }
+}
+
+// step-based scale (with alignment)
+@each $size, $value in $fa-sizes {
+ .#{$fa-css-prefix}-#{$size} {
+ @include fa-size($value);
+ }
+}
diff --git a/_scss/font-awesome/_stacked.scss b/_scss/font-awesome/_stacked.scss
new file mode 100644
index 0000000000000000000000000000000000000000..d9a9d4e98f0a501d2e110f6a122e3cfb7a24c0a1
--- /dev/null
+++ b/_scss/font-awesome/_stacked.scss
@@ -0,0 +1,32 @@
+// stacking icons
+// -------------------------
+
+.#{$fa-css-prefix}-stack {
+ display: inline-block;
+ height: 2em;
+ line-height: 2em;
+ position: relative;
+ vertical-align: $fa-stack-vertical-align;
+ width: $fa-stack-width;
+}
+
+.#{$fa-css-prefix}-stack-1x,
+.#{$fa-css-prefix}-stack-2x {
+ left: 0;
+ position: absolute;
+ text-align: center;
+ width: 100%;
+ z-index: var(--#{$fa-css-prefix}-stack-z-index, #{$fa-stack-z-index});
+}
+
+.#{$fa-css-prefix}-stack-1x {
+ line-height: inherit;
+}
+
+.#{$fa-css-prefix}-stack-2x {
+ font-size: 2em;
+}
+
+.#{$fa-css-prefix}-inverse {
+ color: var(--#{$fa-css-prefix}-inverse, #{$fa-inverse});
+}
diff --git a/_scss/font-awesome/_variables.scss b/_scss/font-awesome/_variables.scss
new file mode 100644
index 0000000000000000000000000000000000000000..cc9c00ac343de73910ad8469abdee867c62ad794
--- /dev/null
+++ b/_scss/font-awesome/_variables.scss
@@ -0,0 +1,4993 @@
+// variables
+// --------------------------
+
+$fa-css-prefix : fa !default;
+$fa-style : 900 !default;
+$fa-style-family : "Font Awesome 6 Free" !default;
+
+$fa-display : inline-block !default;
+
+$fa-fw-width : fa-divide(20em, 16) !default;
+$fa-inverse : #fff !default;
+
+$fa-border-color : #eee !default;
+$fa-border-padding : .2em .25em .15em !default;
+$fa-border-radius : .1em !default;
+$fa-border-style : solid !default;
+$fa-border-width : .08em !default;
+
+$fa-size-scale-2xs : 10 !default;
+$fa-size-scale-xs : 12 !default;
+$fa-size-scale-sm : 14 !default;
+$fa-size-scale-base : 16 !default;
+$fa-size-scale-lg : 20 !default;
+$fa-size-scale-xl : 24 !default;
+$fa-size-scale-2xl : 32 !default;
+
+$fa-sizes: (
+ "2xs" : $fa-size-scale-2xs,
+ "xs" : $fa-size-scale-xs,
+ "sm" : $fa-size-scale-sm,
+ "lg" : $fa-size-scale-lg,
+ "xl" : $fa-size-scale-xl,
+ "2xl" : $fa-size-scale-2xl
+) !default;
+
+$fa-li-width : 2em !default;
+$fa-li-margin : $fa-li-width * fa-divide(5, 4) !default;
+
+$fa-pull-margin : .3em !default;
+
+$fa-primary-opacity : 1 !default;
+$fa-secondary-opacity : .4 !default;
+
+$fa-stack-vertical-align: middle !default;
+$fa-stack-width : ($fa-fw-width * 2) !default;
+$fa-stack-z-index : auto !default;
+
+$fa-font-display : block !default;
+$fa-font-path : "../webfonts" !default;
+
+$fa-var-0: \30;
+$fa-var-1: \31;
+$fa-var-2: \32;
+$fa-var-3: \33;
+$fa-var-4: \34;
+$fa-var-5: \35;
+$fa-var-6: \36;
+$fa-var-7: \37;
+$fa-var-8: \38;
+$fa-var-9: \39;
+$fa-var-fill-drip: \f576;
+$fa-var-arrows-to-circle: \e4bd;
+$fa-var-circle-chevron-right: \f138;
+$fa-var-chevron-circle-right: \f138;
+$fa-var-at: \40;
+$fa-var-trash-can: \f2ed;
+$fa-var-trash-alt: \f2ed;
+$fa-var-text-height: \f034;
+$fa-var-user-xmark: \f235;
+$fa-var-user-times: \f235;
+$fa-var-stethoscope: \f0f1;
+$fa-var-message: \f27a;
+$fa-var-comment-alt: \f27a;
+$fa-var-info: \f129;
+$fa-var-down-left-and-up-right-to-center: \f422;
+$fa-var-compress-alt: \f422;
+$fa-var-explosion: \e4e9;
+$fa-var-file-lines: \f15c;
+$fa-var-file-alt: \f15c;
+$fa-var-file-text: \f15c;
+$fa-var-wave-square: \f83e;
+$fa-var-ring: \f70b;
+$fa-var-building-un: \e4d9;
+$fa-var-dice-three: \f527;
+$fa-var-calendar-days: \f073;
+$fa-var-calendar-alt: \f073;
+$fa-var-anchor-circle-check: \e4aa;
+$fa-var-building-circle-arrow-right: \e4d1;
+$fa-var-volleyball: \f45f;
+$fa-var-volleyball-ball: \f45f;
+$fa-var-arrows-up-to-line: \e4c2;
+$fa-var-sort-down: \f0dd;
+$fa-var-sort-desc: \f0dd;
+$fa-var-circle-minus: \f056;
+$fa-var-minus-circle: \f056;
+$fa-var-door-open: \f52b;
+$fa-var-right-from-bracket: \f2f5;
+$fa-var-sign-out-alt: \f2f5;
+$fa-var-atom: \f5d2;
+$fa-var-soap: \e06e;
+$fa-var-icons: \f86d;
+$fa-var-heart-music-camera-bolt: \f86d;
+$fa-var-microphone-lines-slash: \f539;
+$fa-var-microphone-alt-slash: \f539;
+$fa-var-bridge-circle-check: \e4c9;
+$fa-var-pump-medical: \e06a;
+$fa-var-fingerprint: \f577;
+$fa-var-hand-point-right: \f0a4;
+$fa-var-magnifying-glass-location: \f689;
+$fa-var-search-location: \f689;
+$fa-var-forward-step: \f051;
+$fa-var-step-forward: \f051;
+$fa-var-face-smile-beam: \f5b8;
+$fa-var-smile-beam: \f5b8;
+$fa-var-flag-checkered: \f11e;
+$fa-var-football: \f44e;
+$fa-var-football-ball: \f44e;
+$fa-var-school-circle-exclamation: \e56c;
+$fa-var-crop: \f125;
+$fa-var-angles-down: \f103;
+$fa-var-angle-double-down: \f103;
+$fa-var-users-rectangle: \e594;
+$fa-var-people-roof: \e537;
+$fa-var-people-line: \e534;
+$fa-var-beer-mug-empty: \f0fc;
+$fa-var-beer: \f0fc;
+$fa-var-diagram-predecessor: \e477;
+$fa-var-arrow-up-long: \f176;
+$fa-var-long-arrow-up: \f176;
+$fa-var-fire-flame-simple: \f46a;
+$fa-var-burn: \f46a;
+$fa-var-person: \f183;
+$fa-var-male: \f183;
+$fa-var-laptop: \f109;
+$fa-var-file-csv: \f6dd;
+$fa-var-menorah: \f676;
+$fa-var-truck-plane: \e58f;
+$fa-var-record-vinyl: \f8d9;
+$fa-var-face-grin-stars: \f587;
+$fa-var-grin-stars: \f587;
+$fa-var-bong: \f55c;
+$fa-var-spaghetti-monster-flying: \f67b;
+$fa-var-pastafarianism: \f67b;
+$fa-var-arrow-down-up-across-line: \e4af;
+$fa-var-spoon: \f2e5;
+$fa-var-utensil-spoon: \f2e5;
+$fa-var-jar-wheat: \e517;
+$fa-var-envelopes-bulk: \f674;
+$fa-var-mail-bulk: \f674;
+$fa-var-file-circle-exclamation: \e4eb;
+$fa-var-circle-h: \f47e;
+$fa-var-hospital-symbol: \f47e;
+$fa-var-pager: \f815;
+$fa-var-address-book: \f2b9;
+$fa-var-contact-book: \f2b9;
+$fa-var-strikethrough: \f0cc;
+$fa-var-k: \4b;
+$fa-var-landmark-flag: \e51c;
+$fa-var-pencil: \f303;
+$fa-var-pencil-alt: \f303;
+$fa-var-backward: \f04a;
+$fa-var-caret-right: \f0da;
+$fa-var-comments: \f086;
+$fa-var-paste: \f0ea;
+$fa-var-file-clipboard: \f0ea;
+$fa-var-code-pull-request: \e13c;
+$fa-var-clipboard-list: \f46d;
+$fa-var-truck-ramp-box: \f4de;
+$fa-var-truck-loading: \f4de;
+$fa-var-user-check: \f4fc;
+$fa-var-vial-virus: \e597;
+$fa-var-sheet-plastic: \e571;
+$fa-var-blog: \f781;
+$fa-var-user-ninja: \f504;
+$fa-var-person-arrow-up-from-line: \e539;
+$fa-var-scroll-torah: \f6a0;
+$fa-var-torah: \f6a0;
+$fa-var-broom-ball: \f458;
+$fa-var-quidditch: \f458;
+$fa-var-quidditch-broom-ball: \f458;
+$fa-var-toggle-off: \f204;
+$fa-var-box-archive: \f187;
+$fa-var-archive: \f187;
+$fa-var-person-drowning: \e545;
+$fa-var-arrow-down-9-1: \f886;
+$fa-var-sort-numeric-desc: \f886;
+$fa-var-sort-numeric-down-alt: \f886;
+$fa-var-face-grin-tongue-squint: \f58a;
+$fa-var-grin-tongue-squint: \f58a;
+$fa-var-spray-can: \f5bd;
+$fa-var-truck-monster: \f63b;
+$fa-var-w: \57;
+$fa-var-earth-africa: \f57c;
+$fa-var-globe-africa: \f57c;
+$fa-var-rainbow: \f75b;
+$fa-var-circle-notch: \f1ce;
+$fa-var-tablet-screen-button: \f3fa;
+$fa-var-tablet-alt: \f3fa;
+$fa-var-paw: \f1b0;
+$fa-var-cloud: \f0c2;
+$fa-var-trowel-bricks: \e58a;
+$fa-var-face-flushed: \f579;
+$fa-var-flushed: \f579;
+$fa-var-hospital-user: \f80d;
+$fa-var-tent-arrow-left-right: \e57f;
+$fa-var-gavel: \f0e3;
+$fa-var-legal: \f0e3;
+$fa-var-binoculars: \f1e5;
+$fa-var-microphone-slash: \f131;
+$fa-var-box-tissue: \e05b;
+$fa-var-motorcycle: \f21c;
+$fa-var-bell-concierge: \f562;
+$fa-var-concierge-bell: \f562;
+$fa-var-pen-ruler: \f5ae;
+$fa-var-pencil-ruler: \f5ae;
+$fa-var-people-arrows: \e068;
+$fa-var-people-arrows-left-right: \e068;
+$fa-var-mars-and-venus-burst: \e523;
+$fa-var-square-caret-right: \f152;
+$fa-var-caret-square-right: \f152;
+$fa-var-scissors: \f0c4;
+$fa-var-cut: \f0c4;
+$fa-var-sun-plant-wilt: \e57a;
+$fa-var-toilets-portable: \e584;
+$fa-var-hockey-puck: \f453;
+$fa-var-table: \f0ce;
+$fa-var-magnifying-glass-arrow-right: \e521;
+$fa-var-tachograph-digital: \f566;
+$fa-var-digital-tachograph: \f566;
+$fa-var-users-slash: \e073;
+$fa-var-clover: \e139;
+$fa-var-reply: \f3e5;
+$fa-var-mail-reply: \f3e5;
+$fa-var-star-and-crescent: \f699;
+$fa-var-house-fire: \e50c;
+$fa-var-square-minus: \f146;
+$fa-var-minus-square: \f146;
+$fa-var-helicopter: \f533;
+$fa-var-compass: \f14e;
+$fa-var-square-caret-down: \f150;
+$fa-var-caret-square-down: \f150;
+$fa-var-file-circle-question: \e4ef;
+$fa-var-laptop-code: \f5fc;
+$fa-var-swatchbook: \f5c3;
+$fa-var-prescription-bottle: \f485;
+$fa-var-bars: \f0c9;
+$fa-var-navicon: \f0c9;
+$fa-var-people-group: \e533;
+$fa-var-hourglass-end: \f253;
+$fa-var-hourglass-3: \f253;
+$fa-var-heart-crack: \f7a9;
+$fa-var-heart-broken: \f7a9;
+$fa-var-square-up-right: \f360;
+$fa-var-external-link-square-alt: \f360;
+$fa-var-face-kiss-beam: \f597;
+$fa-var-kiss-beam: \f597;
+$fa-var-film: \f008;
+$fa-var-ruler-horizontal: \f547;
+$fa-var-people-robbery: \e536;
+$fa-var-lightbulb: \f0eb;
+$fa-var-caret-left: \f0d9;
+$fa-var-circle-exclamation: \f06a;
+$fa-var-exclamation-circle: \f06a;
+$fa-var-school-circle-xmark: \e56d;
+$fa-var-arrow-right-from-bracket: \f08b;
+$fa-var-sign-out: \f08b;
+$fa-var-circle-chevron-down: \f13a;
+$fa-var-chevron-circle-down: \f13a;
+$fa-var-unlock-keyhole: \f13e;
+$fa-var-unlock-alt: \f13e;
+$fa-var-cloud-showers-heavy: \f740;
+$fa-var-headphones-simple: \f58f;
+$fa-var-headphones-alt: \f58f;
+$fa-var-sitemap: \f0e8;
+$fa-var-circle-dollar-to-slot: \f4b9;
+$fa-var-donate: \f4b9;
+$fa-var-memory: \f538;
+$fa-var-road-spikes: \e568;
+$fa-var-fire-burner: \e4f1;
+$fa-var-flag: \f024;
+$fa-var-hanukiah: \f6e6;
+$fa-var-feather: \f52d;
+$fa-var-volume-low: \f027;
+$fa-var-volume-down: \f027;
+$fa-var-comment-slash: \f4b3;
+$fa-var-cloud-sun-rain: \f743;
+$fa-var-compress: \f066;
+$fa-var-wheat-awn: \e2cd;
+$fa-var-wheat-alt: \e2cd;
+$fa-var-ankh: \f644;
+$fa-var-hands-holding-child: \e4fa;
+$fa-var-asterisk: \2a;
+$fa-var-square-check: \f14a;
+$fa-var-check-square: \f14a;
+$fa-var-peseta-sign: \e221;
+$fa-var-heading: \f1dc;
+$fa-var-header: \f1dc;
+$fa-var-ghost: \f6e2;
+$fa-var-list: \f03a;
+$fa-var-list-squares: \f03a;
+$fa-var-square-phone-flip: \f87b;
+$fa-var-phone-square-alt: \f87b;
+$fa-var-cart-plus: \f217;
+$fa-var-gamepad: \f11b;
+$fa-var-circle-dot: \f192;
+$fa-var-dot-circle: \f192;
+$fa-var-face-dizzy: \f567;
+$fa-var-dizzy: \f567;
+$fa-var-egg: \f7fb;
+$fa-var-house-medical-circle-xmark: \e513;
+$fa-var-campground: \f6bb;
+$fa-var-folder-plus: \f65e;
+$fa-var-futbol: \f1e3;
+$fa-var-futbol-ball: \f1e3;
+$fa-var-soccer-ball: \f1e3;
+$fa-var-paintbrush: \f1fc;
+$fa-var-paint-brush: \f1fc;
+$fa-var-lock: \f023;
+$fa-var-gas-pump: \f52f;
+$fa-var-hot-tub-person: \f593;
+$fa-var-hot-tub: \f593;
+$fa-var-map-location: \f59f;
+$fa-var-map-marked: \f59f;
+$fa-var-house-flood-water: \e50e;
+$fa-var-tree: \f1bb;
+$fa-var-bridge-lock: \e4cc;
+$fa-var-sack-dollar: \f81d;
+$fa-var-pen-to-square: \f044;
+$fa-var-edit: \f044;
+$fa-var-car-side: \f5e4;
+$fa-var-share-nodes: \f1e0;
+$fa-var-share-alt: \f1e0;
+$fa-var-heart-circle-minus: \e4ff;
+$fa-var-hourglass-half: \f252;
+$fa-var-hourglass-2: \f252;
+$fa-var-microscope: \f610;
+$fa-var-sink: \e06d;
+$fa-var-bag-shopping: \f290;
+$fa-var-shopping-bag: \f290;
+$fa-var-arrow-down-z-a: \f881;
+$fa-var-sort-alpha-desc: \f881;
+$fa-var-sort-alpha-down-alt: \f881;
+$fa-var-mitten: \f7b5;
+$fa-var-person-rays: \e54d;
+$fa-var-users: \f0c0;
+$fa-var-eye-slash: \f070;
+$fa-var-flask-vial: \e4f3;
+$fa-var-hand: \f256;
+$fa-var-hand-paper: \f256;
+$fa-var-om: \f679;
+$fa-var-worm: \e599;
+$fa-var-house-circle-xmark: \e50b;
+$fa-var-plug: \f1e6;
+$fa-var-chevron-up: \f077;
+$fa-var-hand-spock: \f259;
+$fa-var-stopwatch: \f2f2;
+$fa-var-face-kiss: \f596;
+$fa-var-kiss: \f596;
+$fa-var-bridge-circle-xmark: \e4cb;
+$fa-var-face-grin-tongue: \f589;
+$fa-var-grin-tongue: \f589;
+$fa-var-chess-bishop: \f43a;
+$fa-var-face-grin-wink: \f58c;
+$fa-var-grin-wink: \f58c;
+$fa-var-ear-deaf: \f2a4;
+$fa-var-deaf: \f2a4;
+$fa-var-deafness: \f2a4;
+$fa-var-hard-of-hearing: \f2a4;
+$fa-var-road-circle-check: \e564;
+$fa-var-dice-five: \f523;
+$fa-var-square-rss: \f143;
+$fa-var-rss-square: \f143;
+$fa-var-land-mine-on: \e51b;
+$fa-var-i-cursor: \f246;
+$fa-var-stamp: \f5bf;
+$fa-var-stairs: \e289;
+$fa-var-i: \49;
+$fa-var-hryvnia-sign: \f6f2;
+$fa-var-hryvnia: \f6f2;
+$fa-var-pills: \f484;
+$fa-var-face-grin-wide: \f581;
+$fa-var-grin-alt: \f581;
+$fa-var-tooth: \f5c9;
+$fa-var-v: \56;
+$fa-var-bangladeshi-taka-sign: \e2e6;
+$fa-var-bicycle: \f206;
+$fa-var-staff-snake: \e579;
+$fa-var-rod-asclepius: \e579;
+$fa-var-rod-snake: \e579;
+$fa-var-staff-aesculapius: \e579;
+$fa-var-head-side-cough-slash: \e062;
+$fa-var-truck-medical: \f0f9;
+$fa-var-ambulance: \f0f9;
+$fa-var-wheat-awn-circle-exclamation: \e598;
+$fa-var-snowman: \f7d0;
+$fa-var-mortar-pestle: \f5a7;
+$fa-var-road-barrier: \e562;
+$fa-var-school: \f549;
+$fa-var-igloo: \f7ae;
+$fa-var-joint: \f595;
+$fa-var-angle-right: \f105;
+$fa-var-horse: \f6f0;
+$fa-var-q: \51;
+$fa-var-g: \47;
+$fa-var-notes-medical: \f481;
+$fa-var-temperature-half: \f2c9;
+$fa-var-temperature-2: \f2c9;
+$fa-var-thermometer-2: \f2c9;
+$fa-var-thermometer-half: \f2c9;
+$fa-var-dong-sign: \e169;
+$fa-var-capsules: \f46b;
+$fa-var-poo-storm: \f75a;
+$fa-var-poo-bolt: \f75a;
+$fa-var-face-frown-open: \f57a;
+$fa-var-frown-open: \f57a;
+$fa-var-hand-point-up: \f0a6;
+$fa-var-money-bill: \f0d6;
+$fa-var-bookmark: \f02e;
+$fa-var-align-justify: \f039;
+$fa-var-umbrella-beach: \f5ca;
+$fa-var-helmet-un: \e503;
+$fa-var-bullseye: \f140;
+$fa-var-bacon: \f7e5;
+$fa-var-hand-point-down: \f0a7;
+$fa-var-arrow-up-from-bracket: \e09a;
+$fa-var-folder: \f07b;
+$fa-var-folder-blank: \f07b;
+$fa-var-file-waveform: \f478;
+$fa-var-file-medical-alt: \f478;
+$fa-var-radiation: \f7b9;
+$fa-var-chart-simple: \e473;
+$fa-var-mars-stroke: \f229;
+$fa-var-vial: \f492;
+$fa-var-gauge: \f624;
+$fa-var-dashboard: \f624;
+$fa-var-gauge-med: \f624;
+$fa-var-tachometer-alt-average: \f624;
+$fa-var-wand-magic-sparkles: \e2ca;
+$fa-var-magic-wand-sparkles: \e2ca;
+$fa-var-e: \45;
+$fa-var-pen-clip: \f305;
+$fa-var-pen-alt: \f305;
+$fa-var-bridge-circle-exclamation: \e4ca;
+$fa-var-user: \f007;
+$fa-var-school-circle-check: \e56b;
+$fa-var-dumpster: \f793;
+$fa-var-van-shuttle: \f5b6;
+$fa-var-shuttle-van: \f5b6;
+$fa-var-building-user: \e4da;
+$fa-var-square-caret-left: \f191;
+$fa-var-caret-square-left: \f191;
+$fa-var-highlighter: \f591;
+$fa-var-key: \f084;
+$fa-var-bullhorn: \f0a1;
+$fa-var-globe: \f0ac;
+$fa-var-synagogue: \f69b;
+$fa-var-person-half-dress: \e548;
+$fa-var-road-bridge: \e563;
+$fa-var-location-arrow: \f124;
+$fa-var-c: \43;
+$fa-var-tablet-button: \f10a;
+$fa-var-building-lock: \e4d6;
+$fa-var-pizza-slice: \f818;
+$fa-var-money-bill-wave: \f53a;
+$fa-var-chart-area: \f1fe;
+$fa-var-area-chart: \f1fe;
+$fa-var-house-flag: \e50d;
+$fa-var-person-circle-minus: \e540;
+$fa-var-ban: \f05e;
+$fa-var-cancel: \f05e;
+$fa-var-camera-rotate: \e0d8;
+$fa-var-spray-can-sparkles: \f5d0;
+$fa-var-air-freshener: \f5d0;
+$fa-var-star: \f005;
+$fa-var-repeat: \f363;
+$fa-var-cross: \f654;
+$fa-var-box: \f466;
+$fa-var-venus-mars: \f228;
+$fa-var-arrow-pointer: \f245;
+$fa-var-mouse-pointer: \f245;
+$fa-var-maximize: \f31e;
+$fa-var-expand-arrows-alt: \f31e;
+$fa-var-charging-station: \f5e7;
+$fa-var-shapes: \f61f;
+$fa-var-triangle-circle-square: \f61f;
+$fa-var-shuffle: \f074;
+$fa-var-random: \f074;
+$fa-var-person-running: \f70c;
+$fa-var-running: \f70c;
+$fa-var-mobile-retro: \e527;
+$fa-var-grip-lines-vertical: \f7a5;
+$fa-var-spider: \f717;
+$fa-var-hands-bound: \e4f9;
+$fa-var-file-invoice-dollar: \f571;
+$fa-var-plane-circle-exclamation: \e556;
+$fa-var-x-ray: \f497;
+$fa-var-spell-check: \f891;
+$fa-var-slash: \f715;
+$fa-var-computer-mouse: \f8cc;
+$fa-var-mouse: \f8cc;
+$fa-var-arrow-right-to-bracket: \f090;
+$fa-var-sign-in: \f090;
+$fa-var-shop-slash: \e070;
+$fa-var-store-alt-slash: \e070;
+$fa-var-server: \f233;
+$fa-var-virus-covid-slash: \e4a9;
+$fa-var-shop-lock: \e4a5;
+$fa-var-hourglass-start: \f251;
+$fa-var-hourglass-1: \f251;
+$fa-var-blender-phone: \f6b6;
+$fa-var-building-wheat: \e4db;
+$fa-var-person-breastfeeding: \e53a;
+$fa-var-right-to-bracket: \f2f6;
+$fa-var-sign-in-alt: \f2f6;
+$fa-var-venus: \f221;
+$fa-var-passport: \f5ab;
+$fa-var-heart-pulse: \f21e;
+$fa-var-heartbeat: \f21e;
+$fa-var-people-carry-box: \f4ce;
+$fa-var-people-carry: \f4ce;
+$fa-var-temperature-high: \f769;
+$fa-var-microchip: \f2db;
+$fa-var-crown: \f521;
+$fa-var-weight-hanging: \f5cd;
+$fa-var-xmarks-lines: \e59a;
+$fa-var-file-prescription: \f572;
+$fa-var-weight-scale: \f496;
+$fa-var-weight: \f496;
+$fa-var-user-group: \f500;
+$fa-var-user-friends: \f500;
+$fa-var-arrow-up-a-z: \f15e;
+$fa-var-sort-alpha-up: \f15e;
+$fa-var-chess-knight: \f441;
+$fa-var-face-laugh-squint: \f59b;
+$fa-var-laugh-squint: \f59b;
+$fa-var-wheelchair: \f193;
+$fa-var-circle-arrow-up: \f0aa;
+$fa-var-arrow-circle-up: \f0aa;
+$fa-var-toggle-on: \f205;
+$fa-var-person-walking: \f554;
+$fa-var-walking: \f554;
+$fa-var-l: \4c;
+$fa-var-fire: \f06d;
+$fa-var-bed-pulse: \f487;
+$fa-var-procedures: \f487;
+$fa-var-shuttle-space: \f197;
+$fa-var-space-shuttle: \f197;
+$fa-var-face-laugh: \f599;
+$fa-var-laugh: \f599;
+$fa-var-folder-open: \f07c;
+$fa-var-heart-circle-plus: \e500;
+$fa-var-code-fork: \e13b;
+$fa-var-city: \f64f;
+$fa-var-microphone-lines: \f3c9;
+$fa-var-microphone-alt: \f3c9;
+$fa-var-pepper-hot: \f816;
+$fa-var-unlock: \f09c;
+$fa-var-colon-sign: \e140;
+$fa-var-headset: \f590;
+$fa-var-store-slash: \e071;
+$fa-var-road-circle-xmark: \e566;
+$fa-var-user-minus: \f503;
+$fa-var-mars-stroke-up: \f22a;
+$fa-var-mars-stroke-v: \f22a;
+$fa-var-champagne-glasses: \f79f;
+$fa-var-glass-cheers: \f79f;
+$fa-var-clipboard: \f328;
+$fa-var-house-circle-exclamation: \e50a;
+$fa-var-file-arrow-up: \f574;
+$fa-var-file-upload: \f574;
+$fa-var-wifi: \f1eb;
+$fa-var-wifi-3: \f1eb;
+$fa-var-wifi-strong: \f1eb;
+$fa-var-bath: \f2cd;
+$fa-var-bathtub: \f2cd;
+$fa-var-underline: \f0cd;
+$fa-var-user-pen: \f4ff;
+$fa-var-user-edit: \f4ff;
+$fa-var-signature: \f5b7;
+$fa-var-stroopwafel: \f551;
+$fa-var-bold: \f032;
+$fa-var-anchor-lock: \e4ad;
+$fa-var-building-ngo: \e4d7;
+$fa-var-manat-sign: \e1d5;
+$fa-var-not-equal: \f53e;
+$fa-var-border-top-left: \f853;
+$fa-var-border-style: \f853;
+$fa-var-map-location-dot: \f5a0;
+$fa-var-map-marked-alt: \f5a0;
+$fa-var-jedi: \f669;
+$fa-var-square-poll-vertical: \f681;
+$fa-var-poll: \f681;
+$fa-var-mug-hot: \f7b6;
+$fa-var-car-battery: \f5df;
+$fa-var-battery-car: \f5df;
+$fa-var-gift: \f06b;
+$fa-var-dice-two: \f528;
+$fa-var-chess-queen: \f445;
+$fa-var-glasses: \f530;
+$fa-var-chess-board: \f43c;
+$fa-var-building-circle-check: \e4d2;
+$fa-var-person-chalkboard: \e53d;
+$fa-var-mars-stroke-right: \f22b;
+$fa-var-mars-stroke-h: \f22b;
+$fa-var-hand-back-fist: \f255;
+$fa-var-hand-rock: \f255;
+$fa-var-square-caret-up: \f151;
+$fa-var-caret-square-up: \f151;
+$fa-var-cloud-showers-water: \e4e4;
+$fa-var-chart-bar: \f080;
+$fa-var-bar-chart: \f080;
+$fa-var-hands-bubbles: \e05e;
+$fa-var-hands-wash: \e05e;
+$fa-var-less-than-equal: \f537;
+$fa-var-train: \f238;
+$fa-var-eye-low-vision: \f2a8;
+$fa-var-low-vision: \f2a8;
+$fa-var-crow: \f520;
+$fa-var-sailboat: \e445;
+$fa-var-window-restore: \f2d2;
+$fa-var-square-plus: \f0fe;
+$fa-var-plus-square: \f0fe;
+$fa-var-torii-gate: \f6a1;
+$fa-var-frog: \f52e;
+$fa-var-bucket: \e4cf;
+$fa-var-image: \f03e;
+$fa-var-microphone: \f130;
+$fa-var-cow: \f6c8;
+$fa-var-caret-up: \f0d8;
+$fa-var-screwdriver: \f54a;
+$fa-var-folder-closed: \e185;
+$fa-var-house-tsunami: \e515;
+$fa-var-square-nfi: \e576;
+$fa-var-arrow-up-from-ground-water: \e4b5;
+$fa-var-martini-glass: \f57b;
+$fa-var-glass-martini-alt: \f57b;
+$fa-var-rotate-left: \f2ea;
+$fa-var-rotate-back: \f2ea;
+$fa-var-rotate-backward: \f2ea;
+$fa-var-undo-alt: \f2ea;
+$fa-var-table-columns: \f0db;
+$fa-var-columns: \f0db;
+$fa-var-lemon: \f094;
+$fa-var-head-side-mask: \e063;
+$fa-var-handshake: \f2b5;
+$fa-var-gem: \f3a5;
+$fa-var-dolly: \f472;
+$fa-var-dolly-box: \f472;
+$fa-var-smoking: \f48d;
+$fa-var-minimize: \f78c;
+$fa-var-compress-arrows-alt: \f78c;
+$fa-var-monument: \f5a6;
+$fa-var-snowplow: \f7d2;
+$fa-var-angles-right: \f101;
+$fa-var-angle-double-right: \f101;
+$fa-var-cannabis: \f55f;
+$fa-var-circle-play: \f144;
+$fa-var-play-circle: \f144;
+$fa-var-tablets: \f490;
+$fa-var-ethernet: \f796;
+$fa-var-euro-sign: \f153;
+$fa-var-eur: \f153;
+$fa-var-euro: \f153;
+$fa-var-chair: \f6c0;
+$fa-var-circle-check: \f058;
+$fa-var-check-circle: \f058;
+$fa-var-circle-stop: \f28d;
+$fa-var-stop-circle: \f28d;
+$fa-var-compass-drafting: \f568;
+$fa-var-drafting-compass: \f568;
+$fa-var-plate-wheat: \e55a;
+$fa-var-icicles: \f7ad;
+$fa-var-person-shelter: \e54f;
+$fa-var-neuter: \f22c;
+$fa-var-id-badge: \f2c1;
+$fa-var-marker: \f5a1;
+$fa-var-face-laugh-beam: \f59a;
+$fa-var-laugh-beam: \f59a;
+$fa-var-helicopter-symbol: \e502;
+$fa-var-universal-access: \f29a;
+$fa-var-circle-chevron-up: \f139;
+$fa-var-chevron-circle-up: \f139;
+$fa-var-lari-sign: \e1c8;
+$fa-var-volcano: \f770;
+$fa-var-person-walking-dashed-line-arrow-right: \e553;
+$fa-var-sterling-sign: \f154;
+$fa-var-gbp: \f154;
+$fa-var-pound-sign: \f154;
+$fa-var-viruses: \e076;
+$fa-var-square-person-confined: \e577;
+$fa-var-user-tie: \f508;
+$fa-var-arrow-down-long: \f175;
+$fa-var-long-arrow-down: \f175;
+$fa-var-tent-arrow-down-to-line: \e57e;
+$fa-var-certificate: \f0a3;
+$fa-var-reply-all: \f122;
+$fa-var-mail-reply-all: \f122;
+$fa-var-suitcase: \f0f2;
+$fa-var-person-skating: \f7c5;
+$fa-var-skating: \f7c5;
+$fa-var-filter-circle-dollar: \f662;
+$fa-var-funnel-dollar: \f662;
+$fa-var-camera-retro: \f083;
+$fa-var-circle-arrow-down: \f0ab;
+$fa-var-arrow-circle-down: \f0ab;
+$fa-var-file-import: \f56f;
+$fa-var-arrow-right-to-file: \f56f;
+$fa-var-square-arrow-up-right: \f14c;
+$fa-var-external-link-square: \f14c;
+$fa-var-box-open: \f49e;
+$fa-var-scroll: \f70e;
+$fa-var-spa: \f5bb;
+$fa-var-location-pin-lock: \e51f;
+$fa-var-pause: \f04c;
+$fa-var-hill-avalanche: \e507;
+$fa-var-temperature-empty: \f2cb;
+$fa-var-temperature-0: \f2cb;
+$fa-var-thermometer-0: \f2cb;
+$fa-var-thermometer-empty: \f2cb;
+$fa-var-bomb: \f1e2;
+$fa-var-registered: \f25d;
+$fa-var-address-card: \f2bb;
+$fa-var-contact-card: \f2bb;
+$fa-var-vcard: \f2bb;
+$fa-var-scale-unbalanced-flip: \f516;
+$fa-var-balance-scale-right: \f516;
+$fa-var-subscript: \f12c;
+$fa-var-diamond-turn-right: \f5eb;
+$fa-var-directions: \f5eb;
+$fa-var-burst: \e4dc;
+$fa-var-house-laptop: \e066;
+$fa-var-laptop-house: \e066;
+$fa-var-face-tired: \f5c8;
+$fa-var-tired: \f5c8;
+$fa-var-money-bills: \e1f3;
+$fa-var-smog: \f75f;
+$fa-var-crutch: \f7f7;
+$fa-var-cloud-arrow-up: \f0ee;
+$fa-var-cloud-upload: \f0ee;
+$fa-var-cloud-upload-alt: \f0ee;
+$fa-var-palette: \f53f;
+$fa-var-arrows-turn-right: \e4c0;
+$fa-var-vest: \e085;
+$fa-var-ferry: \e4ea;
+$fa-var-arrows-down-to-people: \e4b9;
+$fa-var-seedling: \f4d8;
+$fa-var-sprout: \f4d8;
+$fa-var-left-right: \f337;
+$fa-var-arrows-alt-h: \f337;
+$fa-var-boxes-packing: \e4c7;
+$fa-var-circle-arrow-left: \f0a8;
+$fa-var-arrow-circle-left: \f0a8;
+$fa-var-group-arrows-rotate: \e4f6;
+$fa-var-bowl-food: \e4c6;
+$fa-var-candy-cane: \f786;
+$fa-var-arrow-down-wide-short: \f160;
+$fa-var-sort-amount-asc: \f160;
+$fa-var-sort-amount-down: \f160;
+$fa-var-cloud-bolt: \f76c;
+$fa-var-thunderstorm: \f76c;
+$fa-var-text-slash: \f87d;
+$fa-var-remove-format: \f87d;
+$fa-var-face-smile-wink: \f4da;
+$fa-var-smile-wink: \f4da;
+$fa-var-file-word: \f1c2;
+$fa-var-file-powerpoint: \f1c4;
+$fa-var-arrows-left-right: \f07e;
+$fa-var-arrows-h: \f07e;
+$fa-var-house-lock: \e510;
+$fa-var-cloud-arrow-down: \f0ed;
+$fa-var-cloud-download: \f0ed;
+$fa-var-cloud-download-alt: \f0ed;
+$fa-var-children: \e4e1;
+$fa-var-chalkboard: \f51b;
+$fa-var-blackboard: \f51b;
+$fa-var-user-large-slash: \f4fa;
+$fa-var-user-alt-slash: \f4fa;
+$fa-var-envelope-open: \f2b6;
+$fa-var-handshake-simple-slash: \e05f;
+$fa-var-handshake-alt-slash: \e05f;
+$fa-var-mattress-pillow: \e525;
+$fa-var-guarani-sign: \e19a;
+$fa-var-arrows-rotate: \f021;
+$fa-var-refresh: \f021;
+$fa-var-sync: \f021;
+$fa-var-fire-extinguisher: \f134;
+$fa-var-cruzeiro-sign: \e152;
+$fa-var-greater-than-equal: \f532;
+$fa-var-shield-halved: \f3ed;
+$fa-var-shield-alt: \f3ed;
+$fa-var-book-atlas: \f558;
+$fa-var-atlas: \f558;
+$fa-var-virus: \e074;
+$fa-var-envelope-circle-check: \e4e8;
+$fa-var-layer-group: \f5fd;
+$fa-var-arrows-to-dot: \e4be;
+$fa-var-archway: \f557;
+$fa-var-heart-circle-check: \e4fd;
+$fa-var-house-chimney-crack: \f6f1;
+$fa-var-house-damage: \f6f1;
+$fa-var-file-zipper: \f1c6;
+$fa-var-file-archive: \f1c6;
+$fa-var-square: \f0c8;
+$fa-var-martini-glass-empty: \f000;
+$fa-var-glass-martini: \f000;
+$fa-var-couch: \f4b8;
+$fa-var-cedi-sign: \e0df;
+$fa-var-italic: \f033;
+$fa-var-church: \f51d;
+$fa-var-comments-dollar: \f653;
+$fa-var-democrat: \f747;
+$fa-var-z: \5a;
+$fa-var-person-skiing: \f7c9;
+$fa-var-skiing: \f7c9;
+$fa-var-road-lock: \e567;
+$fa-var-a: \41;
+$fa-var-temperature-arrow-down: \e03f;
+$fa-var-temperature-down: \e03f;
+$fa-var-feather-pointed: \f56b;
+$fa-var-feather-alt: \f56b;
+$fa-var-p: \50;
+$fa-var-snowflake: \f2dc;
+$fa-var-newspaper: \f1ea;
+$fa-var-rectangle-ad: \f641;
+$fa-var-ad: \f641;
+$fa-var-circle-arrow-right: \f0a9;
+$fa-var-arrow-circle-right: \f0a9;
+$fa-var-filter-circle-xmark: \e17b;
+$fa-var-locust: \e520;
+$fa-var-sort: \f0dc;
+$fa-var-unsorted: \f0dc;
+$fa-var-list-ol: \f0cb;
+$fa-var-list-1-2: \f0cb;
+$fa-var-list-numeric: \f0cb;
+$fa-var-person-dress-burst: \e544;
+$fa-var-money-check-dollar: \f53d;
+$fa-var-money-check-alt: \f53d;
+$fa-var-vector-square: \f5cb;
+$fa-var-bread-slice: \f7ec;
+$fa-var-language: \f1ab;
+$fa-var-face-kiss-wink-heart: \f598;
+$fa-var-kiss-wink-heart: \f598;
+$fa-var-filter: \f0b0;
+$fa-var-question: \3f;
+$fa-var-file-signature: \f573;
+$fa-var-up-down-left-right: \f0b2;
+$fa-var-arrows-alt: \f0b2;
+$fa-var-house-chimney-user: \e065;
+$fa-var-hand-holding-heart: \f4be;
+$fa-var-puzzle-piece: \f12e;
+$fa-var-money-check: \f53c;
+$fa-var-star-half-stroke: \f5c0;
+$fa-var-star-half-alt: \f5c0;
+$fa-var-code: \f121;
+$fa-var-whiskey-glass: \f7a0;
+$fa-var-glass-whiskey: \f7a0;
+$fa-var-building-circle-exclamation: \e4d3;
+$fa-var-magnifying-glass-chart: \e522;
+$fa-var-arrow-up-right-from-square: \f08e;
+$fa-var-external-link: \f08e;
+$fa-var-cubes-stacked: \e4e6;
+$fa-var-won-sign: \f159;
+$fa-var-krw: \f159;
+$fa-var-won: \f159;
+$fa-var-virus-covid: \e4a8;
+$fa-var-austral-sign: \e0a9;
+$fa-var-f: \46;
+$fa-var-leaf: \f06c;
+$fa-var-road: \f018;
+$fa-var-taxi: \f1ba;
+$fa-var-cab: \f1ba;
+$fa-var-person-circle-plus: \e541;
+$fa-var-chart-pie: \f200;
+$fa-var-pie-chart: \f200;
+$fa-var-bolt-lightning: \e0b7;
+$fa-var-sack-xmark: \e56a;
+$fa-var-file-excel: \f1c3;
+$fa-var-file-contract: \f56c;
+$fa-var-fish-fins: \e4f2;
+$fa-var-building-flag: \e4d5;
+$fa-var-face-grin-beam: \f582;
+$fa-var-grin-beam: \f582;
+$fa-var-object-ungroup: \f248;
+$fa-var-poop: \f619;
+$fa-var-location-pin: \f041;
+$fa-var-map-marker: \f041;
+$fa-var-kaaba: \f66b;
+$fa-var-toilet-paper: \f71e;
+$fa-var-helmet-safety: \f807;
+$fa-var-hard-hat: \f807;
+$fa-var-hat-hard: \f807;
+$fa-var-eject: \f052;
+$fa-var-circle-right: \f35a;
+$fa-var-arrow-alt-circle-right: \f35a;
+$fa-var-plane-circle-check: \e555;
+$fa-var-face-rolling-eyes: \f5a5;
+$fa-var-meh-rolling-eyes: \f5a5;
+$fa-var-object-group: \f247;
+$fa-var-chart-line: \f201;
+$fa-var-line-chart: \f201;
+$fa-var-mask-ventilator: \e524;
+$fa-var-arrow-right: \f061;
+$fa-var-signs-post: \f277;
+$fa-var-map-signs: \f277;
+$fa-var-cash-register: \f788;
+$fa-var-person-circle-question: \e542;
+$fa-var-h: \48;
+$fa-var-tarp: \e57b;
+$fa-var-screwdriver-wrench: \f7d9;
+$fa-var-tools: \f7d9;
+$fa-var-arrows-to-eye: \e4bf;
+$fa-var-plug-circle-bolt: \e55b;
+$fa-var-heart: \f004;
+$fa-var-mars-and-venus: \f224;
+$fa-var-house-user: \e1b0;
+$fa-var-home-user: \e1b0;
+$fa-var-dumpster-fire: \f794;
+$fa-var-house-crack: \e3b1;
+$fa-var-martini-glass-citrus: \f561;
+$fa-var-cocktail: \f561;
+$fa-var-face-surprise: \f5c2;
+$fa-var-surprise: \f5c2;
+$fa-var-bottle-water: \e4c5;
+$fa-var-circle-pause: \f28b;
+$fa-var-pause-circle: \f28b;
+$fa-var-toilet-paper-slash: \e072;
+$fa-var-apple-whole: \f5d1;
+$fa-var-apple-alt: \f5d1;
+$fa-var-kitchen-set: \e51a;
+$fa-var-r: \52;
+$fa-var-temperature-quarter: \f2ca;
+$fa-var-temperature-1: \f2ca;
+$fa-var-thermometer-1: \f2ca;
+$fa-var-thermometer-quarter: \f2ca;
+$fa-var-cube: \f1b2;
+$fa-var-bitcoin-sign: \e0b4;
+$fa-var-shield-dog: \e573;
+$fa-var-solar-panel: \f5ba;
+$fa-var-lock-open: \f3c1;
+$fa-var-elevator: \e16d;
+$fa-var-money-bill-transfer: \e528;
+$fa-var-money-bill-trend-up: \e529;
+$fa-var-house-flood-water-circle-arrow-right: \e50f;
+$fa-var-square-poll-horizontal: \f682;
+$fa-var-poll-h: \f682;
+$fa-var-circle: \f111;
+$fa-var-backward-fast: \f049;
+$fa-var-fast-backward: \f049;
+$fa-var-recycle: \f1b8;
+$fa-var-user-astronaut: \f4fb;
+$fa-var-plane-slash: \e069;
+$fa-var-trademark: \f25c;
+$fa-var-basketball: \f434;
+$fa-var-basketball-ball: \f434;
+$fa-var-satellite-dish: \f7c0;
+$fa-var-circle-up: \f35b;
+$fa-var-arrow-alt-circle-up: \f35b;
+$fa-var-mobile-screen-button: \f3cd;
+$fa-var-mobile-alt: \f3cd;
+$fa-var-volume-high: \f028;
+$fa-var-volume-up: \f028;
+$fa-var-users-rays: \e593;
+$fa-var-wallet: \f555;
+$fa-var-clipboard-check: \f46c;
+$fa-var-file-audio: \f1c7;
+$fa-var-burger: \f805;
+$fa-var-hamburger: \f805;
+$fa-var-wrench: \f0ad;
+$fa-var-bugs: \e4d0;
+$fa-var-rupee-sign: \f156;
+$fa-var-rupee: \f156;
+$fa-var-file-image: \f1c5;
+$fa-var-circle-question: \f059;
+$fa-var-question-circle: \f059;
+$fa-var-plane-departure: \f5b0;
+$fa-var-handshake-slash: \e060;
+$fa-var-book-bookmark: \e0bb;
+$fa-var-code-branch: \f126;
+$fa-var-hat-cowboy: \f8c0;
+$fa-var-bridge: \e4c8;
+$fa-var-phone-flip: \f879;
+$fa-var-phone-alt: \f879;
+$fa-var-truck-front: \e2b7;
+$fa-var-cat: \f6be;
+$fa-var-anchor-circle-exclamation: \e4ab;
+$fa-var-truck-field: \e58d;
+$fa-var-route: \f4d7;
+$fa-var-clipboard-question: \e4e3;
+$fa-var-panorama: \e209;
+$fa-var-comment-medical: \f7f5;
+$fa-var-teeth-open: \f62f;
+$fa-var-file-circle-minus: \e4ed;
+$fa-var-tags: \f02c;
+$fa-var-wine-glass: \f4e3;
+$fa-var-forward-fast: \f050;
+$fa-var-fast-forward: \f050;
+$fa-var-face-meh-blank: \f5a4;
+$fa-var-meh-blank: \f5a4;
+$fa-var-square-parking: \f540;
+$fa-var-parking: \f540;
+$fa-var-house-signal: \e012;
+$fa-var-bars-progress: \f828;
+$fa-var-tasks-alt: \f828;
+$fa-var-faucet-drip: \e006;
+$fa-var-cart-flatbed: \f474;
+$fa-var-dolly-flatbed: \f474;
+$fa-var-ban-smoking: \f54d;
+$fa-var-smoking-ban: \f54d;
+$fa-var-terminal: \f120;
+$fa-var-mobile-button: \f10b;
+$fa-var-house-medical-flag: \e514;
+$fa-var-basket-shopping: \f291;
+$fa-var-shopping-basket: \f291;
+$fa-var-tape: \f4db;
+$fa-var-bus-simple: \f55e;
+$fa-var-bus-alt: \f55e;
+$fa-var-eye: \f06e;
+$fa-var-face-sad-cry: \f5b3;
+$fa-var-sad-cry: \f5b3;
+$fa-var-audio-description: \f29e;
+$fa-var-person-military-to-person: \e54c;
+$fa-var-file-shield: \e4f0;
+$fa-var-user-slash: \f506;
+$fa-var-pen: \f304;
+$fa-var-tower-observation: \e586;
+$fa-var-file-code: \f1c9;
+$fa-var-signal: \f012;
+$fa-var-signal-5: \f012;
+$fa-var-signal-perfect: \f012;
+$fa-var-bus: \f207;
+$fa-var-heart-circle-xmark: \e501;
+$fa-var-house-chimney: \e3af;
+$fa-var-home-lg: \e3af;
+$fa-var-window-maximize: \f2d0;
+$fa-var-face-frown: \f119;
+$fa-var-frown: \f119;
+$fa-var-prescription: \f5b1;
+$fa-var-shop: \f54f;
+$fa-var-store-alt: \f54f;
+$fa-var-floppy-disk: \f0c7;
+$fa-var-save: \f0c7;
+$fa-var-vihara: \f6a7;
+$fa-var-scale-unbalanced: \f515;
+$fa-var-balance-scale-left: \f515;
+$fa-var-sort-up: \f0de;
+$fa-var-sort-asc: \f0de;
+$fa-var-comment-dots: \f4ad;
+$fa-var-commenting: \f4ad;
+$fa-var-plant-wilt: \e5aa;
+$fa-var-diamond: \f219;
+$fa-var-face-grin-squint: \f585;
+$fa-var-grin-squint: \f585;
+$fa-var-hand-holding-dollar: \f4c0;
+$fa-var-hand-holding-usd: \f4c0;
+$fa-var-bacterium: \e05a;
+$fa-var-hand-pointer: \f25a;
+$fa-var-drum-steelpan: \f56a;
+$fa-var-hand-scissors: \f257;
+$fa-var-hands-praying: \f684;
+$fa-var-praying-hands: \f684;
+$fa-var-arrow-rotate-right: \f01e;
+$fa-var-arrow-right-rotate: \f01e;
+$fa-var-arrow-rotate-forward: \f01e;
+$fa-var-redo: \f01e;
+$fa-var-biohazard: \f780;
+$fa-var-location-crosshairs: \f601;
+$fa-var-location: \f601;
+$fa-var-mars-double: \f227;
+$fa-var-child-dress: \e59c;
+$fa-var-users-between-lines: \e591;
+$fa-var-lungs-virus: \e067;
+$fa-var-face-grin-tears: \f588;
+$fa-var-grin-tears: \f588;
+$fa-var-phone: \f095;
+$fa-var-calendar-xmark: \f273;
+$fa-var-calendar-times: \f273;
+$fa-var-child-reaching: \e59d;
+$fa-var-head-side-virus: \e064;
+$fa-var-user-gear: \f4fe;
+$fa-var-user-cog: \f4fe;
+$fa-var-arrow-up-1-9: \f163;
+$fa-var-sort-numeric-up: \f163;
+$fa-var-door-closed: \f52a;
+$fa-var-shield-virus: \e06c;
+$fa-var-dice-six: \f526;
+$fa-var-mosquito-net: \e52c;
+$fa-var-bridge-water: \e4ce;
+$fa-var-person-booth: \f756;
+$fa-var-text-width: \f035;
+$fa-var-hat-wizard: \f6e8;
+$fa-var-pen-fancy: \f5ac;
+$fa-var-person-digging: \f85e;
+$fa-var-digging: \f85e;
+$fa-var-trash: \f1f8;
+$fa-var-gauge-simple: \f629;
+$fa-var-gauge-simple-med: \f629;
+$fa-var-tachometer-average: \f629;
+$fa-var-book-medical: \f7e6;
+$fa-var-poo: \f2fe;
+$fa-var-quote-right: \f10e;
+$fa-var-quote-right-alt: \f10e;
+$fa-var-shirt: \f553;
+$fa-var-t-shirt: \f553;
+$fa-var-tshirt: \f553;
+$fa-var-cubes: \f1b3;
+$fa-var-divide: \f529;
+$fa-var-tenge-sign: \f7d7;
+$fa-var-tenge: \f7d7;
+$fa-var-headphones: \f025;
+$fa-var-hands-holding: \f4c2;
+$fa-var-hands-clapping: \e1a8;
+$fa-var-republican: \f75e;
+$fa-var-arrow-left: \f060;
+$fa-var-person-circle-xmark: \e543;
+$fa-var-ruler: \f545;
+$fa-var-align-left: \f036;
+$fa-var-dice-d6: \f6d1;
+$fa-var-restroom: \f7bd;
+$fa-var-j: \4a;
+$fa-var-users-viewfinder: \e595;
+$fa-var-file-video: \f1c8;
+$fa-var-up-right-from-square: \f35d;
+$fa-var-external-link-alt: \f35d;
+$fa-var-table-cells: \f00a;
+$fa-var-th: \f00a;
+$fa-var-file-pdf: \f1c1;
+$fa-var-book-bible: \f647;
+$fa-var-bible: \f647;
+$fa-var-o: \4f;
+$fa-var-suitcase-medical: \f0fa;
+$fa-var-medkit: \f0fa;
+$fa-var-user-secret: \f21b;
+$fa-var-otter: \f700;
+$fa-var-person-dress: \f182;
+$fa-var-female: \f182;
+$fa-var-comment-dollar: \f651;
+$fa-var-business-time: \f64a;
+$fa-var-briefcase-clock: \f64a;
+$fa-var-table-cells-large: \f009;
+$fa-var-th-large: \f009;
+$fa-var-book-tanakh: \f827;
+$fa-var-tanakh: \f827;
+$fa-var-phone-volume: \f2a0;
+$fa-var-volume-control-phone: \f2a0;
+$fa-var-hat-cowboy-side: \f8c1;
+$fa-var-clipboard-user: \f7f3;
+$fa-var-child: \f1ae;
+$fa-var-lira-sign: \f195;
+$fa-var-satellite: \f7bf;
+$fa-var-plane-lock: \e558;
+$fa-var-tag: \f02b;
+$fa-var-comment: \f075;
+$fa-var-cake-candles: \f1fd;
+$fa-var-birthday-cake: \f1fd;
+$fa-var-cake: \f1fd;
+$fa-var-envelope: \f0e0;
+$fa-var-angles-up: \f102;
+$fa-var-angle-double-up: \f102;
+$fa-var-paperclip: \f0c6;
+$fa-var-arrow-right-to-city: \e4b3;
+$fa-var-ribbon: \f4d6;
+$fa-var-lungs: \f604;
+$fa-var-arrow-up-9-1: \f887;
+$fa-var-sort-numeric-up-alt: \f887;
+$fa-var-litecoin-sign: \e1d3;
+$fa-var-border-none: \f850;
+$fa-var-circle-nodes: \e4e2;
+$fa-var-parachute-box: \f4cd;
+$fa-var-indent: \f03c;
+$fa-var-truck-field-un: \e58e;
+$fa-var-hourglass: \f254;
+$fa-var-hourglass-empty: \f254;
+$fa-var-mountain: \f6fc;
+$fa-var-user-doctor: \f0f0;
+$fa-var-user-md: \f0f0;
+$fa-var-circle-info: \f05a;
+$fa-var-info-circle: \f05a;
+$fa-var-cloud-meatball: \f73b;
+$fa-var-camera: \f030;
+$fa-var-camera-alt: \f030;
+$fa-var-square-virus: \e578;
+$fa-var-meteor: \f753;
+$fa-var-car-on: \e4dd;
+$fa-var-sleigh: \f7cc;
+$fa-var-arrow-down-1-9: \f162;
+$fa-var-sort-numeric-asc: \f162;
+$fa-var-sort-numeric-down: \f162;
+$fa-var-hand-holding-droplet: \f4c1;
+$fa-var-hand-holding-water: \f4c1;
+$fa-var-water: \f773;
+$fa-var-calendar-check: \f274;
+$fa-var-braille: \f2a1;
+$fa-var-prescription-bottle-medical: \f486;
+$fa-var-prescription-bottle-alt: \f486;
+$fa-var-landmark: \f66f;
+$fa-var-truck: \f0d1;
+$fa-var-crosshairs: \f05b;
+$fa-var-person-cane: \e53c;
+$fa-var-tent: \e57d;
+$fa-var-vest-patches: \e086;
+$fa-var-check-double: \f560;
+$fa-var-arrow-down-a-z: \f15d;
+$fa-var-sort-alpha-asc: \f15d;
+$fa-var-sort-alpha-down: \f15d;
+$fa-var-money-bill-wheat: \e52a;
+$fa-var-cookie: \f563;
+$fa-var-arrow-rotate-left: \f0e2;
+$fa-var-arrow-left-rotate: \f0e2;
+$fa-var-arrow-rotate-back: \f0e2;
+$fa-var-arrow-rotate-backward: \f0e2;
+$fa-var-undo: \f0e2;
+$fa-var-hard-drive: \f0a0;
+$fa-var-hdd: \f0a0;
+$fa-var-face-grin-squint-tears: \f586;
+$fa-var-grin-squint-tears: \f586;
+$fa-var-dumbbell: \f44b;
+$fa-var-rectangle-list: \f022;
+$fa-var-list-alt: \f022;
+$fa-var-tarp-droplet: \e57c;
+$fa-var-house-medical-circle-check: \e511;
+$fa-var-person-skiing-nordic: \f7ca;
+$fa-var-skiing-nordic: \f7ca;
+$fa-var-calendar-plus: \f271;
+$fa-var-plane-arrival: \f5af;
+$fa-var-circle-left: \f359;
+$fa-var-arrow-alt-circle-left: \f359;
+$fa-var-train-subway: \f239;
+$fa-var-subway: \f239;
+$fa-var-chart-gantt: \e0e4;
+$fa-var-indian-rupee-sign: \e1bc;
+$fa-var-indian-rupee: \e1bc;
+$fa-var-inr: \e1bc;
+$fa-var-crop-simple: \f565;
+$fa-var-crop-alt: \f565;
+$fa-var-money-bill-1: \f3d1;
+$fa-var-money-bill-alt: \f3d1;
+$fa-var-left-long: \f30a;
+$fa-var-long-arrow-alt-left: \f30a;
+$fa-var-dna: \f471;
+$fa-var-virus-slash: \e075;
+$fa-var-minus: \f068;
+$fa-var-subtract: \f068;
+$fa-var-chess: \f439;
+$fa-var-arrow-left-long: \f177;
+$fa-var-long-arrow-left: \f177;
+$fa-var-plug-circle-check: \e55c;
+$fa-var-street-view: \f21d;
+$fa-var-franc-sign: \e18f;
+$fa-var-volume-off: \f026;
+$fa-var-hands-asl-interpreting: \f2a3;
+$fa-var-american-sign-language-interpreting: \f2a3;
+$fa-var-asl-interpreting: \f2a3;
+$fa-var-hands-american-sign-language-interpreting: \f2a3;
+$fa-var-gear: \f013;
+$fa-var-cog: \f013;
+$fa-var-droplet-slash: \f5c7;
+$fa-var-tint-slash: \f5c7;
+$fa-var-mosque: \f678;
+$fa-var-mosquito: \e52b;
+$fa-var-star-of-david: \f69a;
+$fa-var-person-military-rifle: \e54b;
+$fa-var-cart-shopping: \f07a;
+$fa-var-shopping-cart: \f07a;
+$fa-var-vials: \f493;
+$fa-var-plug-circle-plus: \e55f;
+$fa-var-place-of-worship: \f67f;
+$fa-var-grip-vertical: \f58e;
+$fa-var-arrow-turn-up: \f148;
+$fa-var-level-up: \f148;
+$fa-var-u: \55;
+$fa-var-square-root-variable: \f698;
+$fa-var-square-root-alt: \f698;
+$fa-var-clock: \f017;
+$fa-var-clock-four: \f017;
+$fa-var-backward-step: \f048;
+$fa-var-step-backward: \f048;
+$fa-var-pallet: \f482;
+$fa-var-faucet: \e005;
+$fa-var-baseball-bat-ball: \f432;
+$fa-var-s: \53;
+$fa-var-timeline: \e29c;
+$fa-var-keyboard: \f11c;
+$fa-var-caret-down: \f0d7;
+$fa-var-house-chimney-medical: \f7f2;
+$fa-var-clinic-medical: \f7f2;
+$fa-var-temperature-three-quarters: \f2c8;
+$fa-var-temperature-3: \f2c8;
+$fa-var-thermometer-3: \f2c8;
+$fa-var-thermometer-three-quarters: \f2c8;
+$fa-var-mobile-screen: \f3cf;
+$fa-var-mobile-android-alt: \f3cf;
+$fa-var-plane-up: \e22d;
+$fa-var-piggy-bank: \f4d3;
+$fa-var-battery-half: \f242;
+$fa-var-battery-3: \f242;
+$fa-var-mountain-city: \e52e;
+$fa-var-coins: \f51e;
+$fa-var-khanda: \f66d;
+$fa-var-sliders: \f1de;
+$fa-var-sliders-h: \f1de;
+$fa-var-folder-tree: \f802;
+$fa-var-network-wired: \f6ff;
+$fa-var-map-pin: \f276;
+$fa-var-hamsa: \f665;
+$fa-var-cent-sign: \e3f5;
+$fa-var-flask: \f0c3;
+$fa-var-person-pregnant: \e31e;
+$fa-var-wand-sparkles: \f72b;
+$fa-var-ellipsis-vertical: \f142;
+$fa-var-ellipsis-v: \f142;
+$fa-var-ticket: \f145;
+$fa-var-power-off: \f011;
+$fa-var-right-long: \f30b;
+$fa-var-long-arrow-alt-right: \f30b;
+$fa-var-flag-usa: \f74d;
+$fa-var-laptop-file: \e51d;
+$fa-var-tty: \f1e4;
+$fa-var-teletype: \f1e4;
+$fa-var-diagram-next: \e476;
+$fa-var-person-rifle: \e54e;
+$fa-var-house-medical-circle-exclamation: \e512;
+$fa-var-closed-captioning: \f20a;
+$fa-var-person-hiking: \f6ec;
+$fa-var-hiking: \f6ec;
+$fa-var-venus-double: \f226;
+$fa-var-images: \f302;
+$fa-var-calculator: \f1ec;
+$fa-var-people-pulling: \e535;
+$fa-var-n: \4e;
+$fa-var-cable-car: \f7da;
+$fa-var-tram: \f7da;
+$fa-var-cloud-rain: \f73d;
+$fa-var-building-circle-xmark: \e4d4;
+$fa-var-ship: \f21a;
+$fa-var-arrows-down-to-line: \e4b8;
+$fa-var-download: \f019;
+$fa-var-face-grin: \f580;
+$fa-var-grin: \f580;
+$fa-var-delete-left: \f55a;
+$fa-var-backspace: \f55a;
+$fa-var-eye-dropper: \f1fb;
+$fa-var-eye-dropper-empty: \f1fb;
+$fa-var-eyedropper: \f1fb;
+$fa-var-file-circle-check: \e5a0;
+$fa-var-forward: \f04e;
+$fa-var-mobile: \f3ce;
+$fa-var-mobile-android: \f3ce;
+$fa-var-mobile-phone: \f3ce;
+$fa-var-face-meh: \f11a;
+$fa-var-meh: \f11a;
+$fa-var-align-center: \f037;
+$fa-var-book-skull: \f6b7;
+$fa-var-book-dead: \f6b7;
+$fa-var-id-card: \f2c2;
+$fa-var-drivers-license: \f2c2;
+$fa-var-outdent: \f03b;
+$fa-var-dedent: \f03b;
+$fa-var-heart-circle-exclamation: \e4fe;
+$fa-var-house: \f015;
+$fa-var-home: \f015;
+$fa-var-home-alt: \f015;
+$fa-var-home-lg-alt: \f015;
+$fa-var-calendar-week: \f784;
+$fa-var-laptop-medical: \f812;
+$fa-var-b: \42;
+$fa-var-file-medical: \f477;
+$fa-var-dice-one: \f525;
+$fa-var-kiwi-bird: \f535;
+$fa-var-arrow-right-arrow-left: \f0ec;
+$fa-var-exchange: \f0ec;
+$fa-var-rotate-right: \f2f9;
+$fa-var-redo-alt: \f2f9;
+$fa-var-rotate-forward: \f2f9;
+$fa-var-utensils: \f2e7;
+$fa-var-cutlery: \f2e7;
+$fa-var-arrow-up-wide-short: \f161;
+$fa-var-sort-amount-up: \f161;
+$fa-var-mill-sign: \e1ed;
+$fa-var-bowl-rice: \e2eb;
+$fa-var-skull: \f54c;
+$fa-var-tower-broadcast: \f519;
+$fa-var-broadcast-tower: \f519;
+$fa-var-truck-pickup: \f63c;
+$fa-var-up-long: \f30c;
+$fa-var-long-arrow-alt-up: \f30c;
+$fa-var-stop: \f04d;
+$fa-var-code-merge: \f387;
+$fa-var-upload: \f093;
+$fa-var-hurricane: \f751;
+$fa-var-mound: \e52d;
+$fa-var-toilet-portable: \e583;
+$fa-var-compact-disc: \f51f;
+$fa-var-file-arrow-down: \f56d;
+$fa-var-file-download: \f56d;
+$fa-var-caravan: \f8ff;
+$fa-var-shield-cat: \e572;
+$fa-var-bolt: \f0e7;
+$fa-var-zap: \f0e7;
+$fa-var-glass-water: \e4f4;
+$fa-var-oil-well: \e532;
+$fa-var-vault: \e2c5;
+$fa-var-mars: \f222;
+$fa-var-toilet: \f7d8;
+$fa-var-plane-circle-xmark: \e557;
+$fa-var-yen-sign: \f157;
+$fa-var-cny: \f157;
+$fa-var-jpy: \f157;
+$fa-var-rmb: \f157;
+$fa-var-yen: \f157;
+$fa-var-ruble-sign: \f158;
+$fa-var-rouble: \f158;
+$fa-var-rub: \f158;
+$fa-var-ruble: \f158;
+$fa-var-sun: \f185;
+$fa-var-guitar: \f7a6;
+$fa-var-face-laugh-wink: \f59c;
+$fa-var-laugh-wink: \f59c;
+$fa-var-horse-head: \f7ab;
+$fa-var-bore-hole: \e4c3;
+$fa-var-industry: \f275;
+$fa-var-circle-down: \f358;
+$fa-var-arrow-alt-circle-down: \f358;
+$fa-var-arrows-turn-to-dots: \e4c1;
+$fa-var-florin-sign: \e184;
+$fa-var-arrow-down-short-wide: \f884;
+$fa-var-sort-amount-desc: \f884;
+$fa-var-sort-amount-down-alt: \f884;
+$fa-var-less-than: \3c;
+$fa-var-angle-down: \f107;
+$fa-var-car-tunnel: \e4de;
+$fa-var-head-side-cough: \e061;
+$fa-var-grip-lines: \f7a4;
+$fa-var-thumbs-down: \f165;
+$fa-var-user-lock: \f502;
+$fa-var-arrow-right-long: \f178;
+$fa-var-long-arrow-right: \f178;
+$fa-var-anchor-circle-xmark: \e4ac;
+$fa-var-ellipsis: \f141;
+$fa-var-ellipsis-h: \f141;
+$fa-var-chess-pawn: \f443;
+$fa-var-kit-medical: \f479;
+$fa-var-first-aid: \f479;
+$fa-var-person-through-window: \e5a9;
+$fa-var-toolbox: \f552;
+$fa-var-hands-holding-circle: \e4fb;
+$fa-var-bug: \f188;
+$fa-var-credit-card: \f09d;
+$fa-var-credit-card-alt: \f09d;
+$fa-var-car: \f1b9;
+$fa-var-automobile: \f1b9;
+$fa-var-hand-holding-hand: \e4f7;
+$fa-var-book-open-reader: \f5da;
+$fa-var-book-reader: \f5da;
+$fa-var-mountain-sun: \e52f;
+$fa-var-arrows-left-right-to-line: \e4ba;
+$fa-var-dice-d20: \f6cf;
+$fa-var-truck-droplet: \e58c;
+$fa-var-file-circle-xmark: \e5a1;
+$fa-var-temperature-arrow-up: \e040;
+$fa-var-temperature-up: \e040;
+$fa-var-medal: \f5a2;
+$fa-var-bed: \f236;
+$fa-var-square-h: \f0fd;
+$fa-var-h-square: \f0fd;
+$fa-var-podcast: \f2ce;
+$fa-var-temperature-full: \f2c7;
+$fa-var-temperature-4: \f2c7;
+$fa-var-thermometer-4: \f2c7;
+$fa-var-thermometer-full: \f2c7;
+$fa-var-bell: \f0f3;
+$fa-var-superscript: \f12b;
+$fa-var-plug-circle-xmark: \e560;
+$fa-var-star-of-life: \f621;
+$fa-var-phone-slash: \f3dd;
+$fa-var-paint-roller: \f5aa;
+$fa-var-handshake-angle: \f4c4;
+$fa-var-hands-helping: \f4c4;
+$fa-var-location-dot: \f3c5;
+$fa-var-map-marker-alt: \f3c5;
+$fa-var-file: \f15b;
+$fa-var-greater-than: \3e;
+$fa-var-person-swimming: \f5c4;
+$fa-var-swimmer: \f5c4;
+$fa-var-arrow-down: \f063;
+$fa-var-droplet: \f043;
+$fa-var-tint: \f043;
+$fa-var-eraser: \f12d;
+$fa-var-earth-americas: \f57d;
+$fa-var-earth: \f57d;
+$fa-var-earth-america: \f57d;
+$fa-var-globe-americas: \f57d;
+$fa-var-person-burst: \e53b;
+$fa-var-dove: \f4ba;
+$fa-var-battery-empty: \f244;
+$fa-var-battery-0: \f244;
+$fa-var-socks: \f696;
+$fa-var-inbox: \f01c;
+$fa-var-section: \e447;
+$fa-var-gauge-high: \f625;
+$fa-var-tachometer-alt: \f625;
+$fa-var-tachometer-alt-fast: \f625;
+$fa-var-envelope-open-text: \f658;
+$fa-var-hospital: \f0f8;
+$fa-var-hospital-alt: \f0f8;
+$fa-var-hospital-wide: \f0f8;
+$fa-var-wine-bottle: \f72f;
+$fa-var-chess-rook: \f447;
+$fa-var-bars-staggered: \f550;
+$fa-var-reorder: \f550;
+$fa-var-stream: \f550;
+$fa-var-dharmachakra: \f655;
+$fa-var-hotdog: \f80f;
+$fa-var-person-walking-with-cane: \f29d;
+$fa-var-blind: \f29d;
+$fa-var-drum: \f569;
+$fa-var-ice-cream: \f810;
+$fa-var-heart-circle-bolt: \e4fc;
+$fa-var-fax: \f1ac;
+$fa-var-paragraph: \f1dd;
+$fa-var-check-to-slot: \f772;
+$fa-var-vote-yea: \f772;
+$fa-var-star-half: \f089;
+$fa-var-boxes-stacked: \f468;
+$fa-var-boxes: \f468;
+$fa-var-boxes-alt: \f468;
+$fa-var-link: \f0c1;
+$fa-var-chain: \f0c1;
+$fa-var-ear-listen: \f2a2;
+$fa-var-assistive-listening-systems: \f2a2;
+$fa-var-tree-city: \e587;
+$fa-var-play: \f04b;
+$fa-var-font: \f031;
+$fa-var-rupiah-sign: \e23d;
+$fa-var-magnifying-glass: \f002;
+$fa-var-search: \f002;
+$fa-var-table-tennis-paddle-ball: \f45d;
+$fa-var-ping-pong-paddle-ball: \f45d;
+$fa-var-table-tennis: \f45d;
+$fa-var-person-dots-from-line: \f470;
+$fa-var-diagnoses: \f470;
+$fa-var-trash-can-arrow-up: \f82a;
+$fa-var-trash-restore-alt: \f82a;
+$fa-var-naira-sign: \e1f6;
+$fa-var-cart-arrow-down: \f218;
+$fa-var-walkie-talkie: \f8ef;
+$fa-var-file-pen: \f31c;
+$fa-var-file-edit: \f31c;
+$fa-var-receipt: \f543;
+$fa-var-square-pen: \f14b;
+$fa-var-pen-square: \f14b;
+$fa-var-pencil-square: \f14b;
+$fa-var-suitcase-rolling: \f5c1;
+$fa-var-person-circle-exclamation: \e53f;
+$fa-var-chevron-down: \f078;
+$fa-var-battery-full: \f240;
+$fa-var-battery: \f240;
+$fa-var-battery-5: \f240;
+$fa-var-skull-crossbones: \f714;
+$fa-var-code-compare: \e13a;
+$fa-var-list-ul: \f0ca;
+$fa-var-list-dots: \f0ca;
+$fa-var-school-lock: \e56f;
+$fa-var-tower-cell: \e585;
+$fa-var-down-long: \f309;
+$fa-var-long-arrow-alt-down: \f309;
+$fa-var-ranking-star: \e561;
+$fa-var-chess-king: \f43f;
+$fa-var-person-harassing: \e549;
+$fa-var-brazilian-real-sign: \e46c;
+$fa-var-landmark-dome: \f752;
+$fa-var-landmark-alt: \f752;
+$fa-var-arrow-up: \f062;
+$fa-var-tv: \f26c;
+$fa-var-television: \f26c;
+$fa-var-tv-alt: \f26c;
+$fa-var-shrimp: \e448;
+$fa-var-list-check: \f0ae;
+$fa-var-tasks: \f0ae;
+$fa-var-jug-detergent: \e519;
+$fa-var-circle-user: \f2bd;
+$fa-var-user-circle: \f2bd;
+$fa-var-user-shield: \f505;
+$fa-var-wind: \f72e;
+$fa-var-car-burst: \f5e1;
+$fa-var-car-crash: \f5e1;
+$fa-var-y: \59;
+$fa-var-person-snowboarding: \f7ce;
+$fa-var-snowboarding: \f7ce;
+$fa-var-truck-fast: \f48b;
+$fa-var-shipping-fast: \f48b;
+$fa-var-fish: \f578;
+$fa-var-user-graduate: \f501;
+$fa-var-circle-half-stroke: \f042;
+$fa-var-adjust: \f042;
+$fa-var-clapperboard: \e131;
+$fa-var-circle-radiation: \f7ba;
+$fa-var-radiation-alt: \f7ba;
+$fa-var-baseball: \f433;
+$fa-var-baseball-ball: \f433;
+$fa-var-jet-fighter-up: \e518;
+$fa-var-diagram-project: \f542;
+$fa-var-project-diagram: \f542;
+$fa-var-copy: \f0c5;
+$fa-var-volume-xmark: \f6a9;
+$fa-var-volume-mute: \f6a9;
+$fa-var-volume-times: \f6a9;
+$fa-var-hand-sparkles: \e05d;
+$fa-var-grip: \f58d;
+$fa-var-grip-horizontal: \f58d;
+$fa-var-share-from-square: \f14d;
+$fa-var-share-square: \f14d;
+$fa-var-child-combatant: \e4e0;
+$fa-var-child-rifle: \e4e0;
+$fa-var-gun: \e19b;
+$fa-var-square-phone: \f098;
+$fa-var-phone-square: \f098;
+$fa-var-plus: \2b;
+$fa-var-add: \2b;
+$fa-var-expand: \f065;
+$fa-var-computer: \e4e5;
+$fa-var-xmark: \f00d;
+$fa-var-close: \f00d;
+$fa-var-multiply: \f00d;
+$fa-var-remove: \f00d;
+$fa-var-times: \f00d;
+$fa-var-arrows-up-down-left-right: \f047;
+$fa-var-arrows: \f047;
+$fa-var-chalkboard-user: \f51c;
+$fa-var-chalkboard-teacher: \f51c;
+$fa-var-peso-sign: \e222;
+$fa-var-building-shield: \e4d8;
+$fa-var-baby: \f77c;
+$fa-var-users-line: \e592;
+$fa-var-quote-left: \f10d;
+$fa-var-quote-left-alt: \f10d;
+$fa-var-tractor: \f722;
+$fa-var-trash-arrow-up: \f829;
+$fa-var-trash-restore: \f829;
+$fa-var-arrow-down-up-lock: \e4b0;
+$fa-var-lines-leaning: \e51e;
+$fa-var-ruler-combined: \f546;
+$fa-var-copyright: \f1f9;
+$fa-var-equals: \3d;
+$fa-var-blender: \f517;
+$fa-var-teeth: \f62e;
+$fa-var-shekel-sign: \f20b;
+$fa-var-ils: \f20b;
+$fa-var-shekel: \f20b;
+$fa-var-sheqel: \f20b;
+$fa-var-sheqel-sign: \f20b;
+$fa-var-map: \f279;
+$fa-var-rocket: \f135;
+$fa-var-photo-film: \f87c;
+$fa-var-photo-video: \f87c;
+$fa-var-folder-minus: \f65d;
+$fa-var-store: \f54e;
+$fa-var-arrow-trend-up: \e098;
+$fa-var-plug-circle-minus: \e55e;
+$fa-var-sign-hanging: \f4d9;
+$fa-var-sign: \f4d9;
+$fa-var-bezier-curve: \f55b;
+$fa-var-bell-slash: \f1f6;
+$fa-var-tablet: \f3fb;
+$fa-var-tablet-android: \f3fb;
+$fa-var-school-flag: \e56e;
+$fa-var-fill: \f575;
+$fa-var-angle-up: \f106;
+$fa-var-drumstick-bite: \f6d7;
+$fa-var-holly-berry: \f7aa;
+$fa-var-chevron-left: \f053;
+$fa-var-bacteria: \e059;
+$fa-var-hand-lizard: \f258;
+$fa-var-notdef: \e1fe;
+$fa-var-disease: \f7fa;
+$fa-var-briefcase-medical: \f469;
+$fa-var-genderless: \f22d;
+$fa-var-chevron-right: \f054;
+$fa-var-retweet: \f079;
+$fa-var-car-rear: \f5de;
+$fa-var-car-alt: \f5de;
+$fa-var-pump-soap: \e06b;
+$fa-var-video-slash: \f4e2;
+$fa-var-battery-quarter: \f243;
+$fa-var-battery-2: \f243;
+$fa-var-radio: \f8d7;
+$fa-var-baby-carriage: \f77d;
+$fa-var-carriage-baby: \f77d;
+$fa-var-traffic-light: \f637;
+$fa-var-thermometer: \f491;
+$fa-var-vr-cardboard: \f729;
+$fa-var-hand-middle-finger: \f806;
+$fa-var-percent: \25;
+$fa-var-percentage: \25;
+$fa-var-truck-moving: \f4df;
+$fa-var-glass-water-droplet: \e4f5;
+$fa-var-display: \e163;
+$fa-var-face-smile: \f118;
+$fa-var-smile: \f118;
+$fa-var-thumbtack: \f08d;
+$fa-var-thumb-tack: \f08d;
+$fa-var-trophy: \f091;
+$fa-var-person-praying: \f683;
+$fa-var-pray: \f683;
+$fa-var-hammer: \f6e3;
+$fa-var-hand-peace: \f25b;
+$fa-var-rotate: \f2f1;
+$fa-var-sync-alt: \f2f1;
+$fa-var-spinner: \f110;
+$fa-var-robot: \f544;
+$fa-var-peace: \f67c;
+$fa-var-gears: \f085;
+$fa-var-cogs: \f085;
+$fa-var-warehouse: \f494;
+$fa-var-arrow-up-right-dots: \e4b7;
+$fa-var-splotch: \f5bc;
+$fa-var-face-grin-hearts: \f584;
+$fa-var-grin-hearts: \f584;
+$fa-var-dice-four: \f524;
+$fa-var-sim-card: \f7c4;
+$fa-var-transgender: \f225;
+$fa-var-transgender-alt: \f225;
+$fa-var-mercury: \f223;
+$fa-var-arrow-turn-down: \f149;
+$fa-var-level-down: \f149;
+$fa-var-person-falling-burst: \e547;
+$fa-var-award: \f559;
+$fa-var-ticket-simple: \f3ff;
+$fa-var-ticket-alt: \f3ff;
+$fa-var-building: \f1ad;
+$fa-var-angles-left: \f100;
+$fa-var-angle-double-left: \f100;
+$fa-var-qrcode: \f029;
+$fa-var-clock-rotate-left: \f1da;
+$fa-var-history: \f1da;
+$fa-var-face-grin-beam-sweat: \f583;
+$fa-var-grin-beam-sweat: \f583;
+$fa-var-file-export: \f56e;
+$fa-var-arrow-right-from-file: \f56e;
+$fa-var-shield: \f132;
+$fa-var-shield-blank: \f132;
+$fa-var-arrow-up-short-wide: \f885;
+$fa-var-sort-amount-up-alt: \f885;
+$fa-var-house-medical: \e3b2;
+$fa-var-golf-ball-tee: \f450;
+$fa-var-golf-ball: \f450;
+$fa-var-circle-chevron-left: \f137;
+$fa-var-chevron-circle-left: \f137;
+$fa-var-house-chimney-window: \e00d;
+$fa-var-pen-nib: \f5ad;
+$fa-var-tent-arrow-turn-left: \e580;
+$fa-var-tents: \e582;
+$fa-var-wand-magic: \f0d0;
+$fa-var-magic: \f0d0;
+$fa-var-dog: \f6d3;
+$fa-var-carrot: \f787;
+$fa-var-moon: \f186;
+$fa-var-wine-glass-empty: \f5ce;
+$fa-var-wine-glass-alt: \f5ce;
+$fa-var-cheese: \f7ef;
+$fa-var-yin-yang: \f6ad;
+$fa-var-music: \f001;
+$fa-var-code-commit: \f386;
+$fa-var-temperature-low: \f76b;
+$fa-var-person-biking: \f84a;
+$fa-var-biking: \f84a;
+$fa-var-broom: \f51a;
+$fa-var-shield-heart: \e574;
+$fa-var-gopuram: \f664;
+$fa-var-earth-oceania: \e47b;
+$fa-var-globe-oceania: \e47b;
+$fa-var-square-xmark: \f2d3;
+$fa-var-times-square: \f2d3;
+$fa-var-xmark-square: \f2d3;
+$fa-var-hashtag: \23;
+$fa-var-up-right-and-down-left-from-center: \f424;
+$fa-var-expand-alt: \f424;
+$fa-var-oil-can: \f613;
+$fa-var-t: \54;
+$fa-var-hippo: \f6ed;
+$fa-var-chart-column: \e0e3;
+$fa-var-infinity: \f534;
+$fa-var-vial-circle-check: \e596;
+$fa-var-person-arrow-down-to-line: \e538;
+$fa-var-voicemail: \f897;
+$fa-var-fan: \f863;
+$fa-var-person-walking-luggage: \e554;
+$fa-var-up-down: \f338;
+$fa-var-arrows-alt-v: \f338;
+$fa-var-cloud-moon-rain: \f73c;
+$fa-var-calendar: \f133;
+$fa-var-trailer: \e041;
+$fa-var-bahai: \f666;
+$fa-var-haykal: \f666;
+$fa-var-sd-card: \f7c2;
+$fa-var-dragon: \f6d5;
+$fa-var-shoe-prints: \f54b;
+$fa-var-circle-plus: \f055;
+$fa-var-plus-circle: \f055;
+$fa-var-face-grin-tongue-wink: \f58b;
+$fa-var-grin-tongue-wink: \f58b;
+$fa-var-hand-holding: \f4bd;
+$fa-var-plug-circle-exclamation: \e55d;
+$fa-var-link-slash: \f127;
+$fa-var-chain-broken: \f127;
+$fa-var-chain-slash: \f127;
+$fa-var-unlink: \f127;
+$fa-var-clone: \f24d;
+$fa-var-person-walking-arrow-loop-left: \e551;
+$fa-var-arrow-up-z-a: \f882;
+$fa-var-sort-alpha-up-alt: \f882;
+$fa-var-fire-flame-curved: \f7e4;
+$fa-var-fire-alt: \f7e4;
+$fa-var-tornado: \f76f;
+$fa-var-file-circle-plus: \e494;
+$fa-var-book-quran: \f687;
+$fa-var-quran: \f687;
+$fa-var-anchor: \f13d;
+$fa-var-border-all: \f84c;
+$fa-var-face-angry: \f556;
+$fa-var-angry: \f556;
+$fa-var-cookie-bite: \f564;
+$fa-var-arrow-trend-down: \e097;
+$fa-var-rss: \f09e;
+$fa-var-feed: \f09e;
+$fa-var-draw-polygon: \f5ee;
+$fa-var-scale-balanced: \f24e;
+$fa-var-balance-scale: \f24e;
+$fa-var-gauge-simple-high: \f62a;
+$fa-var-tachometer: \f62a;
+$fa-var-tachometer-fast: \f62a;
+$fa-var-shower: \f2cc;
+$fa-var-desktop: \f390;
+$fa-var-desktop-alt: \f390;
+$fa-var-m: \4d;
+$fa-var-table-list: \f00b;
+$fa-var-th-list: \f00b;
+$fa-var-comment-sms: \f7cd;
+$fa-var-sms: \f7cd;
+$fa-var-book: \f02d;
+$fa-var-user-plus: \f234;
+$fa-var-check: \f00c;
+$fa-var-battery-three-quarters: \f241;
+$fa-var-battery-4: \f241;
+$fa-var-house-circle-check: \e509;
+$fa-var-angle-left: \f104;
+$fa-var-diagram-successor: \e47a;
+$fa-var-truck-arrow-right: \e58b;
+$fa-var-arrows-split-up-and-left: \e4bc;
+$fa-var-hand-fist: \f6de;
+$fa-var-fist-raised: \f6de;
+$fa-var-cloud-moon: \f6c3;
+$fa-var-briefcase: \f0b1;
+$fa-var-person-falling: \e546;
+$fa-var-image-portrait: \f3e0;
+$fa-var-portrait: \f3e0;
+$fa-var-user-tag: \f507;
+$fa-var-rug: \e569;
+$fa-var-earth-europe: \f7a2;
+$fa-var-globe-europe: \f7a2;
+$fa-var-cart-flatbed-suitcase: \f59d;
+$fa-var-luggage-cart: \f59d;
+$fa-var-rectangle-xmark: \f410;
+$fa-var-rectangle-times: \f410;
+$fa-var-times-rectangle: \f410;
+$fa-var-window-close: \f410;
+$fa-var-baht-sign: \e0ac;
+$fa-var-book-open: \f518;
+$fa-var-book-journal-whills: \f66a;
+$fa-var-journal-whills: \f66a;
+$fa-var-handcuffs: \e4f8;
+$fa-var-triangle-exclamation: \f071;
+$fa-var-exclamation-triangle: \f071;
+$fa-var-warning: \f071;
+$fa-var-database: \f1c0;
+$fa-var-share: \f064;
+$fa-var-mail-forward: \f064;
+$fa-var-bottle-droplet: \e4c4;
+$fa-var-mask-face: \e1d7;
+$fa-var-hill-rockslide: \e508;
+$fa-var-right-left: \f362;
+$fa-var-exchange-alt: \f362;
+$fa-var-paper-plane: \f1d8;
+$fa-var-road-circle-exclamation: \e565;
+$fa-var-dungeon: \f6d9;
+$fa-var-align-right: \f038;
+$fa-var-money-bill-1-wave: \f53b;
+$fa-var-money-bill-wave-alt: \f53b;
+$fa-var-life-ring: \f1cd;
+$fa-var-hands: \f2a7;
+$fa-var-sign-language: \f2a7;
+$fa-var-signing: \f2a7;
+$fa-var-calendar-day: \f783;
+$fa-var-water-ladder: \f5c5;
+$fa-var-ladder-water: \f5c5;
+$fa-var-swimming-pool: \f5c5;
+$fa-var-arrows-up-down: \f07d;
+$fa-var-arrows-v: \f07d;
+$fa-var-face-grimace: \f57f;
+$fa-var-grimace: \f57f;
+$fa-var-wheelchair-move: \e2ce;
+$fa-var-wheelchair-alt: \e2ce;
+$fa-var-turn-down: \f3be;
+$fa-var-level-down-alt: \f3be;
+$fa-var-person-walking-arrow-right: \e552;
+$fa-var-square-envelope: \f199;
+$fa-var-envelope-square: \f199;
+$fa-var-dice: \f522;
+$fa-var-bowling-ball: \f436;
+$fa-var-brain: \f5dc;
+$fa-var-bandage: \f462;
+$fa-var-band-aid: \f462;
+$fa-var-calendar-minus: \f272;
+$fa-var-circle-xmark: \f057;
+$fa-var-times-circle: \f057;
+$fa-var-xmark-circle: \f057;
+$fa-var-gifts: \f79c;
+$fa-var-hotel: \f594;
+$fa-var-earth-asia: \f57e;
+$fa-var-globe-asia: \f57e;
+$fa-var-id-card-clip: \f47f;
+$fa-var-id-card-alt: \f47f;
+$fa-var-magnifying-glass-plus: \f00e;
+$fa-var-search-plus: \f00e;
+$fa-var-thumbs-up: \f164;
+$fa-var-user-clock: \f4fd;
+$fa-var-hand-dots: \f461;
+$fa-var-allergies: \f461;
+$fa-var-file-invoice: \f570;
+$fa-var-window-minimize: \f2d1;
+$fa-var-mug-saucer: \f0f4;
+$fa-var-coffee: \f0f4;
+$fa-var-brush: \f55d;
+$fa-var-mask: \f6fa;
+$fa-var-magnifying-glass-minus: \f010;
+$fa-var-search-minus: \f010;
+$fa-var-ruler-vertical: \f548;
+$fa-var-user-large: \f406;
+$fa-var-user-alt: \f406;
+$fa-var-train-tram: \e5b4;
+$fa-var-user-nurse: \f82f;
+$fa-var-syringe: \f48e;
+$fa-var-cloud-sun: \f6c4;
+$fa-var-stopwatch-20: \e06f;
+$fa-var-square-full: \f45c;
+$fa-var-magnet: \f076;
+$fa-var-jar: \e516;
+$fa-var-note-sticky: \f249;
+$fa-var-sticky-note: \f249;
+$fa-var-bug-slash: \e490;
+$fa-var-arrow-up-from-water-pump: \e4b6;
+$fa-var-bone: \f5d7;
+$fa-var-user-injured: \f728;
+$fa-var-face-sad-tear: \f5b4;
+$fa-var-sad-tear: \f5b4;
+$fa-var-plane: \f072;
+$fa-var-tent-arrows-down: \e581;
+$fa-var-exclamation: \21;
+$fa-var-arrows-spin: \e4bb;
+$fa-var-print: \f02f;
+$fa-var-turkish-lira-sign: \e2bb;
+$fa-var-try: \e2bb;
+$fa-var-turkish-lira: \e2bb;
+$fa-var-dollar-sign: \24;
+$fa-var-dollar: \24;
+$fa-var-usd: \24;
+$fa-var-x: \58;
+$fa-var-magnifying-glass-dollar: \f688;
+$fa-var-search-dollar: \f688;
+$fa-var-users-gear: \f509;
+$fa-var-users-cog: \f509;
+$fa-var-person-military-pointing: \e54a;
+$fa-var-building-columns: \f19c;
+$fa-var-bank: \f19c;
+$fa-var-institution: \f19c;
+$fa-var-museum: \f19c;
+$fa-var-university: \f19c;
+$fa-var-umbrella: \f0e9;
+$fa-var-trowel: \e589;
+$fa-var-d: \44;
+$fa-var-stapler: \e5af;
+$fa-var-masks-theater: \f630;
+$fa-var-theater-masks: \f630;
+$fa-var-kip-sign: \e1c4;
+$fa-var-hand-point-left: \f0a5;
+$fa-var-handshake-simple: \f4c6;
+$fa-var-handshake-alt: \f4c6;
+$fa-var-jet-fighter: \f0fb;
+$fa-var-fighter-jet: \f0fb;
+$fa-var-square-share-nodes: \f1e1;
+$fa-var-share-alt-square: \f1e1;
+$fa-var-barcode: \f02a;
+$fa-var-plus-minus: \e43c;
+$fa-var-video: \f03d;
+$fa-var-video-camera: \f03d;
+$fa-var-graduation-cap: \f19d;
+$fa-var-mortar-board: \f19d;
+$fa-var-hand-holding-medical: \e05c;
+$fa-var-person-circle-check: \e53e;
+$fa-var-turn-up: \f3bf;
+$fa-var-level-up-alt: \f3bf;
+
+$fa-var-monero: \f3d0;
+$fa-var-hooli: \f427;
+$fa-var-yelp: \f1e9;
+$fa-var-cc-visa: \f1f0;
+$fa-var-lastfm: \f202;
+$fa-var-shopware: \f5b5;
+$fa-var-creative-commons-nc: \f4e8;
+$fa-var-aws: \f375;
+$fa-var-redhat: \f7bc;
+$fa-var-yoast: \f2b1;
+$fa-var-cloudflare: \e07d;
+$fa-var-ups: \f7e0;
+$fa-var-pixiv: \e640;
+$fa-var-wpexplorer: \f2de;
+$fa-var-dyalog: \f399;
+$fa-var-bity: \f37a;
+$fa-var-stackpath: \f842;
+$fa-var-buysellads: \f20d;
+$fa-var-first-order: \f2b0;
+$fa-var-modx: \f285;
+$fa-var-guilded: \e07e;
+$fa-var-vnv: \f40b;
+$fa-var-square-js: \f3b9;
+$fa-var-js-square: \f3b9;
+$fa-var-microsoft: \f3ca;
+$fa-var-qq: \f1d6;
+$fa-var-orcid: \f8d2;
+$fa-var-java: \f4e4;
+$fa-var-invision: \f7b0;
+$fa-var-creative-commons-pd-alt: \f4ed;
+$fa-var-centercode: \f380;
+$fa-var-glide-g: \f2a6;
+$fa-var-drupal: \f1a9;
+$fa-var-hire-a-helper: \f3b0;
+$fa-var-creative-commons-by: \f4e7;
+$fa-var-unity: \e049;
+$fa-var-whmcs: \f40d;
+$fa-var-rocketchat: \f3e8;
+$fa-var-vk: \f189;
+$fa-var-untappd: \f405;
+$fa-var-mailchimp: \f59e;
+$fa-var-css3-alt: \f38b;
+$fa-var-square-reddit: \f1a2;
+$fa-var-reddit-square: \f1a2;
+$fa-var-vimeo-v: \f27d;
+$fa-var-contao: \f26d;
+$fa-var-square-font-awesome: \e5ad;
+$fa-var-deskpro: \f38f;
+$fa-var-brave: \e63c;
+$fa-var-sistrix: \f3ee;
+$fa-var-square-instagram: \e055;
+$fa-var-instagram-square: \e055;
+$fa-var-battle-net: \f835;
+$fa-var-the-red-yeti: \f69d;
+$fa-var-square-hacker-news: \f3af;
+$fa-var-hacker-news-square: \f3af;
+$fa-var-edge: \f282;
+$fa-var-threads: \e618;
+$fa-var-napster: \f3d2;
+$fa-var-square-snapchat: \f2ad;
+$fa-var-snapchat-square: \f2ad;
+$fa-var-google-plus-g: \f0d5;
+$fa-var-artstation: \f77a;
+$fa-var-markdown: \f60f;
+$fa-var-sourcetree: \f7d3;
+$fa-var-google-plus: \f2b3;
+$fa-var-diaspora: \f791;
+$fa-var-foursquare: \f180;
+$fa-var-stack-overflow: \f16c;
+$fa-var-github-alt: \f113;
+$fa-var-phoenix-squadron: \f511;
+$fa-var-pagelines: \f18c;
+$fa-var-algolia: \f36c;
+$fa-var-red-river: \f3e3;
+$fa-var-creative-commons-sa: \f4ef;
+$fa-var-safari: \f267;
+$fa-var-google: \f1a0;
+$fa-var-square-font-awesome-stroke: \f35c;
+$fa-var-font-awesome-alt: \f35c;
+$fa-var-atlassian: \f77b;
+$fa-var-linkedin-in: \f0e1;
+$fa-var-digital-ocean: \f391;
+$fa-var-nimblr: \f5a8;
+$fa-var-chromecast: \f838;
+$fa-var-evernote: \f839;
+$fa-var-hacker-news: \f1d4;
+$fa-var-creative-commons-sampling: \f4f0;
+$fa-var-adversal: \f36a;
+$fa-var-creative-commons: \f25e;
+$fa-var-watchman-monitoring: \e087;
+$fa-var-fonticons: \f280;
+$fa-var-weixin: \f1d7;
+$fa-var-shirtsinbulk: \f214;
+$fa-var-codepen: \f1cb;
+$fa-var-git-alt: \f841;
+$fa-var-lyft: \f3c3;
+$fa-var-rev: \f5b2;
+$fa-var-windows: \f17a;
+$fa-var-wizards-of-the-coast: \f730;
+$fa-var-square-viadeo: \f2aa;
+$fa-var-viadeo-square: \f2aa;
+$fa-var-meetup: \f2e0;
+$fa-var-centos: \f789;
+$fa-var-adn: \f170;
+$fa-var-cloudsmith: \f384;
+$fa-var-opensuse: \e62b;
+$fa-var-pied-piper-alt: \f1a8;
+$fa-var-square-dribbble: \f397;
+$fa-var-dribbble-square: \f397;
+$fa-var-codiepie: \f284;
+$fa-var-node: \f419;
+$fa-var-mix: \f3cb;
+$fa-var-steam: \f1b6;
+$fa-var-cc-apple-pay: \f416;
+$fa-var-scribd: \f28a;
+$fa-var-debian: \e60b;
+$fa-var-openid: \f19b;
+$fa-var-instalod: \e081;
+$fa-var-expeditedssl: \f23e;
+$fa-var-sellcast: \f2da;
+$fa-var-square-twitter: \f081;
+$fa-var-twitter-square: \f081;
+$fa-var-r-project: \f4f7;
+$fa-var-delicious: \f1a5;
+$fa-var-freebsd: \f3a4;
+$fa-var-vuejs: \f41f;
+$fa-var-accusoft: \f369;
+$fa-var-ioxhost: \f208;
+$fa-var-fonticons-fi: \f3a2;
+$fa-var-app-store: \f36f;
+$fa-var-cc-mastercard: \f1f1;
+$fa-var-itunes-note: \f3b5;
+$fa-var-golang: \e40f;
+$fa-var-kickstarter: \f3bb;
+$fa-var-grav: \f2d6;
+$fa-var-weibo: \f18a;
+$fa-var-uncharted: \e084;
+$fa-var-firstdraft: \f3a1;
+$fa-var-square-youtube: \f431;
+$fa-var-youtube-square: \f431;
+$fa-var-wikipedia-w: \f266;
+$fa-var-wpressr: \f3e4;
+$fa-var-rendact: \f3e4;
+$fa-var-angellist: \f209;
+$fa-var-galactic-republic: \f50c;
+$fa-var-nfc-directional: \e530;
+$fa-var-skype: \f17e;
+$fa-var-joget: \f3b7;
+$fa-var-fedora: \f798;
+$fa-var-stripe-s: \f42a;
+$fa-var-meta: \e49b;
+$fa-var-laravel: \f3bd;
+$fa-var-hotjar: \f3b1;
+$fa-var-bluetooth-b: \f294;
+$fa-var-square-letterboxd: \e62e;
+$fa-var-sticker-mule: \f3f7;
+$fa-var-creative-commons-zero: \f4f3;
+$fa-var-hips: \f452;
+$fa-var-behance: \f1b4;
+$fa-var-reddit: \f1a1;
+$fa-var-discord: \f392;
+$fa-var-chrome: \f268;
+$fa-var-app-store-ios: \f370;
+$fa-var-cc-discover: \f1f2;
+$fa-var-wpbeginner: \f297;
+$fa-var-confluence: \f78d;
+$fa-var-shoelace: \e60c;
+$fa-var-mdb: \f8ca;
+$fa-var-dochub: \f394;
+$fa-var-accessible-icon: \f368;
+$fa-var-ebay: \f4f4;
+$fa-var-amazon: \f270;
+$fa-var-unsplash: \e07c;
+$fa-var-yarn: \f7e3;
+$fa-var-square-steam: \f1b7;
+$fa-var-steam-square: \f1b7;
+$fa-var-500px: \f26e;
+$fa-var-square-vimeo: \f194;
+$fa-var-vimeo-square: \f194;
+$fa-var-asymmetrik: \f372;
+$fa-var-font-awesome: \f2b4;
+$fa-var-font-awesome-flag: \f2b4;
+$fa-var-font-awesome-logo-full: \f2b4;
+$fa-var-gratipay: \f184;
+$fa-var-apple: \f179;
+$fa-var-hive: \e07f;
+$fa-var-gitkraken: \f3a6;
+$fa-var-keybase: \f4f5;
+$fa-var-apple-pay: \f415;
+$fa-var-padlet: \e4a0;
+$fa-var-amazon-pay: \f42c;
+$fa-var-square-github: \f092;
+$fa-var-github-square: \f092;
+$fa-var-stumbleupon: \f1a4;
+$fa-var-fedex: \f797;
+$fa-var-phoenix-framework: \f3dc;
+$fa-var-shopify: \e057;
+$fa-var-neos: \f612;
+$fa-var-square-threads: \e619;
+$fa-var-hackerrank: \f5f7;
+$fa-var-researchgate: \f4f8;
+$fa-var-swift: \f8e1;
+$fa-var-angular: \f420;
+$fa-var-speakap: \f3f3;
+$fa-var-angrycreative: \f36e;
+$fa-var-y-combinator: \f23b;
+$fa-var-empire: \f1d1;
+$fa-var-envira: \f299;
+$fa-var-google-scholar: \e63b;
+$fa-var-square-gitlab: \e5ae;
+$fa-var-gitlab-square: \e5ae;
+$fa-var-studiovinari: \f3f8;
+$fa-var-pied-piper: \f2ae;
+$fa-var-wordpress: \f19a;
+$fa-var-product-hunt: \f288;
+$fa-var-firefox: \f269;
+$fa-var-linode: \f2b8;
+$fa-var-goodreads: \f3a8;
+$fa-var-square-odnoklassniki: \f264;
+$fa-var-odnoklassniki-square: \f264;
+$fa-var-jsfiddle: \f1cc;
+$fa-var-sith: \f512;
+$fa-var-themeisle: \f2b2;
+$fa-var-page4: \f3d7;
+$fa-var-hashnode: \e499;
+$fa-var-react: \f41b;
+$fa-var-cc-paypal: \f1f4;
+$fa-var-squarespace: \f5be;
+$fa-var-cc-stripe: \f1f5;
+$fa-var-creative-commons-share: \f4f2;
+$fa-var-bitcoin: \f379;
+$fa-var-keycdn: \f3ba;
+$fa-var-opera: \f26a;
+$fa-var-itch-io: \f83a;
+$fa-var-umbraco: \f8e8;
+$fa-var-galactic-senate: \f50d;
+$fa-var-ubuntu: \f7df;
+$fa-var-draft2digital: \f396;
+$fa-var-stripe: \f429;
+$fa-var-houzz: \f27c;
+$fa-var-gg: \f260;
+$fa-var-dhl: \f790;
+$fa-var-square-pinterest: \f0d3;
+$fa-var-pinterest-square: \f0d3;
+$fa-var-xing: \f168;
+$fa-var-blackberry: \f37b;
+$fa-var-creative-commons-pd: \f4ec;
+$fa-var-playstation: \f3df;
+$fa-var-quinscape: \f459;
+$fa-var-less: \f41d;
+$fa-var-blogger-b: \f37d;
+$fa-var-opencart: \f23d;
+$fa-var-vine: \f1ca;
+$fa-var-signal-messenger: \e663;
+$fa-var-paypal: \f1ed;
+$fa-var-gitlab: \f296;
+$fa-var-typo3: \f42b;
+$fa-var-reddit-alien: \f281;
+$fa-var-yahoo: \f19e;
+$fa-var-dailymotion: \e052;
+$fa-var-affiliatetheme: \f36b;
+$fa-var-pied-piper-pp: \f1a7;
+$fa-var-bootstrap: \f836;
+$fa-var-odnoklassniki: \f263;
+$fa-var-nfc-symbol: \e531;
+$fa-var-mintbit: \e62f;
+$fa-var-ethereum: \f42e;
+$fa-var-speaker-deck: \f83c;
+$fa-var-creative-commons-nc-eu: \f4e9;
+$fa-var-patreon: \f3d9;
+$fa-var-avianex: \f374;
+$fa-var-ello: \f5f1;
+$fa-var-gofore: \f3a7;
+$fa-var-bimobject: \f378;
+$fa-var-brave-reverse: \e63d;
+$fa-var-facebook-f: \f39e;
+$fa-var-square-google-plus: \f0d4;
+$fa-var-google-plus-square: \f0d4;
+$fa-var-mandalorian: \f50f;
+$fa-var-first-order-alt: \f50a;
+$fa-var-osi: \f41a;
+$fa-var-google-wallet: \f1ee;
+$fa-var-d-and-d-beyond: \f6ca;
+$fa-var-periscope: \f3da;
+$fa-var-fulcrum: \f50b;
+$fa-var-cloudscale: \f383;
+$fa-var-forumbee: \f211;
+$fa-var-mizuni: \f3cc;
+$fa-var-schlix: \f3ea;
+$fa-var-square-xing: \f169;
+$fa-var-xing-square: \f169;
+$fa-var-bandcamp: \f2d5;
+$fa-var-wpforms: \f298;
+$fa-var-cloudversify: \f385;
+$fa-var-usps: \f7e1;
+$fa-var-megaport: \f5a3;
+$fa-var-magento: \f3c4;
+$fa-var-spotify: \f1bc;
+$fa-var-optin-monster: \f23c;
+$fa-var-fly: \f417;
+$fa-var-aviato: \f421;
+$fa-var-itunes: \f3b4;
+$fa-var-cuttlefish: \f38c;
+$fa-var-blogger: \f37c;
+$fa-var-flickr: \f16e;
+$fa-var-viber: \f409;
+$fa-var-soundcloud: \f1be;
+$fa-var-digg: \f1a6;
+$fa-var-tencent-weibo: \f1d5;
+$fa-var-letterboxd: \e62d;
+$fa-var-symfony: \f83d;
+$fa-var-maxcdn: \f136;
+$fa-var-etsy: \f2d7;
+$fa-var-facebook-messenger: \f39f;
+$fa-var-audible: \f373;
+$fa-var-think-peaks: \f731;
+$fa-var-bilibili: \e3d9;
+$fa-var-erlang: \f39d;
+$fa-var-x-twitter: \e61b;
+$fa-var-cotton-bureau: \f89e;
+$fa-var-dashcube: \f210;
+$fa-var-42-group: \e080;
+$fa-var-innosoft: \e080;
+$fa-var-stack-exchange: \f18d;
+$fa-var-elementor: \f430;
+$fa-var-square-pied-piper: \e01e;
+$fa-var-pied-piper-square: \e01e;
+$fa-var-creative-commons-nd: \f4eb;
+$fa-var-palfed: \f3d8;
+$fa-var-superpowers: \f2dd;
+$fa-var-resolving: \f3e7;
+$fa-var-xbox: \f412;
+$fa-var-searchengin: \f3eb;
+$fa-var-tiktok: \e07b;
+$fa-var-square-facebook: \f082;
+$fa-var-facebook-square: \f082;
+$fa-var-renren: \f18b;
+$fa-var-linux: \f17c;
+$fa-var-glide: \f2a5;
+$fa-var-linkedin: \f08c;
+$fa-var-hubspot: \f3b2;
+$fa-var-deploydog: \f38e;
+$fa-var-twitch: \f1e8;
+$fa-var-ravelry: \f2d9;
+$fa-var-mixer: \e056;
+$fa-var-square-lastfm: \f203;
+$fa-var-lastfm-square: \f203;
+$fa-var-vimeo: \f40a;
+$fa-var-mendeley: \f7b3;
+$fa-var-uniregistry: \f404;
+$fa-var-figma: \f799;
+$fa-var-creative-commons-remix: \f4ee;
+$fa-var-cc-amazon-pay: \f42d;
+$fa-var-dropbox: \f16b;
+$fa-var-instagram: \f16d;
+$fa-var-cmplid: \e360;
+$fa-var-upwork: \e641;
+$fa-var-facebook: \f09a;
+$fa-var-gripfire: \f3ac;
+$fa-var-jedi-order: \f50e;
+$fa-var-uikit: \f403;
+$fa-var-fort-awesome-alt: \f3a3;
+$fa-var-phabricator: \f3db;
+$fa-var-ussunnah: \f407;
+$fa-var-earlybirds: \f39a;
+$fa-var-trade-federation: \f513;
+$fa-var-autoprefixer: \f41c;
+$fa-var-whatsapp: \f232;
+$fa-var-slideshare: \f1e7;
+$fa-var-google-play: \f3ab;
+$fa-var-viadeo: \f2a9;
+$fa-var-line: \f3c0;
+$fa-var-google-drive: \f3aa;
+$fa-var-servicestack: \f3ec;
+$fa-var-simplybuilt: \f215;
+$fa-var-bitbucket: \f171;
+$fa-var-imdb: \f2d8;
+$fa-var-deezer: \e077;
+$fa-var-raspberry-pi: \f7bb;
+$fa-var-jira: \f7b1;
+$fa-var-docker: \f395;
+$fa-var-screenpal: \e570;
+$fa-var-bluetooth: \f293;
+$fa-var-gitter: \f426;
+$fa-var-d-and-d: \f38d;
+$fa-var-microblog: \e01a;
+$fa-var-cc-diners-club: \f24c;
+$fa-var-gg-circle: \f261;
+$fa-var-pied-piper-hat: \f4e5;
+$fa-var-kickstarter-k: \f3bc;
+$fa-var-yandex: \f413;
+$fa-var-readme: \f4d5;
+$fa-var-html5: \f13b;
+$fa-var-sellsy: \f213;
+$fa-var-sass: \f41e;
+$fa-var-wirsindhandwerk: \e2d0;
+$fa-var-wsh: \e2d0;
+$fa-var-buromobelexperte: \f37f;
+$fa-var-salesforce: \f83b;
+$fa-var-octopus-deploy: \e082;
+$fa-var-medapps: \f3c6;
+$fa-var-ns8: \f3d5;
+$fa-var-pinterest-p: \f231;
+$fa-var-apper: \f371;
+$fa-var-fort-awesome: \f286;
+$fa-var-waze: \f83f;
+$fa-var-cc-jcb: \f24b;
+$fa-var-snapchat: \f2ab;
+$fa-var-snapchat-ghost: \f2ab;
+$fa-var-fantasy-flight-games: \f6dc;
+$fa-var-rust: \e07a;
+$fa-var-wix: \f5cf;
+$fa-var-square-behance: \f1b5;
+$fa-var-behance-square: \f1b5;
+$fa-var-supple: \f3f9;
+$fa-var-webflow: \e65c;
+$fa-var-rebel: \f1d0;
+$fa-var-css3: \f13c;
+$fa-var-staylinked: \f3f5;
+$fa-var-kaggle: \f5fa;
+$fa-var-space-awesome: \e5ac;
+$fa-var-deviantart: \f1bd;
+$fa-var-cpanel: \f388;
+$fa-var-goodreads-g: \f3a9;
+$fa-var-square-git: \f1d2;
+$fa-var-git-square: \f1d2;
+$fa-var-square-tumblr: \f174;
+$fa-var-tumblr-square: \f174;
+$fa-var-trello: \f181;
+$fa-var-creative-commons-nc-jp: \f4ea;
+$fa-var-get-pocket: \f265;
+$fa-var-perbyte: \e083;
+$fa-var-grunt: \f3ad;
+$fa-var-weebly: \f5cc;
+$fa-var-connectdevelop: \f20e;
+$fa-var-leanpub: \f212;
+$fa-var-black-tie: \f27e;
+$fa-var-themeco: \f5c6;
+$fa-var-python: \f3e2;
+$fa-var-android: \f17b;
+$fa-var-bots: \e340;
+$fa-var-free-code-camp: \f2c5;
+$fa-var-hornbill: \f592;
+$fa-var-js: \f3b8;
+$fa-var-ideal: \e013;
+$fa-var-git: \f1d3;
+$fa-var-dev: \f6cc;
+$fa-var-sketch: \f7c6;
+$fa-var-yandex-international: \f414;
+$fa-var-cc-amex: \f1f3;
+$fa-var-uber: \f402;
+$fa-var-github: \f09b;
+$fa-var-php: \f457;
+$fa-var-alipay: \f642;
+$fa-var-youtube: \f167;
+$fa-var-skyatlas: \f216;
+$fa-var-firefox-browser: \e007;
+$fa-var-replyd: \f3e6;
+$fa-var-suse: \f7d6;
+$fa-var-jenkins: \f3b6;
+$fa-var-twitter: \f099;
+$fa-var-rockrms: \f3e9;
+$fa-var-pinterest: \f0d2;
+$fa-var-buffer: \f837;
+$fa-var-npm: \f3d4;
+$fa-var-yammer: \f840;
+$fa-var-btc: \f15a;
+$fa-var-dribbble: \f17d;
+$fa-var-stumbleupon-circle: \f1a3;
+$fa-var-internet-explorer: \f26b;
+$fa-var-stubber: \e5c7;
+$fa-var-telegram: \f2c6;
+$fa-var-telegram-plane: \f2c6;
+$fa-var-old-republic: \f510;
+$fa-var-odysee: \e5c6;
+$fa-var-square-whatsapp: \f40c;
+$fa-var-whatsapp-square: \f40c;
+$fa-var-node-js: \f3d3;
+$fa-var-edge-legacy: \e078;
+$fa-var-slack: \f198;
+$fa-var-slack-hash: \f198;
+$fa-var-medrt: \f3c8;
+$fa-var-usb: \f287;
+$fa-var-tumblr: \f173;
+$fa-var-vaadin: \f408;
+$fa-var-quora: \f2c4;
+$fa-var-square-x-twitter: \e61a;
+$fa-var-reacteurope: \f75d;
+$fa-var-medium: \f23a;
+$fa-var-medium-m: \f23a;
+$fa-var-amilia: \f36d;
+$fa-var-mixcloud: \f289;
+$fa-var-flipboard: \f44d;
+$fa-var-viacoin: \f237;
+$fa-var-critical-role: \f6c9;
+$fa-var-sitrox: \e44a;
+$fa-var-discourse: \f393;
+$fa-var-joomla: \f1aa;
+$fa-var-mastodon: \f4f6;
+$fa-var-airbnb: \f834;
+$fa-var-wolf-pack-battalion: \f514;
+$fa-var-buy-n-large: \f8a6;
+$fa-var-gulp: \f3ae;
+$fa-var-creative-commons-sampling-plus: \f4f1;
+$fa-var-strava: \f428;
+$fa-var-ember: \f423;
+$fa-var-canadian-maple-leaf: \f785;
+$fa-var-teamspeak: \f4f9;
+$fa-var-pushed: \f3e1;
+$fa-var-wordpress-simple: \f411;
+$fa-var-nutritionix: \f3d6;
+$fa-var-wodu: \e088;
+$fa-var-google-pay: \e079;
+$fa-var-intercom: \f7af;
+$fa-var-zhihu: \f63f;
+$fa-var-korvue: \f42f;
+$fa-var-pix: \e43a;
+$fa-var-steam-symbol: \f3f6;
+
+$fa-icons: (
+ "0": $fa-var-0,
+ "1": $fa-var-1,
+ "2": $fa-var-2,
+ "3": $fa-var-3,
+ "4": $fa-var-4,
+ "5": $fa-var-5,
+ "6": $fa-var-6,
+ "7": $fa-var-7,
+ "8": $fa-var-8,
+ "9": $fa-var-9,
+ "fill-drip": $fa-var-fill-drip,
+ "arrows-to-circle": $fa-var-arrows-to-circle,
+ "circle-chevron-right": $fa-var-circle-chevron-right,
+ "chevron-circle-right": $fa-var-chevron-circle-right,
+ "at": $fa-var-at,
+ "trash-can": $fa-var-trash-can,
+ "trash-alt": $fa-var-trash-alt,
+ "text-height": $fa-var-text-height,
+ "user-xmark": $fa-var-user-xmark,
+ "user-times": $fa-var-user-times,
+ "stethoscope": $fa-var-stethoscope,
+ "message": $fa-var-message,
+ "comment-alt": $fa-var-comment-alt,
+ "info": $fa-var-info,
+ "down-left-and-up-right-to-center": $fa-var-down-left-and-up-right-to-center,
+ "compress-alt": $fa-var-compress-alt,
+ "explosion": $fa-var-explosion,
+ "file-lines": $fa-var-file-lines,
+ "file-alt": $fa-var-file-alt,
+ "file-text": $fa-var-file-text,
+ "wave-square": $fa-var-wave-square,
+ "ring": $fa-var-ring,
+ "building-un": $fa-var-building-un,
+ "dice-three": $fa-var-dice-three,
+ "calendar-days": $fa-var-calendar-days,
+ "calendar-alt": $fa-var-calendar-alt,
+ "anchor-circle-check": $fa-var-anchor-circle-check,
+ "building-circle-arrow-right": $fa-var-building-circle-arrow-right,
+ "volleyball": $fa-var-volleyball,
+ "volleyball-ball": $fa-var-volleyball-ball,
+ "arrows-up-to-line": $fa-var-arrows-up-to-line,
+ "sort-down": $fa-var-sort-down,
+ "sort-desc": $fa-var-sort-desc,
+ "circle-minus": $fa-var-circle-minus,
+ "minus-circle": $fa-var-minus-circle,
+ "door-open": $fa-var-door-open,
+ "right-from-bracket": $fa-var-right-from-bracket,
+ "sign-out-alt": $fa-var-sign-out-alt,
+ "atom": $fa-var-atom,
+ "soap": $fa-var-soap,
+ "icons": $fa-var-icons,
+ "heart-music-camera-bolt": $fa-var-heart-music-camera-bolt,
+ "microphone-lines-slash": $fa-var-microphone-lines-slash,
+ "microphone-alt-slash": $fa-var-microphone-alt-slash,
+ "bridge-circle-check": $fa-var-bridge-circle-check,
+ "pump-medical": $fa-var-pump-medical,
+ "fingerprint": $fa-var-fingerprint,
+ "hand-point-right": $fa-var-hand-point-right,
+ "magnifying-glass-location": $fa-var-magnifying-glass-location,
+ "search-location": $fa-var-search-location,
+ "forward-step": $fa-var-forward-step,
+ "step-forward": $fa-var-step-forward,
+ "face-smile-beam": $fa-var-face-smile-beam,
+ "smile-beam": $fa-var-smile-beam,
+ "flag-checkered": $fa-var-flag-checkered,
+ "football": $fa-var-football,
+ "football-ball": $fa-var-football-ball,
+ "school-circle-exclamation": $fa-var-school-circle-exclamation,
+ "crop": $fa-var-crop,
+ "angles-down": $fa-var-angles-down,
+ "angle-double-down": $fa-var-angle-double-down,
+ "users-rectangle": $fa-var-users-rectangle,
+ "people-roof": $fa-var-people-roof,
+ "people-line": $fa-var-people-line,
+ "beer-mug-empty": $fa-var-beer-mug-empty,
+ "beer": $fa-var-beer,
+ "diagram-predecessor": $fa-var-diagram-predecessor,
+ "arrow-up-long": $fa-var-arrow-up-long,
+ "long-arrow-up": $fa-var-long-arrow-up,
+ "fire-flame-simple": $fa-var-fire-flame-simple,
+ "burn": $fa-var-burn,
+ "person": $fa-var-person,
+ "male": $fa-var-male,
+ "laptop": $fa-var-laptop,
+ "file-csv": $fa-var-file-csv,
+ "menorah": $fa-var-menorah,
+ "truck-plane": $fa-var-truck-plane,
+ "record-vinyl": $fa-var-record-vinyl,
+ "face-grin-stars": $fa-var-face-grin-stars,
+ "grin-stars": $fa-var-grin-stars,
+ "bong": $fa-var-bong,
+ "spaghetti-monster-flying": $fa-var-spaghetti-monster-flying,
+ "pastafarianism": $fa-var-pastafarianism,
+ "arrow-down-up-across-line": $fa-var-arrow-down-up-across-line,
+ "spoon": $fa-var-spoon,
+ "utensil-spoon": $fa-var-utensil-spoon,
+ "jar-wheat": $fa-var-jar-wheat,
+ "envelopes-bulk": $fa-var-envelopes-bulk,
+ "mail-bulk": $fa-var-mail-bulk,
+ "file-circle-exclamation": $fa-var-file-circle-exclamation,
+ "circle-h": $fa-var-circle-h,
+ "hospital-symbol": $fa-var-hospital-symbol,
+ "pager": $fa-var-pager,
+ "address-book": $fa-var-address-book,
+ "contact-book": $fa-var-contact-book,
+ "strikethrough": $fa-var-strikethrough,
+ "k": $fa-var-k,
+ "landmark-flag": $fa-var-landmark-flag,
+ "pencil": $fa-var-pencil,
+ "pencil-alt": $fa-var-pencil-alt,
+ "backward": $fa-var-backward,
+ "caret-right": $fa-var-caret-right,
+ "comments": $fa-var-comments,
+ "paste": $fa-var-paste,
+ "file-clipboard": $fa-var-file-clipboard,
+ "code-pull-request": $fa-var-code-pull-request,
+ "clipboard-list": $fa-var-clipboard-list,
+ "truck-ramp-box": $fa-var-truck-ramp-box,
+ "truck-loading": $fa-var-truck-loading,
+ "user-check": $fa-var-user-check,
+ "vial-virus": $fa-var-vial-virus,
+ "sheet-plastic": $fa-var-sheet-plastic,
+ "blog": $fa-var-blog,
+ "user-ninja": $fa-var-user-ninja,
+ "person-arrow-up-from-line": $fa-var-person-arrow-up-from-line,
+ "scroll-torah": $fa-var-scroll-torah,
+ "torah": $fa-var-torah,
+ "broom-ball": $fa-var-broom-ball,
+ "quidditch": $fa-var-quidditch,
+ "quidditch-broom-ball": $fa-var-quidditch-broom-ball,
+ "toggle-off": $fa-var-toggle-off,
+ "box-archive": $fa-var-box-archive,
+ "archive": $fa-var-archive,
+ "person-drowning": $fa-var-person-drowning,
+ "arrow-down-9-1": $fa-var-arrow-down-9-1,
+ "sort-numeric-desc": $fa-var-sort-numeric-desc,
+ "sort-numeric-down-alt": $fa-var-sort-numeric-down-alt,
+ "face-grin-tongue-squint": $fa-var-face-grin-tongue-squint,
+ "grin-tongue-squint": $fa-var-grin-tongue-squint,
+ "spray-can": $fa-var-spray-can,
+ "truck-monster": $fa-var-truck-monster,
+ "w": $fa-var-w,
+ "earth-africa": $fa-var-earth-africa,
+ "globe-africa": $fa-var-globe-africa,
+ "rainbow": $fa-var-rainbow,
+ "circle-notch": $fa-var-circle-notch,
+ "tablet-screen-button": $fa-var-tablet-screen-button,
+ "tablet-alt": $fa-var-tablet-alt,
+ "paw": $fa-var-paw,
+ "cloud": $fa-var-cloud,
+ "trowel-bricks": $fa-var-trowel-bricks,
+ "face-flushed": $fa-var-face-flushed,
+ "flushed": $fa-var-flushed,
+ "hospital-user": $fa-var-hospital-user,
+ "tent-arrow-left-right": $fa-var-tent-arrow-left-right,
+ "gavel": $fa-var-gavel,
+ "legal": $fa-var-legal,
+ "binoculars": $fa-var-binoculars,
+ "microphone-slash": $fa-var-microphone-slash,
+ "box-tissue": $fa-var-box-tissue,
+ "motorcycle": $fa-var-motorcycle,
+ "bell-concierge": $fa-var-bell-concierge,
+ "concierge-bell": $fa-var-concierge-bell,
+ "pen-ruler": $fa-var-pen-ruler,
+ "pencil-ruler": $fa-var-pencil-ruler,
+ "people-arrows": $fa-var-people-arrows,
+ "people-arrows-left-right": $fa-var-people-arrows-left-right,
+ "mars-and-venus-burst": $fa-var-mars-and-venus-burst,
+ "square-caret-right": $fa-var-square-caret-right,
+ "caret-square-right": $fa-var-caret-square-right,
+ "scissors": $fa-var-scissors,
+ "cut": $fa-var-cut,
+ "sun-plant-wilt": $fa-var-sun-plant-wilt,
+ "toilets-portable": $fa-var-toilets-portable,
+ "hockey-puck": $fa-var-hockey-puck,
+ "table": $fa-var-table,
+ "magnifying-glass-arrow-right": $fa-var-magnifying-glass-arrow-right,
+ "tachograph-digital": $fa-var-tachograph-digital,
+ "digital-tachograph": $fa-var-digital-tachograph,
+ "users-slash": $fa-var-users-slash,
+ "clover": $fa-var-clover,
+ "reply": $fa-var-reply,
+ "mail-reply": $fa-var-mail-reply,
+ "star-and-crescent": $fa-var-star-and-crescent,
+ "house-fire": $fa-var-house-fire,
+ "square-minus": $fa-var-square-minus,
+ "minus-square": $fa-var-minus-square,
+ "helicopter": $fa-var-helicopter,
+ "compass": $fa-var-compass,
+ "square-caret-down": $fa-var-square-caret-down,
+ "caret-square-down": $fa-var-caret-square-down,
+ "file-circle-question": $fa-var-file-circle-question,
+ "laptop-code": $fa-var-laptop-code,
+ "swatchbook": $fa-var-swatchbook,
+ "prescription-bottle": $fa-var-prescription-bottle,
+ "bars": $fa-var-bars,
+ "navicon": $fa-var-navicon,
+ "people-group": $fa-var-people-group,
+ "hourglass-end": $fa-var-hourglass-end,
+ "hourglass-3": $fa-var-hourglass-3,
+ "heart-crack": $fa-var-heart-crack,
+ "heart-broken": $fa-var-heart-broken,
+ "square-up-right": $fa-var-square-up-right,
+ "external-link-square-alt": $fa-var-external-link-square-alt,
+ "face-kiss-beam": $fa-var-face-kiss-beam,
+ "kiss-beam": $fa-var-kiss-beam,
+ "film": $fa-var-film,
+ "ruler-horizontal": $fa-var-ruler-horizontal,
+ "people-robbery": $fa-var-people-robbery,
+ "lightbulb": $fa-var-lightbulb,
+ "caret-left": $fa-var-caret-left,
+ "circle-exclamation": $fa-var-circle-exclamation,
+ "exclamation-circle": $fa-var-exclamation-circle,
+ "school-circle-xmark": $fa-var-school-circle-xmark,
+ "arrow-right-from-bracket": $fa-var-arrow-right-from-bracket,
+ "sign-out": $fa-var-sign-out,
+ "circle-chevron-down": $fa-var-circle-chevron-down,
+ "chevron-circle-down": $fa-var-chevron-circle-down,
+ "unlock-keyhole": $fa-var-unlock-keyhole,
+ "unlock-alt": $fa-var-unlock-alt,
+ "cloud-showers-heavy": $fa-var-cloud-showers-heavy,
+ "headphones-simple": $fa-var-headphones-simple,
+ "headphones-alt": $fa-var-headphones-alt,
+ "sitemap": $fa-var-sitemap,
+ "circle-dollar-to-slot": $fa-var-circle-dollar-to-slot,
+ "donate": $fa-var-donate,
+ "memory": $fa-var-memory,
+ "road-spikes": $fa-var-road-spikes,
+ "fire-burner": $fa-var-fire-burner,
+ "flag": $fa-var-flag,
+ "hanukiah": $fa-var-hanukiah,
+ "feather": $fa-var-feather,
+ "volume-low": $fa-var-volume-low,
+ "volume-down": $fa-var-volume-down,
+ "comment-slash": $fa-var-comment-slash,
+ "cloud-sun-rain": $fa-var-cloud-sun-rain,
+ "compress": $fa-var-compress,
+ "wheat-awn": $fa-var-wheat-awn,
+ "wheat-alt": $fa-var-wheat-alt,
+ "ankh": $fa-var-ankh,
+ "hands-holding-child": $fa-var-hands-holding-child,
+ "asterisk": $fa-var-asterisk,
+ "square-check": $fa-var-square-check,
+ "check-square": $fa-var-check-square,
+ "peseta-sign": $fa-var-peseta-sign,
+ "heading": $fa-var-heading,
+ "header": $fa-var-header,
+ "ghost": $fa-var-ghost,
+ "list": $fa-var-list,
+ "list-squares": $fa-var-list-squares,
+ "square-phone-flip": $fa-var-square-phone-flip,
+ "phone-square-alt": $fa-var-phone-square-alt,
+ "cart-plus": $fa-var-cart-plus,
+ "gamepad": $fa-var-gamepad,
+ "circle-dot": $fa-var-circle-dot,
+ "dot-circle": $fa-var-dot-circle,
+ "face-dizzy": $fa-var-face-dizzy,
+ "dizzy": $fa-var-dizzy,
+ "egg": $fa-var-egg,
+ "house-medical-circle-xmark": $fa-var-house-medical-circle-xmark,
+ "campground": $fa-var-campground,
+ "folder-plus": $fa-var-folder-plus,
+ "futbol": $fa-var-futbol,
+ "futbol-ball": $fa-var-futbol-ball,
+ "soccer-ball": $fa-var-soccer-ball,
+ "paintbrush": $fa-var-paintbrush,
+ "paint-brush": $fa-var-paint-brush,
+ "lock": $fa-var-lock,
+ "gas-pump": $fa-var-gas-pump,
+ "hot-tub-person": $fa-var-hot-tub-person,
+ "hot-tub": $fa-var-hot-tub,
+ "map-location": $fa-var-map-location,
+ "map-marked": $fa-var-map-marked,
+ "house-flood-water": $fa-var-house-flood-water,
+ "tree": $fa-var-tree,
+ "bridge-lock": $fa-var-bridge-lock,
+ "sack-dollar": $fa-var-sack-dollar,
+ "pen-to-square": $fa-var-pen-to-square,
+ "edit": $fa-var-edit,
+ "car-side": $fa-var-car-side,
+ "share-nodes": $fa-var-share-nodes,
+ "share-alt": $fa-var-share-alt,
+ "heart-circle-minus": $fa-var-heart-circle-minus,
+ "hourglass-half": $fa-var-hourglass-half,
+ "hourglass-2": $fa-var-hourglass-2,
+ "microscope": $fa-var-microscope,
+ "sink": $fa-var-sink,
+ "bag-shopping": $fa-var-bag-shopping,
+ "shopping-bag": $fa-var-shopping-bag,
+ "arrow-down-z-a": $fa-var-arrow-down-z-a,
+ "sort-alpha-desc": $fa-var-sort-alpha-desc,
+ "sort-alpha-down-alt": $fa-var-sort-alpha-down-alt,
+ "mitten": $fa-var-mitten,
+ "person-rays": $fa-var-person-rays,
+ "users": $fa-var-users,
+ "eye-slash": $fa-var-eye-slash,
+ "flask-vial": $fa-var-flask-vial,
+ "hand": $fa-var-hand,
+ "hand-paper": $fa-var-hand-paper,
+ "om": $fa-var-om,
+ "worm": $fa-var-worm,
+ "house-circle-xmark": $fa-var-house-circle-xmark,
+ "plug": $fa-var-plug,
+ "chevron-up": $fa-var-chevron-up,
+ "hand-spock": $fa-var-hand-spock,
+ "stopwatch": $fa-var-stopwatch,
+ "face-kiss": $fa-var-face-kiss,
+ "kiss": $fa-var-kiss,
+ "bridge-circle-xmark": $fa-var-bridge-circle-xmark,
+ "face-grin-tongue": $fa-var-face-grin-tongue,
+ "grin-tongue": $fa-var-grin-tongue,
+ "chess-bishop": $fa-var-chess-bishop,
+ "face-grin-wink": $fa-var-face-grin-wink,
+ "grin-wink": $fa-var-grin-wink,
+ "ear-deaf": $fa-var-ear-deaf,
+ "deaf": $fa-var-deaf,
+ "deafness": $fa-var-deafness,
+ "hard-of-hearing": $fa-var-hard-of-hearing,
+ "road-circle-check": $fa-var-road-circle-check,
+ "dice-five": $fa-var-dice-five,
+ "square-rss": $fa-var-square-rss,
+ "rss-square": $fa-var-rss-square,
+ "land-mine-on": $fa-var-land-mine-on,
+ "i-cursor": $fa-var-i-cursor,
+ "stamp": $fa-var-stamp,
+ "stairs": $fa-var-stairs,
+ "i": $fa-var-i,
+ "hryvnia-sign": $fa-var-hryvnia-sign,
+ "hryvnia": $fa-var-hryvnia,
+ "pills": $fa-var-pills,
+ "face-grin-wide": $fa-var-face-grin-wide,
+ "grin-alt": $fa-var-grin-alt,
+ "tooth": $fa-var-tooth,
+ "v": $fa-var-v,
+ "bangladeshi-taka-sign": $fa-var-bangladeshi-taka-sign,
+ "bicycle": $fa-var-bicycle,
+ "staff-snake": $fa-var-staff-snake,
+ "rod-asclepius": $fa-var-rod-asclepius,
+ "rod-snake": $fa-var-rod-snake,
+ "staff-aesculapius": $fa-var-staff-aesculapius,
+ "head-side-cough-slash": $fa-var-head-side-cough-slash,
+ "truck-medical": $fa-var-truck-medical,
+ "ambulance": $fa-var-ambulance,
+ "wheat-awn-circle-exclamation": $fa-var-wheat-awn-circle-exclamation,
+ "snowman": $fa-var-snowman,
+ "mortar-pestle": $fa-var-mortar-pestle,
+ "road-barrier": $fa-var-road-barrier,
+ "school": $fa-var-school,
+ "igloo": $fa-var-igloo,
+ "joint": $fa-var-joint,
+ "angle-right": $fa-var-angle-right,
+ "horse": $fa-var-horse,
+ "q": $fa-var-q,
+ "g": $fa-var-g,
+ "notes-medical": $fa-var-notes-medical,
+ "temperature-half": $fa-var-temperature-half,
+ "temperature-2": $fa-var-temperature-2,
+ "thermometer-2": $fa-var-thermometer-2,
+ "thermometer-half": $fa-var-thermometer-half,
+ "dong-sign": $fa-var-dong-sign,
+ "capsules": $fa-var-capsules,
+ "poo-storm": $fa-var-poo-storm,
+ "poo-bolt": $fa-var-poo-bolt,
+ "face-frown-open": $fa-var-face-frown-open,
+ "frown-open": $fa-var-frown-open,
+ "hand-point-up": $fa-var-hand-point-up,
+ "money-bill": $fa-var-money-bill,
+ "bookmark": $fa-var-bookmark,
+ "align-justify": $fa-var-align-justify,
+ "umbrella-beach": $fa-var-umbrella-beach,
+ "helmet-un": $fa-var-helmet-un,
+ "bullseye": $fa-var-bullseye,
+ "bacon": $fa-var-bacon,
+ "hand-point-down": $fa-var-hand-point-down,
+ "arrow-up-from-bracket": $fa-var-arrow-up-from-bracket,
+ "folder": $fa-var-folder,
+ "folder-blank": $fa-var-folder-blank,
+ "file-waveform": $fa-var-file-waveform,
+ "file-medical-alt": $fa-var-file-medical-alt,
+ "radiation": $fa-var-radiation,
+ "chart-simple": $fa-var-chart-simple,
+ "mars-stroke": $fa-var-mars-stroke,
+ "vial": $fa-var-vial,
+ "gauge": $fa-var-gauge,
+ "dashboard": $fa-var-dashboard,
+ "gauge-med": $fa-var-gauge-med,
+ "tachometer-alt-average": $fa-var-tachometer-alt-average,
+ "wand-magic-sparkles": $fa-var-wand-magic-sparkles,
+ "magic-wand-sparkles": $fa-var-magic-wand-sparkles,
+ "e": $fa-var-e,
+ "pen-clip": $fa-var-pen-clip,
+ "pen-alt": $fa-var-pen-alt,
+ "bridge-circle-exclamation": $fa-var-bridge-circle-exclamation,
+ "user": $fa-var-user,
+ "school-circle-check": $fa-var-school-circle-check,
+ "dumpster": $fa-var-dumpster,
+ "van-shuttle": $fa-var-van-shuttle,
+ "shuttle-van": $fa-var-shuttle-van,
+ "building-user": $fa-var-building-user,
+ "square-caret-left": $fa-var-square-caret-left,
+ "caret-square-left": $fa-var-caret-square-left,
+ "highlighter": $fa-var-highlighter,
+ "key": $fa-var-key,
+ "bullhorn": $fa-var-bullhorn,
+ "globe": $fa-var-globe,
+ "synagogue": $fa-var-synagogue,
+ "person-half-dress": $fa-var-person-half-dress,
+ "road-bridge": $fa-var-road-bridge,
+ "location-arrow": $fa-var-location-arrow,
+ "c": $fa-var-c,
+ "tablet-button": $fa-var-tablet-button,
+ "building-lock": $fa-var-building-lock,
+ "pizza-slice": $fa-var-pizza-slice,
+ "money-bill-wave": $fa-var-money-bill-wave,
+ "chart-area": $fa-var-chart-area,
+ "area-chart": $fa-var-area-chart,
+ "house-flag": $fa-var-house-flag,
+ "person-circle-minus": $fa-var-person-circle-minus,
+ "ban": $fa-var-ban,
+ "cancel": $fa-var-cancel,
+ "camera-rotate": $fa-var-camera-rotate,
+ "spray-can-sparkles": $fa-var-spray-can-sparkles,
+ "air-freshener": $fa-var-air-freshener,
+ "star": $fa-var-star,
+ "repeat": $fa-var-repeat,
+ "cross": $fa-var-cross,
+ "box": $fa-var-box,
+ "venus-mars": $fa-var-venus-mars,
+ "arrow-pointer": $fa-var-arrow-pointer,
+ "mouse-pointer": $fa-var-mouse-pointer,
+ "maximize": $fa-var-maximize,
+ "expand-arrows-alt": $fa-var-expand-arrows-alt,
+ "charging-station": $fa-var-charging-station,
+ "shapes": $fa-var-shapes,
+ "triangle-circle-square": $fa-var-triangle-circle-square,
+ "shuffle": $fa-var-shuffle,
+ "random": $fa-var-random,
+ "person-running": $fa-var-person-running,
+ "running": $fa-var-running,
+ "mobile-retro": $fa-var-mobile-retro,
+ "grip-lines-vertical": $fa-var-grip-lines-vertical,
+ "spider": $fa-var-spider,
+ "hands-bound": $fa-var-hands-bound,
+ "file-invoice-dollar": $fa-var-file-invoice-dollar,
+ "plane-circle-exclamation": $fa-var-plane-circle-exclamation,
+ "x-ray": $fa-var-x-ray,
+ "spell-check": $fa-var-spell-check,
+ "slash": $fa-var-slash,
+ "computer-mouse": $fa-var-computer-mouse,
+ "mouse": $fa-var-mouse,
+ "arrow-right-to-bracket": $fa-var-arrow-right-to-bracket,
+ "sign-in": $fa-var-sign-in,
+ "shop-slash": $fa-var-shop-slash,
+ "store-alt-slash": $fa-var-store-alt-slash,
+ "server": $fa-var-server,
+ "virus-covid-slash": $fa-var-virus-covid-slash,
+ "shop-lock": $fa-var-shop-lock,
+ "hourglass-start": $fa-var-hourglass-start,
+ "hourglass-1": $fa-var-hourglass-1,
+ "blender-phone": $fa-var-blender-phone,
+ "building-wheat": $fa-var-building-wheat,
+ "person-breastfeeding": $fa-var-person-breastfeeding,
+ "right-to-bracket": $fa-var-right-to-bracket,
+ "sign-in-alt": $fa-var-sign-in-alt,
+ "venus": $fa-var-venus,
+ "passport": $fa-var-passport,
+ "heart-pulse": $fa-var-heart-pulse,
+ "heartbeat": $fa-var-heartbeat,
+ "people-carry-box": $fa-var-people-carry-box,
+ "people-carry": $fa-var-people-carry,
+ "temperature-high": $fa-var-temperature-high,
+ "microchip": $fa-var-microchip,
+ "crown": $fa-var-crown,
+ "weight-hanging": $fa-var-weight-hanging,
+ "xmarks-lines": $fa-var-xmarks-lines,
+ "file-prescription": $fa-var-file-prescription,
+ "weight-scale": $fa-var-weight-scale,
+ "weight": $fa-var-weight,
+ "user-group": $fa-var-user-group,
+ "user-friends": $fa-var-user-friends,
+ "arrow-up-a-z": $fa-var-arrow-up-a-z,
+ "sort-alpha-up": $fa-var-sort-alpha-up,
+ "chess-knight": $fa-var-chess-knight,
+ "face-laugh-squint": $fa-var-face-laugh-squint,
+ "laugh-squint": $fa-var-laugh-squint,
+ "wheelchair": $fa-var-wheelchair,
+ "circle-arrow-up": $fa-var-circle-arrow-up,
+ "arrow-circle-up": $fa-var-arrow-circle-up,
+ "toggle-on": $fa-var-toggle-on,
+ "person-walking": $fa-var-person-walking,
+ "walking": $fa-var-walking,
+ "l": $fa-var-l,
+ "fire": $fa-var-fire,
+ "bed-pulse": $fa-var-bed-pulse,
+ "procedures": $fa-var-procedures,
+ "shuttle-space": $fa-var-shuttle-space,
+ "space-shuttle": $fa-var-space-shuttle,
+ "face-laugh": $fa-var-face-laugh,
+ "laugh": $fa-var-laugh,
+ "folder-open": $fa-var-folder-open,
+ "heart-circle-plus": $fa-var-heart-circle-plus,
+ "code-fork": $fa-var-code-fork,
+ "city": $fa-var-city,
+ "microphone-lines": $fa-var-microphone-lines,
+ "microphone-alt": $fa-var-microphone-alt,
+ "pepper-hot": $fa-var-pepper-hot,
+ "unlock": $fa-var-unlock,
+ "colon-sign": $fa-var-colon-sign,
+ "headset": $fa-var-headset,
+ "store-slash": $fa-var-store-slash,
+ "road-circle-xmark": $fa-var-road-circle-xmark,
+ "user-minus": $fa-var-user-minus,
+ "mars-stroke-up": $fa-var-mars-stroke-up,
+ "mars-stroke-v": $fa-var-mars-stroke-v,
+ "champagne-glasses": $fa-var-champagne-glasses,
+ "glass-cheers": $fa-var-glass-cheers,
+ "clipboard": $fa-var-clipboard,
+ "house-circle-exclamation": $fa-var-house-circle-exclamation,
+ "file-arrow-up": $fa-var-file-arrow-up,
+ "file-upload": $fa-var-file-upload,
+ "wifi": $fa-var-wifi,
+ "wifi-3": $fa-var-wifi-3,
+ "wifi-strong": $fa-var-wifi-strong,
+ "bath": $fa-var-bath,
+ "bathtub": $fa-var-bathtub,
+ "underline": $fa-var-underline,
+ "user-pen": $fa-var-user-pen,
+ "user-edit": $fa-var-user-edit,
+ "signature": $fa-var-signature,
+ "stroopwafel": $fa-var-stroopwafel,
+ "bold": $fa-var-bold,
+ "anchor-lock": $fa-var-anchor-lock,
+ "building-ngo": $fa-var-building-ngo,
+ "manat-sign": $fa-var-manat-sign,
+ "not-equal": $fa-var-not-equal,
+ "border-top-left": $fa-var-border-top-left,
+ "border-style": $fa-var-border-style,
+ "map-location-dot": $fa-var-map-location-dot,
+ "map-marked-alt": $fa-var-map-marked-alt,
+ "jedi": $fa-var-jedi,
+ "square-poll-vertical": $fa-var-square-poll-vertical,
+ "poll": $fa-var-poll,
+ "mug-hot": $fa-var-mug-hot,
+ "car-battery": $fa-var-car-battery,
+ "battery-car": $fa-var-battery-car,
+ "gift": $fa-var-gift,
+ "dice-two": $fa-var-dice-two,
+ "chess-queen": $fa-var-chess-queen,
+ "glasses": $fa-var-glasses,
+ "chess-board": $fa-var-chess-board,
+ "building-circle-check": $fa-var-building-circle-check,
+ "person-chalkboard": $fa-var-person-chalkboard,
+ "mars-stroke-right": $fa-var-mars-stroke-right,
+ "mars-stroke-h": $fa-var-mars-stroke-h,
+ "hand-back-fist": $fa-var-hand-back-fist,
+ "hand-rock": $fa-var-hand-rock,
+ "square-caret-up": $fa-var-square-caret-up,
+ "caret-square-up": $fa-var-caret-square-up,
+ "cloud-showers-water": $fa-var-cloud-showers-water,
+ "chart-bar": $fa-var-chart-bar,
+ "bar-chart": $fa-var-bar-chart,
+ "hands-bubbles": $fa-var-hands-bubbles,
+ "hands-wash": $fa-var-hands-wash,
+ "less-than-equal": $fa-var-less-than-equal,
+ "train": $fa-var-train,
+ "eye-low-vision": $fa-var-eye-low-vision,
+ "low-vision": $fa-var-low-vision,
+ "crow": $fa-var-crow,
+ "sailboat": $fa-var-sailboat,
+ "window-restore": $fa-var-window-restore,
+ "square-plus": $fa-var-square-plus,
+ "plus-square": $fa-var-plus-square,
+ "torii-gate": $fa-var-torii-gate,
+ "frog": $fa-var-frog,
+ "bucket": $fa-var-bucket,
+ "image": $fa-var-image,
+ "microphone": $fa-var-microphone,
+ "cow": $fa-var-cow,
+ "caret-up": $fa-var-caret-up,
+ "screwdriver": $fa-var-screwdriver,
+ "folder-closed": $fa-var-folder-closed,
+ "house-tsunami": $fa-var-house-tsunami,
+ "square-nfi": $fa-var-square-nfi,
+ "arrow-up-from-ground-water": $fa-var-arrow-up-from-ground-water,
+ "martini-glass": $fa-var-martini-glass,
+ "glass-martini-alt": $fa-var-glass-martini-alt,
+ "rotate-left": $fa-var-rotate-left,
+ "rotate-back": $fa-var-rotate-back,
+ "rotate-backward": $fa-var-rotate-backward,
+ "undo-alt": $fa-var-undo-alt,
+ "table-columns": $fa-var-table-columns,
+ "columns": $fa-var-columns,
+ "lemon": $fa-var-lemon,
+ "head-side-mask": $fa-var-head-side-mask,
+ "handshake": $fa-var-handshake,
+ "gem": $fa-var-gem,
+ "dolly": $fa-var-dolly,
+ "dolly-box": $fa-var-dolly-box,
+ "smoking": $fa-var-smoking,
+ "minimize": $fa-var-minimize,
+ "compress-arrows-alt": $fa-var-compress-arrows-alt,
+ "monument": $fa-var-monument,
+ "snowplow": $fa-var-snowplow,
+ "angles-right": $fa-var-angles-right,
+ "angle-double-right": $fa-var-angle-double-right,
+ "cannabis": $fa-var-cannabis,
+ "circle-play": $fa-var-circle-play,
+ "play-circle": $fa-var-play-circle,
+ "tablets": $fa-var-tablets,
+ "ethernet": $fa-var-ethernet,
+ "euro-sign": $fa-var-euro-sign,
+ "eur": $fa-var-eur,
+ "euro": $fa-var-euro,
+ "chair": $fa-var-chair,
+ "circle-check": $fa-var-circle-check,
+ "check-circle": $fa-var-check-circle,
+ "circle-stop": $fa-var-circle-stop,
+ "stop-circle": $fa-var-stop-circle,
+ "compass-drafting": $fa-var-compass-drafting,
+ "drafting-compass": $fa-var-drafting-compass,
+ "plate-wheat": $fa-var-plate-wheat,
+ "icicles": $fa-var-icicles,
+ "person-shelter": $fa-var-person-shelter,
+ "neuter": $fa-var-neuter,
+ "id-badge": $fa-var-id-badge,
+ "marker": $fa-var-marker,
+ "face-laugh-beam": $fa-var-face-laugh-beam,
+ "laugh-beam": $fa-var-laugh-beam,
+ "helicopter-symbol": $fa-var-helicopter-symbol,
+ "universal-access": $fa-var-universal-access,
+ "circle-chevron-up": $fa-var-circle-chevron-up,
+ "chevron-circle-up": $fa-var-chevron-circle-up,
+ "lari-sign": $fa-var-lari-sign,
+ "volcano": $fa-var-volcano,
+ "person-walking-dashed-line-arrow-right": $fa-var-person-walking-dashed-line-arrow-right,
+ "sterling-sign": $fa-var-sterling-sign,
+ "gbp": $fa-var-gbp,
+ "pound-sign": $fa-var-pound-sign,
+ "viruses": $fa-var-viruses,
+ "square-person-confined": $fa-var-square-person-confined,
+ "user-tie": $fa-var-user-tie,
+ "arrow-down-long": $fa-var-arrow-down-long,
+ "long-arrow-down": $fa-var-long-arrow-down,
+ "tent-arrow-down-to-line": $fa-var-tent-arrow-down-to-line,
+ "certificate": $fa-var-certificate,
+ "reply-all": $fa-var-reply-all,
+ "mail-reply-all": $fa-var-mail-reply-all,
+ "suitcase": $fa-var-suitcase,
+ "person-skating": $fa-var-person-skating,
+ "skating": $fa-var-skating,
+ "filter-circle-dollar": $fa-var-filter-circle-dollar,
+ "funnel-dollar": $fa-var-funnel-dollar,
+ "camera-retro": $fa-var-camera-retro,
+ "circle-arrow-down": $fa-var-circle-arrow-down,
+ "arrow-circle-down": $fa-var-arrow-circle-down,
+ "file-import": $fa-var-file-import,
+ "arrow-right-to-file": $fa-var-arrow-right-to-file,
+ "square-arrow-up-right": $fa-var-square-arrow-up-right,
+ "external-link-square": $fa-var-external-link-square,
+ "box-open": $fa-var-box-open,
+ "scroll": $fa-var-scroll,
+ "spa": $fa-var-spa,
+ "location-pin-lock": $fa-var-location-pin-lock,
+ "pause": $fa-var-pause,
+ "hill-avalanche": $fa-var-hill-avalanche,
+ "temperature-empty": $fa-var-temperature-empty,
+ "temperature-0": $fa-var-temperature-0,
+ "thermometer-0": $fa-var-thermometer-0,
+ "thermometer-empty": $fa-var-thermometer-empty,
+ "bomb": $fa-var-bomb,
+ "registered": $fa-var-registered,
+ "address-card": $fa-var-address-card,
+ "contact-card": $fa-var-contact-card,
+ "vcard": $fa-var-vcard,
+ "scale-unbalanced-flip": $fa-var-scale-unbalanced-flip,
+ "balance-scale-right": $fa-var-balance-scale-right,
+ "subscript": $fa-var-subscript,
+ "diamond-turn-right": $fa-var-diamond-turn-right,
+ "directions": $fa-var-directions,
+ "burst": $fa-var-burst,
+ "house-laptop": $fa-var-house-laptop,
+ "laptop-house": $fa-var-laptop-house,
+ "face-tired": $fa-var-face-tired,
+ "tired": $fa-var-tired,
+ "money-bills": $fa-var-money-bills,
+ "smog": $fa-var-smog,
+ "crutch": $fa-var-crutch,
+ "cloud-arrow-up": $fa-var-cloud-arrow-up,
+ "cloud-upload": $fa-var-cloud-upload,
+ "cloud-upload-alt": $fa-var-cloud-upload-alt,
+ "palette": $fa-var-palette,
+ "arrows-turn-right": $fa-var-arrows-turn-right,
+ "vest": $fa-var-vest,
+ "ferry": $fa-var-ferry,
+ "arrows-down-to-people": $fa-var-arrows-down-to-people,
+ "seedling": $fa-var-seedling,
+ "sprout": $fa-var-sprout,
+ "left-right": $fa-var-left-right,
+ "arrows-alt-h": $fa-var-arrows-alt-h,
+ "boxes-packing": $fa-var-boxes-packing,
+ "circle-arrow-left": $fa-var-circle-arrow-left,
+ "arrow-circle-left": $fa-var-arrow-circle-left,
+ "group-arrows-rotate": $fa-var-group-arrows-rotate,
+ "bowl-food": $fa-var-bowl-food,
+ "candy-cane": $fa-var-candy-cane,
+ "arrow-down-wide-short": $fa-var-arrow-down-wide-short,
+ "sort-amount-asc": $fa-var-sort-amount-asc,
+ "sort-amount-down": $fa-var-sort-amount-down,
+ "cloud-bolt": $fa-var-cloud-bolt,
+ "thunderstorm": $fa-var-thunderstorm,
+ "text-slash": $fa-var-text-slash,
+ "remove-format": $fa-var-remove-format,
+ "face-smile-wink": $fa-var-face-smile-wink,
+ "smile-wink": $fa-var-smile-wink,
+ "file-word": $fa-var-file-word,
+ "file-powerpoint": $fa-var-file-powerpoint,
+ "arrows-left-right": $fa-var-arrows-left-right,
+ "arrows-h": $fa-var-arrows-h,
+ "house-lock": $fa-var-house-lock,
+ "cloud-arrow-down": $fa-var-cloud-arrow-down,
+ "cloud-download": $fa-var-cloud-download,
+ "cloud-download-alt": $fa-var-cloud-download-alt,
+ "children": $fa-var-children,
+ "chalkboard": $fa-var-chalkboard,
+ "blackboard": $fa-var-blackboard,
+ "user-large-slash": $fa-var-user-large-slash,
+ "user-alt-slash": $fa-var-user-alt-slash,
+ "envelope-open": $fa-var-envelope-open,
+ "handshake-simple-slash": $fa-var-handshake-simple-slash,
+ "handshake-alt-slash": $fa-var-handshake-alt-slash,
+ "mattress-pillow": $fa-var-mattress-pillow,
+ "guarani-sign": $fa-var-guarani-sign,
+ "arrows-rotate": $fa-var-arrows-rotate,
+ "refresh": $fa-var-refresh,
+ "sync": $fa-var-sync,
+ "fire-extinguisher": $fa-var-fire-extinguisher,
+ "cruzeiro-sign": $fa-var-cruzeiro-sign,
+ "greater-than-equal": $fa-var-greater-than-equal,
+ "shield-halved": $fa-var-shield-halved,
+ "shield-alt": $fa-var-shield-alt,
+ "book-atlas": $fa-var-book-atlas,
+ "atlas": $fa-var-atlas,
+ "virus": $fa-var-virus,
+ "envelope-circle-check": $fa-var-envelope-circle-check,
+ "layer-group": $fa-var-layer-group,
+ "arrows-to-dot": $fa-var-arrows-to-dot,
+ "archway": $fa-var-archway,
+ "heart-circle-check": $fa-var-heart-circle-check,
+ "house-chimney-crack": $fa-var-house-chimney-crack,
+ "house-damage": $fa-var-house-damage,
+ "file-zipper": $fa-var-file-zipper,
+ "file-archive": $fa-var-file-archive,
+ "square": $fa-var-square,
+ "martini-glass-empty": $fa-var-martini-glass-empty,
+ "glass-martini": $fa-var-glass-martini,
+ "couch": $fa-var-couch,
+ "cedi-sign": $fa-var-cedi-sign,
+ "italic": $fa-var-italic,
+ "church": $fa-var-church,
+ "comments-dollar": $fa-var-comments-dollar,
+ "democrat": $fa-var-democrat,
+ "z": $fa-var-z,
+ "person-skiing": $fa-var-person-skiing,
+ "skiing": $fa-var-skiing,
+ "road-lock": $fa-var-road-lock,
+ "a": $fa-var-a,
+ "temperature-arrow-down": $fa-var-temperature-arrow-down,
+ "temperature-down": $fa-var-temperature-down,
+ "feather-pointed": $fa-var-feather-pointed,
+ "feather-alt": $fa-var-feather-alt,
+ "p": $fa-var-p,
+ "snowflake": $fa-var-snowflake,
+ "newspaper": $fa-var-newspaper,
+ "rectangle-ad": $fa-var-rectangle-ad,
+ "ad": $fa-var-ad,
+ "circle-arrow-right": $fa-var-circle-arrow-right,
+ "arrow-circle-right": $fa-var-arrow-circle-right,
+ "filter-circle-xmark": $fa-var-filter-circle-xmark,
+ "locust": $fa-var-locust,
+ "sort": $fa-var-sort,
+ "unsorted": $fa-var-unsorted,
+ "list-ol": $fa-var-list-ol,
+ "list-1-2": $fa-var-list-1-2,
+ "list-numeric": $fa-var-list-numeric,
+ "person-dress-burst": $fa-var-person-dress-burst,
+ "money-check-dollar": $fa-var-money-check-dollar,
+ "money-check-alt": $fa-var-money-check-alt,
+ "vector-square": $fa-var-vector-square,
+ "bread-slice": $fa-var-bread-slice,
+ "language": $fa-var-language,
+ "face-kiss-wink-heart": $fa-var-face-kiss-wink-heart,
+ "kiss-wink-heart": $fa-var-kiss-wink-heart,
+ "filter": $fa-var-filter,
+ "question": $fa-var-question,
+ "file-signature": $fa-var-file-signature,
+ "up-down-left-right": $fa-var-up-down-left-right,
+ "arrows-alt": $fa-var-arrows-alt,
+ "house-chimney-user": $fa-var-house-chimney-user,
+ "hand-holding-heart": $fa-var-hand-holding-heart,
+ "puzzle-piece": $fa-var-puzzle-piece,
+ "money-check": $fa-var-money-check,
+ "star-half-stroke": $fa-var-star-half-stroke,
+ "star-half-alt": $fa-var-star-half-alt,
+ "code": $fa-var-code,
+ "whiskey-glass": $fa-var-whiskey-glass,
+ "glass-whiskey": $fa-var-glass-whiskey,
+ "building-circle-exclamation": $fa-var-building-circle-exclamation,
+ "magnifying-glass-chart": $fa-var-magnifying-glass-chart,
+ "arrow-up-right-from-square": $fa-var-arrow-up-right-from-square,
+ "external-link": $fa-var-external-link,
+ "cubes-stacked": $fa-var-cubes-stacked,
+ "won-sign": $fa-var-won-sign,
+ "krw": $fa-var-krw,
+ "won": $fa-var-won,
+ "virus-covid": $fa-var-virus-covid,
+ "austral-sign": $fa-var-austral-sign,
+ "f": $fa-var-f,
+ "leaf": $fa-var-leaf,
+ "road": $fa-var-road,
+ "taxi": $fa-var-taxi,
+ "cab": $fa-var-cab,
+ "person-circle-plus": $fa-var-person-circle-plus,
+ "chart-pie": $fa-var-chart-pie,
+ "pie-chart": $fa-var-pie-chart,
+ "bolt-lightning": $fa-var-bolt-lightning,
+ "sack-xmark": $fa-var-sack-xmark,
+ "file-excel": $fa-var-file-excel,
+ "file-contract": $fa-var-file-contract,
+ "fish-fins": $fa-var-fish-fins,
+ "building-flag": $fa-var-building-flag,
+ "face-grin-beam": $fa-var-face-grin-beam,
+ "grin-beam": $fa-var-grin-beam,
+ "object-ungroup": $fa-var-object-ungroup,
+ "poop": $fa-var-poop,
+ "location-pin": $fa-var-location-pin,
+ "map-marker": $fa-var-map-marker,
+ "kaaba": $fa-var-kaaba,
+ "toilet-paper": $fa-var-toilet-paper,
+ "helmet-safety": $fa-var-helmet-safety,
+ "hard-hat": $fa-var-hard-hat,
+ "hat-hard": $fa-var-hat-hard,
+ "eject": $fa-var-eject,
+ "circle-right": $fa-var-circle-right,
+ "arrow-alt-circle-right": $fa-var-arrow-alt-circle-right,
+ "plane-circle-check": $fa-var-plane-circle-check,
+ "face-rolling-eyes": $fa-var-face-rolling-eyes,
+ "meh-rolling-eyes": $fa-var-meh-rolling-eyes,
+ "object-group": $fa-var-object-group,
+ "chart-line": $fa-var-chart-line,
+ "line-chart": $fa-var-line-chart,
+ "mask-ventilator": $fa-var-mask-ventilator,
+ "arrow-right": $fa-var-arrow-right,
+ "signs-post": $fa-var-signs-post,
+ "map-signs": $fa-var-map-signs,
+ "cash-register": $fa-var-cash-register,
+ "person-circle-question": $fa-var-person-circle-question,
+ "h": $fa-var-h,
+ "tarp": $fa-var-tarp,
+ "screwdriver-wrench": $fa-var-screwdriver-wrench,
+ "tools": $fa-var-tools,
+ "arrows-to-eye": $fa-var-arrows-to-eye,
+ "plug-circle-bolt": $fa-var-plug-circle-bolt,
+ "heart": $fa-var-heart,
+ "mars-and-venus": $fa-var-mars-and-venus,
+ "house-user": $fa-var-house-user,
+ "home-user": $fa-var-home-user,
+ "dumpster-fire": $fa-var-dumpster-fire,
+ "house-crack": $fa-var-house-crack,
+ "martini-glass-citrus": $fa-var-martini-glass-citrus,
+ "cocktail": $fa-var-cocktail,
+ "face-surprise": $fa-var-face-surprise,
+ "surprise": $fa-var-surprise,
+ "bottle-water": $fa-var-bottle-water,
+ "circle-pause": $fa-var-circle-pause,
+ "pause-circle": $fa-var-pause-circle,
+ "toilet-paper-slash": $fa-var-toilet-paper-slash,
+ "apple-whole": $fa-var-apple-whole,
+ "apple-alt": $fa-var-apple-alt,
+ "kitchen-set": $fa-var-kitchen-set,
+ "r": $fa-var-r,
+ "temperature-quarter": $fa-var-temperature-quarter,
+ "temperature-1": $fa-var-temperature-1,
+ "thermometer-1": $fa-var-thermometer-1,
+ "thermometer-quarter": $fa-var-thermometer-quarter,
+ "cube": $fa-var-cube,
+ "bitcoin-sign": $fa-var-bitcoin-sign,
+ "shield-dog": $fa-var-shield-dog,
+ "solar-panel": $fa-var-solar-panel,
+ "lock-open": $fa-var-lock-open,
+ "elevator": $fa-var-elevator,
+ "money-bill-transfer": $fa-var-money-bill-transfer,
+ "money-bill-trend-up": $fa-var-money-bill-trend-up,
+ "house-flood-water-circle-arrow-right": $fa-var-house-flood-water-circle-arrow-right,
+ "square-poll-horizontal": $fa-var-square-poll-horizontal,
+ "poll-h": $fa-var-poll-h,
+ "circle": $fa-var-circle,
+ "backward-fast": $fa-var-backward-fast,
+ "fast-backward": $fa-var-fast-backward,
+ "recycle": $fa-var-recycle,
+ "user-astronaut": $fa-var-user-astronaut,
+ "plane-slash": $fa-var-plane-slash,
+ "trademark": $fa-var-trademark,
+ "basketball": $fa-var-basketball,
+ "basketball-ball": $fa-var-basketball-ball,
+ "satellite-dish": $fa-var-satellite-dish,
+ "circle-up": $fa-var-circle-up,
+ "arrow-alt-circle-up": $fa-var-arrow-alt-circle-up,
+ "mobile-screen-button": $fa-var-mobile-screen-button,
+ "mobile-alt": $fa-var-mobile-alt,
+ "volume-high": $fa-var-volume-high,
+ "volume-up": $fa-var-volume-up,
+ "users-rays": $fa-var-users-rays,
+ "wallet": $fa-var-wallet,
+ "clipboard-check": $fa-var-clipboard-check,
+ "file-audio": $fa-var-file-audio,
+ "burger": $fa-var-burger,
+ "hamburger": $fa-var-hamburger,
+ "wrench": $fa-var-wrench,
+ "bugs": $fa-var-bugs,
+ "rupee-sign": $fa-var-rupee-sign,
+ "rupee": $fa-var-rupee,
+ "file-image": $fa-var-file-image,
+ "circle-question": $fa-var-circle-question,
+ "question-circle": $fa-var-question-circle,
+ "plane-departure": $fa-var-plane-departure,
+ "handshake-slash": $fa-var-handshake-slash,
+ "book-bookmark": $fa-var-book-bookmark,
+ "code-branch": $fa-var-code-branch,
+ "hat-cowboy": $fa-var-hat-cowboy,
+ "bridge": $fa-var-bridge,
+ "phone-flip": $fa-var-phone-flip,
+ "phone-alt": $fa-var-phone-alt,
+ "truck-front": $fa-var-truck-front,
+ "cat": $fa-var-cat,
+ "anchor-circle-exclamation": $fa-var-anchor-circle-exclamation,
+ "truck-field": $fa-var-truck-field,
+ "route": $fa-var-route,
+ "clipboard-question": $fa-var-clipboard-question,
+ "panorama": $fa-var-panorama,
+ "comment-medical": $fa-var-comment-medical,
+ "teeth-open": $fa-var-teeth-open,
+ "file-circle-minus": $fa-var-file-circle-minus,
+ "tags": $fa-var-tags,
+ "wine-glass": $fa-var-wine-glass,
+ "forward-fast": $fa-var-forward-fast,
+ "fast-forward": $fa-var-fast-forward,
+ "face-meh-blank": $fa-var-face-meh-blank,
+ "meh-blank": $fa-var-meh-blank,
+ "square-parking": $fa-var-square-parking,
+ "parking": $fa-var-parking,
+ "house-signal": $fa-var-house-signal,
+ "bars-progress": $fa-var-bars-progress,
+ "tasks-alt": $fa-var-tasks-alt,
+ "faucet-drip": $fa-var-faucet-drip,
+ "cart-flatbed": $fa-var-cart-flatbed,
+ "dolly-flatbed": $fa-var-dolly-flatbed,
+ "ban-smoking": $fa-var-ban-smoking,
+ "smoking-ban": $fa-var-smoking-ban,
+ "terminal": $fa-var-terminal,
+ "mobile-button": $fa-var-mobile-button,
+ "house-medical-flag": $fa-var-house-medical-flag,
+ "basket-shopping": $fa-var-basket-shopping,
+ "shopping-basket": $fa-var-shopping-basket,
+ "tape": $fa-var-tape,
+ "bus-simple": $fa-var-bus-simple,
+ "bus-alt": $fa-var-bus-alt,
+ "eye": $fa-var-eye,
+ "face-sad-cry": $fa-var-face-sad-cry,
+ "sad-cry": $fa-var-sad-cry,
+ "audio-description": $fa-var-audio-description,
+ "person-military-to-person": $fa-var-person-military-to-person,
+ "file-shield": $fa-var-file-shield,
+ "user-slash": $fa-var-user-slash,
+ "pen": $fa-var-pen,
+ "tower-observation": $fa-var-tower-observation,
+ "file-code": $fa-var-file-code,
+ "signal": $fa-var-signal,
+ "signal-5": $fa-var-signal-5,
+ "signal-perfect": $fa-var-signal-perfect,
+ "bus": $fa-var-bus,
+ "heart-circle-xmark": $fa-var-heart-circle-xmark,
+ "house-chimney": $fa-var-house-chimney,
+ "home-lg": $fa-var-home-lg,
+ "window-maximize": $fa-var-window-maximize,
+ "face-frown": $fa-var-face-frown,
+ "frown": $fa-var-frown,
+ "prescription": $fa-var-prescription,
+ "shop": $fa-var-shop,
+ "store-alt": $fa-var-store-alt,
+ "floppy-disk": $fa-var-floppy-disk,
+ "save": $fa-var-save,
+ "vihara": $fa-var-vihara,
+ "scale-unbalanced": $fa-var-scale-unbalanced,
+ "balance-scale-left": $fa-var-balance-scale-left,
+ "sort-up": $fa-var-sort-up,
+ "sort-asc": $fa-var-sort-asc,
+ "comment-dots": $fa-var-comment-dots,
+ "commenting": $fa-var-commenting,
+ "plant-wilt": $fa-var-plant-wilt,
+ "diamond": $fa-var-diamond,
+ "face-grin-squint": $fa-var-face-grin-squint,
+ "grin-squint": $fa-var-grin-squint,
+ "hand-holding-dollar": $fa-var-hand-holding-dollar,
+ "hand-holding-usd": $fa-var-hand-holding-usd,
+ "bacterium": $fa-var-bacterium,
+ "hand-pointer": $fa-var-hand-pointer,
+ "drum-steelpan": $fa-var-drum-steelpan,
+ "hand-scissors": $fa-var-hand-scissors,
+ "hands-praying": $fa-var-hands-praying,
+ "praying-hands": $fa-var-praying-hands,
+ "arrow-rotate-right": $fa-var-arrow-rotate-right,
+ "arrow-right-rotate": $fa-var-arrow-right-rotate,
+ "arrow-rotate-forward": $fa-var-arrow-rotate-forward,
+ "redo": $fa-var-redo,
+ "biohazard": $fa-var-biohazard,
+ "location-crosshairs": $fa-var-location-crosshairs,
+ "location": $fa-var-location,
+ "mars-double": $fa-var-mars-double,
+ "child-dress": $fa-var-child-dress,
+ "users-between-lines": $fa-var-users-between-lines,
+ "lungs-virus": $fa-var-lungs-virus,
+ "face-grin-tears": $fa-var-face-grin-tears,
+ "grin-tears": $fa-var-grin-tears,
+ "phone": $fa-var-phone,
+ "calendar-xmark": $fa-var-calendar-xmark,
+ "calendar-times": $fa-var-calendar-times,
+ "child-reaching": $fa-var-child-reaching,
+ "head-side-virus": $fa-var-head-side-virus,
+ "user-gear": $fa-var-user-gear,
+ "user-cog": $fa-var-user-cog,
+ "arrow-up-1-9": $fa-var-arrow-up-1-9,
+ "sort-numeric-up": $fa-var-sort-numeric-up,
+ "door-closed": $fa-var-door-closed,
+ "shield-virus": $fa-var-shield-virus,
+ "dice-six": $fa-var-dice-six,
+ "mosquito-net": $fa-var-mosquito-net,
+ "bridge-water": $fa-var-bridge-water,
+ "person-booth": $fa-var-person-booth,
+ "text-width": $fa-var-text-width,
+ "hat-wizard": $fa-var-hat-wizard,
+ "pen-fancy": $fa-var-pen-fancy,
+ "person-digging": $fa-var-person-digging,
+ "digging": $fa-var-digging,
+ "trash": $fa-var-trash,
+ "gauge-simple": $fa-var-gauge-simple,
+ "gauge-simple-med": $fa-var-gauge-simple-med,
+ "tachometer-average": $fa-var-tachometer-average,
+ "book-medical": $fa-var-book-medical,
+ "poo": $fa-var-poo,
+ "quote-right": $fa-var-quote-right,
+ "quote-right-alt": $fa-var-quote-right-alt,
+ "shirt": $fa-var-shirt,
+ "t-shirt": $fa-var-t-shirt,
+ "tshirt": $fa-var-tshirt,
+ "cubes": $fa-var-cubes,
+ "divide": $fa-var-divide,
+ "tenge-sign": $fa-var-tenge-sign,
+ "tenge": $fa-var-tenge,
+ "headphones": $fa-var-headphones,
+ "hands-holding": $fa-var-hands-holding,
+ "hands-clapping": $fa-var-hands-clapping,
+ "republican": $fa-var-republican,
+ "arrow-left": $fa-var-arrow-left,
+ "person-circle-xmark": $fa-var-person-circle-xmark,
+ "ruler": $fa-var-ruler,
+ "align-left": $fa-var-align-left,
+ "dice-d6": $fa-var-dice-d6,
+ "restroom": $fa-var-restroom,
+ "j": $fa-var-j,
+ "users-viewfinder": $fa-var-users-viewfinder,
+ "file-video": $fa-var-file-video,
+ "up-right-from-square": $fa-var-up-right-from-square,
+ "external-link-alt": $fa-var-external-link-alt,
+ "table-cells": $fa-var-table-cells,
+ "th": $fa-var-th,
+ "file-pdf": $fa-var-file-pdf,
+ "book-bible": $fa-var-book-bible,
+ "bible": $fa-var-bible,
+ "o": $fa-var-o,
+ "suitcase-medical": $fa-var-suitcase-medical,
+ "medkit": $fa-var-medkit,
+ "user-secret": $fa-var-user-secret,
+ "otter": $fa-var-otter,
+ "person-dress": $fa-var-person-dress,
+ "female": $fa-var-female,
+ "comment-dollar": $fa-var-comment-dollar,
+ "business-time": $fa-var-business-time,
+ "briefcase-clock": $fa-var-briefcase-clock,
+ "table-cells-large": $fa-var-table-cells-large,
+ "th-large": $fa-var-th-large,
+ "book-tanakh": $fa-var-book-tanakh,
+ "tanakh": $fa-var-tanakh,
+ "phone-volume": $fa-var-phone-volume,
+ "volume-control-phone": $fa-var-volume-control-phone,
+ "hat-cowboy-side": $fa-var-hat-cowboy-side,
+ "clipboard-user": $fa-var-clipboard-user,
+ "child": $fa-var-child,
+ "lira-sign": $fa-var-lira-sign,
+ "satellite": $fa-var-satellite,
+ "plane-lock": $fa-var-plane-lock,
+ "tag": $fa-var-tag,
+ "comment": $fa-var-comment,
+ "cake-candles": $fa-var-cake-candles,
+ "birthday-cake": $fa-var-birthday-cake,
+ "cake": $fa-var-cake,
+ "envelope": $fa-var-envelope,
+ "angles-up": $fa-var-angles-up,
+ "angle-double-up": $fa-var-angle-double-up,
+ "paperclip": $fa-var-paperclip,
+ "arrow-right-to-city": $fa-var-arrow-right-to-city,
+ "ribbon": $fa-var-ribbon,
+ "lungs": $fa-var-lungs,
+ "arrow-up-9-1": $fa-var-arrow-up-9-1,
+ "sort-numeric-up-alt": $fa-var-sort-numeric-up-alt,
+ "litecoin-sign": $fa-var-litecoin-sign,
+ "border-none": $fa-var-border-none,
+ "circle-nodes": $fa-var-circle-nodes,
+ "parachute-box": $fa-var-parachute-box,
+ "indent": $fa-var-indent,
+ "truck-field-un": $fa-var-truck-field-un,
+ "hourglass": $fa-var-hourglass,
+ "hourglass-empty": $fa-var-hourglass-empty,
+ "mountain": $fa-var-mountain,
+ "user-doctor": $fa-var-user-doctor,
+ "user-md": $fa-var-user-md,
+ "circle-info": $fa-var-circle-info,
+ "info-circle": $fa-var-info-circle,
+ "cloud-meatball": $fa-var-cloud-meatball,
+ "camera": $fa-var-camera,
+ "camera-alt": $fa-var-camera-alt,
+ "square-virus": $fa-var-square-virus,
+ "meteor": $fa-var-meteor,
+ "car-on": $fa-var-car-on,
+ "sleigh": $fa-var-sleigh,
+ "arrow-down-1-9": $fa-var-arrow-down-1-9,
+ "sort-numeric-asc": $fa-var-sort-numeric-asc,
+ "sort-numeric-down": $fa-var-sort-numeric-down,
+ "hand-holding-droplet": $fa-var-hand-holding-droplet,
+ "hand-holding-water": $fa-var-hand-holding-water,
+ "water": $fa-var-water,
+ "calendar-check": $fa-var-calendar-check,
+ "braille": $fa-var-braille,
+ "prescription-bottle-medical": $fa-var-prescription-bottle-medical,
+ "prescription-bottle-alt": $fa-var-prescription-bottle-alt,
+ "landmark": $fa-var-landmark,
+ "truck": $fa-var-truck,
+ "crosshairs": $fa-var-crosshairs,
+ "person-cane": $fa-var-person-cane,
+ "tent": $fa-var-tent,
+ "vest-patches": $fa-var-vest-patches,
+ "check-double": $fa-var-check-double,
+ "arrow-down-a-z": $fa-var-arrow-down-a-z,
+ "sort-alpha-asc": $fa-var-sort-alpha-asc,
+ "sort-alpha-down": $fa-var-sort-alpha-down,
+ "money-bill-wheat": $fa-var-money-bill-wheat,
+ "cookie": $fa-var-cookie,
+ "arrow-rotate-left": $fa-var-arrow-rotate-left,
+ "arrow-left-rotate": $fa-var-arrow-left-rotate,
+ "arrow-rotate-back": $fa-var-arrow-rotate-back,
+ "arrow-rotate-backward": $fa-var-arrow-rotate-backward,
+ "undo": $fa-var-undo,
+ "hard-drive": $fa-var-hard-drive,
+ "hdd": $fa-var-hdd,
+ "face-grin-squint-tears": $fa-var-face-grin-squint-tears,
+ "grin-squint-tears": $fa-var-grin-squint-tears,
+ "dumbbell": $fa-var-dumbbell,
+ "rectangle-list": $fa-var-rectangle-list,
+ "list-alt": $fa-var-list-alt,
+ "tarp-droplet": $fa-var-tarp-droplet,
+ "house-medical-circle-check": $fa-var-house-medical-circle-check,
+ "person-skiing-nordic": $fa-var-person-skiing-nordic,
+ "skiing-nordic": $fa-var-skiing-nordic,
+ "calendar-plus": $fa-var-calendar-plus,
+ "plane-arrival": $fa-var-plane-arrival,
+ "circle-left": $fa-var-circle-left,
+ "arrow-alt-circle-left": $fa-var-arrow-alt-circle-left,
+ "train-subway": $fa-var-train-subway,
+ "subway": $fa-var-subway,
+ "chart-gantt": $fa-var-chart-gantt,
+ "indian-rupee-sign": $fa-var-indian-rupee-sign,
+ "indian-rupee": $fa-var-indian-rupee,
+ "inr": $fa-var-inr,
+ "crop-simple": $fa-var-crop-simple,
+ "crop-alt": $fa-var-crop-alt,
+ "money-bill-1": $fa-var-money-bill-1,
+ "money-bill-alt": $fa-var-money-bill-alt,
+ "left-long": $fa-var-left-long,
+ "long-arrow-alt-left": $fa-var-long-arrow-alt-left,
+ "dna": $fa-var-dna,
+ "virus-slash": $fa-var-virus-slash,
+ "minus": $fa-var-minus,
+ "subtract": $fa-var-subtract,
+ "chess": $fa-var-chess,
+ "arrow-left-long": $fa-var-arrow-left-long,
+ "long-arrow-left": $fa-var-long-arrow-left,
+ "plug-circle-check": $fa-var-plug-circle-check,
+ "street-view": $fa-var-street-view,
+ "franc-sign": $fa-var-franc-sign,
+ "volume-off": $fa-var-volume-off,
+ "hands-asl-interpreting": $fa-var-hands-asl-interpreting,
+ "american-sign-language-interpreting": $fa-var-american-sign-language-interpreting,
+ "asl-interpreting": $fa-var-asl-interpreting,
+ "hands-american-sign-language-interpreting": $fa-var-hands-american-sign-language-interpreting,
+ "gear": $fa-var-gear,
+ "cog": $fa-var-cog,
+ "droplet-slash": $fa-var-droplet-slash,
+ "tint-slash": $fa-var-tint-slash,
+ "mosque": $fa-var-mosque,
+ "mosquito": $fa-var-mosquito,
+ "star-of-david": $fa-var-star-of-david,
+ "person-military-rifle": $fa-var-person-military-rifle,
+ "cart-shopping": $fa-var-cart-shopping,
+ "shopping-cart": $fa-var-shopping-cart,
+ "vials": $fa-var-vials,
+ "plug-circle-plus": $fa-var-plug-circle-plus,
+ "place-of-worship": $fa-var-place-of-worship,
+ "grip-vertical": $fa-var-grip-vertical,
+ "arrow-turn-up": $fa-var-arrow-turn-up,
+ "level-up": $fa-var-level-up,
+ "u": $fa-var-u,
+ "square-root-variable": $fa-var-square-root-variable,
+ "square-root-alt": $fa-var-square-root-alt,
+ "clock": $fa-var-clock,
+ "clock-four": $fa-var-clock-four,
+ "backward-step": $fa-var-backward-step,
+ "step-backward": $fa-var-step-backward,
+ "pallet": $fa-var-pallet,
+ "faucet": $fa-var-faucet,
+ "baseball-bat-ball": $fa-var-baseball-bat-ball,
+ "s": $fa-var-s,
+ "timeline": $fa-var-timeline,
+ "keyboard": $fa-var-keyboard,
+ "caret-down": $fa-var-caret-down,
+ "house-chimney-medical": $fa-var-house-chimney-medical,
+ "clinic-medical": $fa-var-clinic-medical,
+ "temperature-three-quarters": $fa-var-temperature-three-quarters,
+ "temperature-3": $fa-var-temperature-3,
+ "thermometer-3": $fa-var-thermometer-3,
+ "thermometer-three-quarters": $fa-var-thermometer-three-quarters,
+ "mobile-screen": $fa-var-mobile-screen,
+ "mobile-android-alt": $fa-var-mobile-android-alt,
+ "plane-up": $fa-var-plane-up,
+ "piggy-bank": $fa-var-piggy-bank,
+ "battery-half": $fa-var-battery-half,
+ "battery-3": $fa-var-battery-3,
+ "mountain-city": $fa-var-mountain-city,
+ "coins": $fa-var-coins,
+ "khanda": $fa-var-khanda,
+ "sliders": $fa-var-sliders,
+ "sliders-h": $fa-var-sliders-h,
+ "folder-tree": $fa-var-folder-tree,
+ "network-wired": $fa-var-network-wired,
+ "map-pin": $fa-var-map-pin,
+ "hamsa": $fa-var-hamsa,
+ "cent-sign": $fa-var-cent-sign,
+ "flask": $fa-var-flask,
+ "person-pregnant": $fa-var-person-pregnant,
+ "wand-sparkles": $fa-var-wand-sparkles,
+ "ellipsis-vertical": $fa-var-ellipsis-vertical,
+ "ellipsis-v": $fa-var-ellipsis-v,
+ "ticket": $fa-var-ticket,
+ "power-off": $fa-var-power-off,
+ "right-long": $fa-var-right-long,
+ "long-arrow-alt-right": $fa-var-long-arrow-alt-right,
+ "flag-usa": $fa-var-flag-usa,
+ "laptop-file": $fa-var-laptop-file,
+ "tty": $fa-var-tty,
+ "teletype": $fa-var-teletype,
+ "diagram-next": $fa-var-diagram-next,
+ "person-rifle": $fa-var-person-rifle,
+ "house-medical-circle-exclamation": $fa-var-house-medical-circle-exclamation,
+ "closed-captioning": $fa-var-closed-captioning,
+ "person-hiking": $fa-var-person-hiking,
+ "hiking": $fa-var-hiking,
+ "venus-double": $fa-var-venus-double,
+ "images": $fa-var-images,
+ "calculator": $fa-var-calculator,
+ "people-pulling": $fa-var-people-pulling,
+ "n": $fa-var-n,
+ "cable-car": $fa-var-cable-car,
+ "tram": $fa-var-tram,
+ "cloud-rain": $fa-var-cloud-rain,
+ "building-circle-xmark": $fa-var-building-circle-xmark,
+ "ship": $fa-var-ship,
+ "arrows-down-to-line": $fa-var-arrows-down-to-line,
+ "download": $fa-var-download,
+ "face-grin": $fa-var-face-grin,
+ "grin": $fa-var-grin,
+ "delete-left": $fa-var-delete-left,
+ "backspace": $fa-var-backspace,
+ "eye-dropper": $fa-var-eye-dropper,
+ "eye-dropper-empty": $fa-var-eye-dropper-empty,
+ "eyedropper": $fa-var-eyedropper,
+ "file-circle-check": $fa-var-file-circle-check,
+ "forward": $fa-var-forward,
+ "mobile": $fa-var-mobile,
+ "mobile-android": $fa-var-mobile-android,
+ "mobile-phone": $fa-var-mobile-phone,
+ "face-meh": $fa-var-face-meh,
+ "meh": $fa-var-meh,
+ "align-center": $fa-var-align-center,
+ "book-skull": $fa-var-book-skull,
+ "book-dead": $fa-var-book-dead,
+ "id-card": $fa-var-id-card,
+ "drivers-license": $fa-var-drivers-license,
+ "outdent": $fa-var-outdent,
+ "dedent": $fa-var-dedent,
+ "heart-circle-exclamation": $fa-var-heart-circle-exclamation,
+ "house": $fa-var-house,
+ "home": $fa-var-home,
+ "home-alt": $fa-var-home-alt,
+ "home-lg-alt": $fa-var-home-lg-alt,
+ "calendar-week": $fa-var-calendar-week,
+ "laptop-medical": $fa-var-laptop-medical,
+ "b": $fa-var-b,
+ "file-medical": $fa-var-file-medical,
+ "dice-one": $fa-var-dice-one,
+ "kiwi-bird": $fa-var-kiwi-bird,
+ "arrow-right-arrow-left": $fa-var-arrow-right-arrow-left,
+ "exchange": $fa-var-exchange,
+ "rotate-right": $fa-var-rotate-right,
+ "redo-alt": $fa-var-redo-alt,
+ "rotate-forward": $fa-var-rotate-forward,
+ "utensils": $fa-var-utensils,
+ "cutlery": $fa-var-cutlery,
+ "arrow-up-wide-short": $fa-var-arrow-up-wide-short,
+ "sort-amount-up": $fa-var-sort-amount-up,
+ "mill-sign": $fa-var-mill-sign,
+ "bowl-rice": $fa-var-bowl-rice,
+ "skull": $fa-var-skull,
+ "tower-broadcast": $fa-var-tower-broadcast,
+ "broadcast-tower": $fa-var-broadcast-tower,
+ "truck-pickup": $fa-var-truck-pickup,
+ "up-long": $fa-var-up-long,
+ "long-arrow-alt-up": $fa-var-long-arrow-alt-up,
+ "stop": $fa-var-stop,
+ "code-merge": $fa-var-code-merge,
+ "upload": $fa-var-upload,
+ "hurricane": $fa-var-hurricane,
+ "mound": $fa-var-mound,
+ "toilet-portable": $fa-var-toilet-portable,
+ "compact-disc": $fa-var-compact-disc,
+ "file-arrow-down": $fa-var-file-arrow-down,
+ "file-download": $fa-var-file-download,
+ "caravan": $fa-var-caravan,
+ "shield-cat": $fa-var-shield-cat,
+ "bolt": $fa-var-bolt,
+ "zap": $fa-var-zap,
+ "glass-water": $fa-var-glass-water,
+ "oil-well": $fa-var-oil-well,
+ "vault": $fa-var-vault,
+ "mars": $fa-var-mars,
+ "toilet": $fa-var-toilet,
+ "plane-circle-xmark": $fa-var-plane-circle-xmark,
+ "yen-sign": $fa-var-yen-sign,
+ "cny": $fa-var-cny,
+ "jpy": $fa-var-jpy,
+ "rmb": $fa-var-rmb,
+ "yen": $fa-var-yen,
+ "ruble-sign": $fa-var-ruble-sign,
+ "rouble": $fa-var-rouble,
+ "rub": $fa-var-rub,
+ "ruble": $fa-var-ruble,
+ "sun": $fa-var-sun,
+ "guitar": $fa-var-guitar,
+ "face-laugh-wink": $fa-var-face-laugh-wink,
+ "laugh-wink": $fa-var-laugh-wink,
+ "horse-head": $fa-var-horse-head,
+ "bore-hole": $fa-var-bore-hole,
+ "industry": $fa-var-industry,
+ "circle-down": $fa-var-circle-down,
+ "arrow-alt-circle-down": $fa-var-arrow-alt-circle-down,
+ "arrows-turn-to-dots": $fa-var-arrows-turn-to-dots,
+ "florin-sign": $fa-var-florin-sign,
+ "arrow-down-short-wide": $fa-var-arrow-down-short-wide,
+ "sort-amount-desc": $fa-var-sort-amount-desc,
+ "sort-amount-down-alt": $fa-var-sort-amount-down-alt,
+ "less-than": $fa-var-less-than,
+ "angle-down": $fa-var-angle-down,
+ "car-tunnel": $fa-var-car-tunnel,
+ "head-side-cough": $fa-var-head-side-cough,
+ "grip-lines": $fa-var-grip-lines,
+ "thumbs-down": $fa-var-thumbs-down,
+ "user-lock": $fa-var-user-lock,
+ "arrow-right-long": $fa-var-arrow-right-long,
+ "long-arrow-right": $fa-var-long-arrow-right,
+ "anchor-circle-xmark": $fa-var-anchor-circle-xmark,
+ "ellipsis": $fa-var-ellipsis,
+ "ellipsis-h": $fa-var-ellipsis-h,
+ "chess-pawn": $fa-var-chess-pawn,
+ "kit-medical": $fa-var-kit-medical,
+ "first-aid": $fa-var-first-aid,
+ "person-through-window": $fa-var-person-through-window,
+ "toolbox": $fa-var-toolbox,
+ "hands-holding-circle": $fa-var-hands-holding-circle,
+ "bug": $fa-var-bug,
+ "credit-card": $fa-var-credit-card,
+ "credit-card-alt": $fa-var-credit-card-alt,
+ "car": $fa-var-car,
+ "automobile": $fa-var-automobile,
+ "hand-holding-hand": $fa-var-hand-holding-hand,
+ "book-open-reader": $fa-var-book-open-reader,
+ "book-reader": $fa-var-book-reader,
+ "mountain-sun": $fa-var-mountain-sun,
+ "arrows-left-right-to-line": $fa-var-arrows-left-right-to-line,
+ "dice-d20": $fa-var-dice-d20,
+ "truck-droplet": $fa-var-truck-droplet,
+ "file-circle-xmark": $fa-var-file-circle-xmark,
+ "temperature-arrow-up": $fa-var-temperature-arrow-up,
+ "temperature-up": $fa-var-temperature-up,
+ "medal": $fa-var-medal,
+ "bed": $fa-var-bed,
+ "square-h": $fa-var-square-h,
+ "h-square": $fa-var-h-square,
+ "podcast": $fa-var-podcast,
+ "temperature-full": $fa-var-temperature-full,
+ "temperature-4": $fa-var-temperature-4,
+ "thermometer-4": $fa-var-thermometer-4,
+ "thermometer-full": $fa-var-thermometer-full,
+ "bell": $fa-var-bell,
+ "superscript": $fa-var-superscript,
+ "plug-circle-xmark": $fa-var-plug-circle-xmark,
+ "star-of-life": $fa-var-star-of-life,
+ "phone-slash": $fa-var-phone-slash,
+ "paint-roller": $fa-var-paint-roller,
+ "handshake-angle": $fa-var-handshake-angle,
+ "hands-helping": $fa-var-hands-helping,
+ "location-dot": $fa-var-location-dot,
+ "map-marker-alt": $fa-var-map-marker-alt,
+ "file": $fa-var-file,
+ "greater-than": $fa-var-greater-than,
+ "person-swimming": $fa-var-person-swimming,
+ "swimmer": $fa-var-swimmer,
+ "arrow-down": $fa-var-arrow-down,
+ "droplet": $fa-var-droplet,
+ "tint": $fa-var-tint,
+ "eraser": $fa-var-eraser,
+ "earth-americas": $fa-var-earth-americas,
+ "earth": $fa-var-earth,
+ "earth-america": $fa-var-earth-america,
+ "globe-americas": $fa-var-globe-americas,
+ "person-burst": $fa-var-person-burst,
+ "dove": $fa-var-dove,
+ "battery-empty": $fa-var-battery-empty,
+ "battery-0": $fa-var-battery-0,
+ "socks": $fa-var-socks,
+ "inbox": $fa-var-inbox,
+ "section": $fa-var-section,
+ "gauge-high": $fa-var-gauge-high,
+ "tachometer-alt": $fa-var-tachometer-alt,
+ "tachometer-alt-fast": $fa-var-tachometer-alt-fast,
+ "envelope-open-text": $fa-var-envelope-open-text,
+ "hospital": $fa-var-hospital,
+ "hospital-alt": $fa-var-hospital-alt,
+ "hospital-wide": $fa-var-hospital-wide,
+ "wine-bottle": $fa-var-wine-bottle,
+ "chess-rook": $fa-var-chess-rook,
+ "bars-staggered": $fa-var-bars-staggered,
+ "reorder": $fa-var-reorder,
+ "stream": $fa-var-stream,
+ "dharmachakra": $fa-var-dharmachakra,
+ "hotdog": $fa-var-hotdog,
+ "person-walking-with-cane": $fa-var-person-walking-with-cane,
+ "blind": $fa-var-blind,
+ "drum": $fa-var-drum,
+ "ice-cream": $fa-var-ice-cream,
+ "heart-circle-bolt": $fa-var-heart-circle-bolt,
+ "fax": $fa-var-fax,
+ "paragraph": $fa-var-paragraph,
+ "check-to-slot": $fa-var-check-to-slot,
+ "vote-yea": $fa-var-vote-yea,
+ "star-half": $fa-var-star-half,
+ "boxes-stacked": $fa-var-boxes-stacked,
+ "boxes": $fa-var-boxes,
+ "boxes-alt": $fa-var-boxes-alt,
+ "link": $fa-var-link,
+ "chain": $fa-var-chain,
+ "ear-listen": $fa-var-ear-listen,
+ "assistive-listening-systems": $fa-var-assistive-listening-systems,
+ "tree-city": $fa-var-tree-city,
+ "play": $fa-var-play,
+ "font": $fa-var-font,
+ "rupiah-sign": $fa-var-rupiah-sign,
+ "magnifying-glass": $fa-var-magnifying-glass,
+ "search": $fa-var-search,
+ "table-tennis-paddle-ball": $fa-var-table-tennis-paddle-ball,
+ "ping-pong-paddle-ball": $fa-var-ping-pong-paddle-ball,
+ "table-tennis": $fa-var-table-tennis,
+ "person-dots-from-line": $fa-var-person-dots-from-line,
+ "diagnoses": $fa-var-diagnoses,
+ "trash-can-arrow-up": $fa-var-trash-can-arrow-up,
+ "trash-restore-alt": $fa-var-trash-restore-alt,
+ "naira-sign": $fa-var-naira-sign,
+ "cart-arrow-down": $fa-var-cart-arrow-down,
+ "walkie-talkie": $fa-var-walkie-talkie,
+ "file-pen": $fa-var-file-pen,
+ "file-edit": $fa-var-file-edit,
+ "receipt": $fa-var-receipt,
+ "square-pen": $fa-var-square-pen,
+ "pen-square": $fa-var-pen-square,
+ "pencil-square": $fa-var-pencil-square,
+ "suitcase-rolling": $fa-var-suitcase-rolling,
+ "person-circle-exclamation": $fa-var-person-circle-exclamation,
+ "chevron-down": $fa-var-chevron-down,
+ "battery-full": $fa-var-battery-full,
+ "battery": $fa-var-battery,
+ "battery-5": $fa-var-battery-5,
+ "skull-crossbones": $fa-var-skull-crossbones,
+ "code-compare": $fa-var-code-compare,
+ "list-ul": $fa-var-list-ul,
+ "list-dots": $fa-var-list-dots,
+ "school-lock": $fa-var-school-lock,
+ "tower-cell": $fa-var-tower-cell,
+ "down-long": $fa-var-down-long,
+ "long-arrow-alt-down": $fa-var-long-arrow-alt-down,
+ "ranking-star": $fa-var-ranking-star,
+ "chess-king": $fa-var-chess-king,
+ "person-harassing": $fa-var-person-harassing,
+ "brazilian-real-sign": $fa-var-brazilian-real-sign,
+ "landmark-dome": $fa-var-landmark-dome,
+ "landmark-alt": $fa-var-landmark-alt,
+ "arrow-up": $fa-var-arrow-up,
+ "tv": $fa-var-tv,
+ "television": $fa-var-television,
+ "tv-alt": $fa-var-tv-alt,
+ "shrimp": $fa-var-shrimp,
+ "list-check": $fa-var-list-check,
+ "tasks": $fa-var-tasks,
+ "jug-detergent": $fa-var-jug-detergent,
+ "circle-user": $fa-var-circle-user,
+ "user-circle": $fa-var-user-circle,
+ "user-shield": $fa-var-user-shield,
+ "wind": $fa-var-wind,
+ "car-burst": $fa-var-car-burst,
+ "car-crash": $fa-var-car-crash,
+ "y": $fa-var-y,
+ "person-snowboarding": $fa-var-person-snowboarding,
+ "snowboarding": $fa-var-snowboarding,
+ "truck-fast": $fa-var-truck-fast,
+ "shipping-fast": $fa-var-shipping-fast,
+ "fish": $fa-var-fish,
+ "user-graduate": $fa-var-user-graduate,
+ "circle-half-stroke": $fa-var-circle-half-stroke,
+ "adjust": $fa-var-adjust,
+ "clapperboard": $fa-var-clapperboard,
+ "circle-radiation": $fa-var-circle-radiation,
+ "radiation-alt": $fa-var-radiation-alt,
+ "baseball": $fa-var-baseball,
+ "baseball-ball": $fa-var-baseball-ball,
+ "jet-fighter-up": $fa-var-jet-fighter-up,
+ "diagram-project": $fa-var-diagram-project,
+ "project-diagram": $fa-var-project-diagram,
+ "copy": $fa-var-copy,
+ "volume-xmark": $fa-var-volume-xmark,
+ "volume-mute": $fa-var-volume-mute,
+ "volume-times": $fa-var-volume-times,
+ "hand-sparkles": $fa-var-hand-sparkles,
+ "grip": $fa-var-grip,
+ "grip-horizontal": $fa-var-grip-horizontal,
+ "share-from-square": $fa-var-share-from-square,
+ "share-square": $fa-var-share-square,
+ "child-combatant": $fa-var-child-combatant,
+ "child-rifle": $fa-var-child-rifle,
+ "gun": $fa-var-gun,
+ "square-phone": $fa-var-square-phone,
+ "phone-square": $fa-var-phone-square,
+ "plus": $fa-var-plus,
+ "add": $fa-var-add,
+ "expand": $fa-var-expand,
+ "computer": $fa-var-computer,
+ "xmark": $fa-var-xmark,
+ "close": $fa-var-close,
+ "multiply": $fa-var-multiply,
+ "remove": $fa-var-remove,
+ "times": $fa-var-times,
+ "arrows-up-down-left-right": $fa-var-arrows-up-down-left-right,
+ "arrows": $fa-var-arrows,
+ "chalkboard-user": $fa-var-chalkboard-user,
+ "chalkboard-teacher": $fa-var-chalkboard-teacher,
+ "peso-sign": $fa-var-peso-sign,
+ "building-shield": $fa-var-building-shield,
+ "baby": $fa-var-baby,
+ "users-line": $fa-var-users-line,
+ "quote-left": $fa-var-quote-left,
+ "quote-left-alt": $fa-var-quote-left-alt,
+ "tractor": $fa-var-tractor,
+ "trash-arrow-up": $fa-var-trash-arrow-up,
+ "trash-restore": $fa-var-trash-restore,
+ "arrow-down-up-lock": $fa-var-arrow-down-up-lock,
+ "lines-leaning": $fa-var-lines-leaning,
+ "ruler-combined": $fa-var-ruler-combined,
+ "copyright": $fa-var-copyright,
+ "equals": $fa-var-equals,
+ "blender": $fa-var-blender,
+ "teeth": $fa-var-teeth,
+ "shekel-sign": $fa-var-shekel-sign,
+ "ils": $fa-var-ils,
+ "shekel": $fa-var-shekel,
+ "sheqel": $fa-var-sheqel,
+ "sheqel-sign": $fa-var-sheqel-sign,
+ "map": $fa-var-map,
+ "rocket": $fa-var-rocket,
+ "photo-film": $fa-var-photo-film,
+ "photo-video": $fa-var-photo-video,
+ "folder-minus": $fa-var-folder-minus,
+ "store": $fa-var-store,
+ "arrow-trend-up": $fa-var-arrow-trend-up,
+ "plug-circle-minus": $fa-var-plug-circle-minus,
+ "sign-hanging": $fa-var-sign-hanging,
+ "sign": $fa-var-sign,
+ "bezier-curve": $fa-var-bezier-curve,
+ "bell-slash": $fa-var-bell-slash,
+ "tablet": $fa-var-tablet,
+ "tablet-android": $fa-var-tablet-android,
+ "school-flag": $fa-var-school-flag,
+ "fill": $fa-var-fill,
+ "angle-up": $fa-var-angle-up,
+ "drumstick-bite": $fa-var-drumstick-bite,
+ "holly-berry": $fa-var-holly-berry,
+ "chevron-left": $fa-var-chevron-left,
+ "bacteria": $fa-var-bacteria,
+ "hand-lizard": $fa-var-hand-lizard,
+ "notdef": $fa-var-notdef,
+ "disease": $fa-var-disease,
+ "briefcase-medical": $fa-var-briefcase-medical,
+ "genderless": $fa-var-genderless,
+ "chevron-right": $fa-var-chevron-right,
+ "retweet": $fa-var-retweet,
+ "car-rear": $fa-var-car-rear,
+ "car-alt": $fa-var-car-alt,
+ "pump-soap": $fa-var-pump-soap,
+ "video-slash": $fa-var-video-slash,
+ "battery-quarter": $fa-var-battery-quarter,
+ "battery-2": $fa-var-battery-2,
+ "radio": $fa-var-radio,
+ "baby-carriage": $fa-var-baby-carriage,
+ "carriage-baby": $fa-var-carriage-baby,
+ "traffic-light": $fa-var-traffic-light,
+ "thermometer": $fa-var-thermometer,
+ "vr-cardboard": $fa-var-vr-cardboard,
+ "hand-middle-finger": $fa-var-hand-middle-finger,
+ "percent": $fa-var-percent,
+ "percentage": $fa-var-percentage,
+ "truck-moving": $fa-var-truck-moving,
+ "glass-water-droplet": $fa-var-glass-water-droplet,
+ "display": $fa-var-display,
+ "face-smile": $fa-var-face-smile,
+ "smile": $fa-var-smile,
+ "thumbtack": $fa-var-thumbtack,
+ "thumb-tack": $fa-var-thumb-tack,
+ "trophy": $fa-var-trophy,
+ "person-praying": $fa-var-person-praying,
+ "pray": $fa-var-pray,
+ "hammer": $fa-var-hammer,
+ "hand-peace": $fa-var-hand-peace,
+ "rotate": $fa-var-rotate,
+ "sync-alt": $fa-var-sync-alt,
+ "spinner": $fa-var-spinner,
+ "robot": $fa-var-robot,
+ "peace": $fa-var-peace,
+ "gears": $fa-var-gears,
+ "cogs": $fa-var-cogs,
+ "warehouse": $fa-var-warehouse,
+ "arrow-up-right-dots": $fa-var-arrow-up-right-dots,
+ "splotch": $fa-var-splotch,
+ "face-grin-hearts": $fa-var-face-grin-hearts,
+ "grin-hearts": $fa-var-grin-hearts,
+ "dice-four": $fa-var-dice-four,
+ "sim-card": $fa-var-sim-card,
+ "transgender": $fa-var-transgender,
+ "transgender-alt": $fa-var-transgender-alt,
+ "mercury": $fa-var-mercury,
+ "arrow-turn-down": $fa-var-arrow-turn-down,
+ "level-down": $fa-var-level-down,
+ "person-falling-burst": $fa-var-person-falling-burst,
+ "award": $fa-var-award,
+ "ticket-simple": $fa-var-ticket-simple,
+ "ticket-alt": $fa-var-ticket-alt,
+ "building": $fa-var-building,
+ "angles-left": $fa-var-angles-left,
+ "angle-double-left": $fa-var-angle-double-left,
+ "qrcode": $fa-var-qrcode,
+ "clock-rotate-left": $fa-var-clock-rotate-left,
+ "history": $fa-var-history,
+ "face-grin-beam-sweat": $fa-var-face-grin-beam-sweat,
+ "grin-beam-sweat": $fa-var-grin-beam-sweat,
+ "file-export": $fa-var-file-export,
+ "arrow-right-from-file": $fa-var-arrow-right-from-file,
+ "shield": $fa-var-shield,
+ "shield-blank": $fa-var-shield-blank,
+ "arrow-up-short-wide": $fa-var-arrow-up-short-wide,
+ "sort-amount-up-alt": $fa-var-sort-amount-up-alt,
+ "house-medical": $fa-var-house-medical,
+ "golf-ball-tee": $fa-var-golf-ball-tee,
+ "golf-ball": $fa-var-golf-ball,
+ "circle-chevron-left": $fa-var-circle-chevron-left,
+ "chevron-circle-left": $fa-var-chevron-circle-left,
+ "house-chimney-window": $fa-var-house-chimney-window,
+ "pen-nib": $fa-var-pen-nib,
+ "tent-arrow-turn-left": $fa-var-tent-arrow-turn-left,
+ "tents": $fa-var-tents,
+ "wand-magic": $fa-var-wand-magic,
+ "magic": $fa-var-magic,
+ "dog": $fa-var-dog,
+ "carrot": $fa-var-carrot,
+ "moon": $fa-var-moon,
+ "wine-glass-empty": $fa-var-wine-glass-empty,
+ "wine-glass-alt": $fa-var-wine-glass-alt,
+ "cheese": $fa-var-cheese,
+ "yin-yang": $fa-var-yin-yang,
+ "music": $fa-var-music,
+ "code-commit": $fa-var-code-commit,
+ "temperature-low": $fa-var-temperature-low,
+ "person-biking": $fa-var-person-biking,
+ "biking": $fa-var-biking,
+ "broom": $fa-var-broom,
+ "shield-heart": $fa-var-shield-heart,
+ "gopuram": $fa-var-gopuram,
+ "earth-oceania": $fa-var-earth-oceania,
+ "globe-oceania": $fa-var-globe-oceania,
+ "square-xmark": $fa-var-square-xmark,
+ "times-square": $fa-var-times-square,
+ "xmark-square": $fa-var-xmark-square,
+ "hashtag": $fa-var-hashtag,
+ "up-right-and-down-left-from-center": $fa-var-up-right-and-down-left-from-center,
+ "expand-alt": $fa-var-expand-alt,
+ "oil-can": $fa-var-oil-can,
+ "t": $fa-var-t,
+ "hippo": $fa-var-hippo,
+ "chart-column": $fa-var-chart-column,
+ "infinity": $fa-var-infinity,
+ "vial-circle-check": $fa-var-vial-circle-check,
+ "person-arrow-down-to-line": $fa-var-person-arrow-down-to-line,
+ "voicemail": $fa-var-voicemail,
+ "fan": $fa-var-fan,
+ "person-walking-luggage": $fa-var-person-walking-luggage,
+ "up-down": $fa-var-up-down,
+ "arrows-alt-v": $fa-var-arrows-alt-v,
+ "cloud-moon-rain": $fa-var-cloud-moon-rain,
+ "calendar": $fa-var-calendar,
+ "trailer": $fa-var-trailer,
+ "bahai": $fa-var-bahai,
+ "haykal": $fa-var-haykal,
+ "sd-card": $fa-var-sd-card,
+ "dragon": $fa-var-dragon,
+ "shoe-prints": $fa-var-shoe-prints,
+ "circle-plus": $fa-var-circle-plus,
+ "plus-circle": $fa-var-plus-circle,
+ "face-grin-tongue-wink": $fa-var-face-grin-tongue-wink,
+ "grin-tongue-wink": $fa-var-grin-tongue-wink,
+ "hand-holding": $fa-var-hand-holding,
+ "plug-circle-exclamation": $fa-var-plug-circle-exclamation,
+ "link-slash": $fa-var-link-slash,
+ "chain-broken": $fa-var-chain-broken,
+ "chain-slash": $fa-var-chain-slash,
+ "unlink": $fa-var-unlink,
+ "clone": $fa-var-clone,
+ "person-walking-arrow-loop-left": $fa-var-person-walking-arrow-loop-left,
+ "arrow-up-z-a": $fa-var-arrow-up-z-a,
+ "sort-alpha-up-alt": $fa-var-sort-alpha-up-alt,
+ "fire-flame-curved": $fa-var-fire-flame-curved,
+ "fire-alt": $fa-var-fire-alt,
+ "tornado": $fa-var-tornado,
+ "file-circle-plus": $fa-var-file-circle-plus,
+ "book-quran": $fa-var-book-quran,
+ "quran": $fa-var-quran,
+ "anchor": $fa-var-anchor,
+ "border-all": $fa-var-border-all,
+ "face-angry": $fa-var-face-angry,
+ "angry": $fa-var-angry,
+ "cookie-bite": $fa-var-cookie-bite,
+ "arrow-trend-down": $fa-var-arrow-trend-down,
+ "rss": $fa-var-rss,
+ "feed": $fa-var-feed,
+ "draw-polygon": $fa-var-draw-polygon,
+ "scale-balanced": $fa-var-scale-balanced,
+ "balance-scale": $fa-var-balance-scale,
+ "gauge-simple-high": $fa-var-gauge-simple-high,
+ "tachometer": $fa-var-tachometer,
+ "tachometer-fast": $fa-var-tachometer-fast,
+ "shower": $fa-var-shower,
+ "desktop": $fa-var-desktop,
+ "desktop-alt": $fa-var-desktop-alt,
+ "m": $fa-var-m,
+ "table-list": $fa-var-table-list,
+ "th-list": $fa-var-th-list,
+ "comment-sms": $fa-var-comment-sms,
+ "sms": $fa-var-sms,
+ "book": $fa-var-book,
+ "user-plus": $fa-var-user-plus,
+ "check": $fa-var-check,
+ "battery-three-quarters": $fa-var-battery-three-quarters,
+ "battery-4": $fa-var-battery-4,
+ "house-circle-check": $fa-var-house-circle-check,
+ "angle-left": $fa-var-angle-left,
+ "diagram-successor": $fa-var-diagram-successor,
+ "truck-arrow-right": $fa-var-truck-arrow-right,
+ "arrows-split-up-and-left": $fa-var-arrows-split-up-and-left,
+ "hand-fist": $fa-var-hand-fist,
+ "fist-raised": $fa-var-fist-raised,
+ "cloud-moon": $fa-var-cloud-moon,
+ "briefcase": $fa-var-briefcase,
+ "person-falling": $fa-var-person-falling,
+ "image-portrait": $fa-var-image-portrait,
+ "portrait": $fa-var-portrait,
+ "user-tag": $fa-var-user-tag,
+ "rug": $fa-var-rug,
+ "earth-europe": $fa-var-earth-europe,
+ "globe-europe": $fa-var-globe-europe,
+ "cart-flatbed-suitcase": $fa-var-cart-flatbed-suitcase,
+ "luggage-cart": $fa-var-luggage-cart,
+ "rectangle-xmark": $fa-var-rectangle-xmark,
+ "rectangle-times": $fa-var-rectangle-times,
+ "times-rectangle": $fa-var-times-rectangle,
+ "window-close": $fa-var-window-close,
+ "baht-sign": $fa-var-baht-sign,
+ "book-open": $fa-var-book-open,
+ "book-journal-whills": $fa-var-book-journal-whills,
+ "journal-whills": $fa-var-journal-whills,
+ "handcuffs": $fa-var-handcuffs,
+ "triangle-exclamation": $fa-var-triangle-exclamation,
+ "exclamation-triangle": $fa-var-exclamation-triangle,
+ "warning": $fa-var-warning,
+ "database": $fa-var-database,
+ "share": $fa-var-share,
+ "mail-forward": $fa-var-mail-forward,
+ "bottle-droplet": $fa-var-bottle-droplet,
+ "mask-face": $fa-var-mask-face,
+ "hill-rockslide": $fa-var-hill-rockslide,
+ "right-left": $fa-var-right-left,
+ "exchange-alt": $fa-var-exchange-alt,
+ "paper-plane": $fa-var-paper-plane,
+ "road-circle-exclamation": $fa-var-road-circle-exclamation,
+ "dungeon": $fa-var-dungeon,
+ "align-right": $fa-var-align-right,
+ "money-bill-1-wave": $fa-var-money-bill-1-wave,
+ "money-bill-wave-alt": $fa-var-money-bill-wave-alt,
+ "life-ring": $fa-var-life-ring,
+ "hands": $fa-var-hands,
+ "sign-language": $fa-var-sign-language,
+ "signing": $fa-var-signing,
+ "calendar-day": $fa-var-calendar-day,
+ "water-ladder": $fa-var-water-ladder,
+ "ladder-water": $fa-var-ladder-water,
+ "swimming-pool": $fa-var-swimming-pool,
+ "arrows-up-down": $fa-var-arrows-up-down,
+ "arrows-v": $fa-var-arrows-v,
+ "face-grimace": $fa-var-face-grimace,
+ "grimace": $fa-var-grimace,
+ "wheelchair-move": $fa-var-wheelchair-move,
+ "wheelchair-alt": $fa-var-wheelchair-alt,
+ "turn-down": $fa-var-turn-down,
+ "level-down-alt": $fa-var-level-down-alt,
+ "person-walking-arrow-right": $fa-var-person-walking-arrow-right,
+ "square-envelope": $fa-var-square-envelope,
+ "envelope-square": $fa-var-envelope-square,
+ "dice": $fa-var-dice,
+ "bowling-ball": $fa-var-bowling-ball,
+ "brain": $fa-var-brain,
+ "bandage": $fa-var-bandage,
+ "band-aid": $fa-var-band-aid,
+ "calendar-minus": $fa-var-calendar-minus,
+ "circle-xmark": $fa-var-circle-xmark,
+ "times-circle": $fa-var-times-circle,
+ "xmark-circle": $fa-var-xmark-circle,
+ "gifts": $fa-var-gifts,
+ "hotel": $fa-var-hotel,
+ "earth-asia": $fa-var-earth-asia,
+ "globe-asia": $fa-var-globe-asia,
+ "id-card-clip": $fa-var-id-card-clip,
+ "id-card-alt": $fa-var-id-card-alt,
+ "magnifying-glass-plus": $fa-var-magnifying-glass-plus,
+ "search-plus": $fa-var-search-plus,
+ "thumbs-up": $fa-var-thumbs-up,
+ "user-clock": $fa-var-user-clock,
+ "hand-dots": $fa-var-hand-dots,
+ "allergies": $fa-var-allergies,
+ "file-invoice": $fa-var-file-invoice,
+ "window-minimize": $fa-var-window-minimize,
+ "mug-saucer": $fa-var-mug-saucer,
+ "coffee": $fa-var-coffee,
+ "brush": $fa-var-brush,
+ "mask": $fa-var-mask,
+ "magnifying-glass-minus": $fa-var-magnifying-glass-minus,
+ "search-minus": $fa-var-search-minus,
+ "ruler-vertical": $fa-var-ruler-vertical,
+ "user-large": $fa-var-user-large,
+ "user-alt": $fa-var-user-alt,
+ "train-tram": $fa-var-train-tram,
+ "user-nurse": $fa-var-user-nurse,
+ "syringe": $fa-var-syringe,
+ "cloud-sun": $fa-var-cloud-sun,
+ "stopwatch-20": $fa-var-stopwatch-20,
+ "square-full": $fa-var-square-full,
+ "magnet": $fa-var-magnet,
+ "jar": $fa-var-jar,
+ "note-sticky": $fa-var-note-sticky,
+ "sticky-note": $fa-var-sticky-note,
+ "bug-slash": $fa-var-bug-slash,
+ "arrow-up-from-water-pump": $fa-var-arrow-up-from-water-pump,
+ "bone": $fa-var-bone,
+ "user-injured": $fa-var-user-injured,
+ "face-sad-tear": $fa-var-face-sad-tear,
+ "sad-tear": $fa-var-sad-tear,
+ "plane": $fa-var-plane,
+ "tent-arrows-down": $fa-var-tent-arrows-down,
+ "exclamation": $fa-var-exclamation,
+ "arrows-spin": $fa-var-arrows-spin,
+ "print": $fa-var-print,
+ "turkish-lira-sign": $fa-var-turkish-lira-sign,
+ "try": $fa-var-try,
+ "turkish-lira": $fa-var-turkish-lira,
+ "dollar-sign": $fa-var-dollar-sign,
+ "dollar": $fa-var-dollar,
+ "usd": $fa-var-usd,
+ "x": $fa-var-x,
+ "magnifying-glass-dollar": $fa-var-magnifying-glass-dollar,
+ "search-dollar": $fa-var-search-dollar,
+ "users-gear": $fa-var-users-gear,
+ "users-cog": $fa-var-users-cog,
+ "person-military-pointing": $fa-var-person-military-pointing,
+ "building-columns": $fa-var-building-columns,
+ "bank": $fa-var-bank,
+ "institution": $fa-var-institution,
+ "museum": $fa-var-museum,
+ "university": $fa-var-university,
+ "umbrella": $fa-var-umbrella,
+ "trowel": $fa-var-trowel,
+ "d": $fa-var-d,
+ "stapler": $fa-var-stapler,
+ "masks-theater": $fa-var-masks-theater,
+ "theater-masks": $fa-var-theater-masks,
+ "kip-sign": $fa-var-kip-sign,
+ "hand-point-left": $fa-var-hand-point-left,
+ "handshake-simple": $fa-var-handshake-simple,
+ "handshake-alt": $fa-var-handshake-alt,
+ "jet-fighter": $fa-var-jet-fighter,
+ "fighter-jet": $fa-var-fighter-jet,
+ "square-share-nodes": $fa-var-square-share-nodes,
+ "share-alt-square": $fa-var-share-alt-square,
+ "barcode": $fa-var-barcode,
+ "plus-minus": $fa-var-plus-minus,
+ "video": $fa-var-video,
+ "video-camera": $fa-var-video-camera,
+ "graduation-cap": $fa-var-graduation-cap,
+ "mortar-board": $fa-var-mortar-board,
+ "hand-holding-medical": $fa-var-hand-holding-medical,
+ "person-circle-check": $fa-var-person-circle-check,
+ "turn-up": $fa-var-turn-up,
+ "level-up-alt": $fa-var-level-up-alt,
+);
+
+$fa-brand-icons: (
+ "monero": $fa-var-monero,
+ "hooli": $fa-var-hooli,
+ "yelp": $fa-var-yelp,
+ "cc-visa": $fa-var-cc-visa,
+ "lastfm": $fa-var-lastfm,
+ "shopware": $fa-var-shopware,
+ "creative-commons-nc": $fa-var-creative-commons-nc,
+ "aws": $fa-var-aws,
+ "redhat": $fa-var-redhat,
+ "yoast": $fa-var-yoast,
+ "cloudflare": $fa-var-cloudflare,
+ "ups": $fa-var-ups,
+ "pixiv": $fa-var-pixiv,
+ "wpexplorer": $fa-var-wpexplorer,
+ "dyalog": $fa-var-dyalog,
+ "bity": $fa-var-bity,
+ "stackpath": $fa-var-stackpath,
+ "buysellads": $fa-var-buysellads,
+ "first-order": $fa-var-first-order,
+ "modx": $fa-var-modx,
+ "guilded": $fa-var-guilded,
+ "vnv": $fa-var-vnv,
+ "square-js": $fa-var-square-js,
+ "js-square": $fa-var-js-square,
+ "microsoft": $fa-var-microsoft,
+ "qq": $fa-var-qq,
+ "orcid": $fa-var-orcid,
+ "java": $fa-var-java,
+ "invision": $fa-var-invision,
+ "creative-commons-pd-alt": $fa-var-creative-commons-pd-alt,
+ "centercode": $fa-var-centercode,
+ "glide-g": $fa-var-glide-g,
+ "drupal": $fa-var-drupal,
+ "hire-a-helper": $fa-var-hire-a-helper,
+ "creative-commons-by": $fa-var-creative-commons-by,
+ "unity": $fa-var-unity,
+ "whmcs": $fa-var-whmcs,
+ "rocketchat": $fa-var-rocketchat,
+ "vk": $fa-var-vk,
+ "untappd": $fa-var-untappd,
+ "mailchimp": $fa-var-mailchimp,
+ "css3-alt": $fa-var-css3-alt,
+ "square-reddit": $fa-var-square-reddit,
+ "reddit-square": $fa-var-reddit-square,
+ "vimeo-v": $fa-var-vimeo-v,
+ "contao": $fa-var-contao,
+ "square-font-awesome": $fa-var-square-font-awesome,
+ "deskpro": $fa-var-deskpro,
+ "brave": $fa-var-brave,
+ "sistrix": $fa-var-sistrix,
+ "square-instagram": $fa-var-square-instagram,
+ "instagram-square": $fa-var-instagram-square,
+ "battle-net": $fa-var-battle-net,
+ "the-red-yeti": $fa-var-the-red-yeti,
+ "square-hacker-news": $fa-var-square-hacker-news,
+ "hacker-news-square": $fa-var-hacker-news-square,
+ "edge": $fa-var-edge,
+ "threads": $fa-var-threads,
+ "napster": $fa-var-napster,
+ "square-snapchat": $fa-var-square-snapchat,
+ "snapchat-square": $fa-var-snapchat-square,
+ "google-plus-g": $fa-var-google-plus-g,
+ "artstation": $fa-var-artstation,
+ "markdown": $fa-var-markdown,
+ "sourcetree": $fa-var-sourcetree,
+ "google-plus": $fa-var-google-plus,
+ "diaspora": $fa-var-diaspora,
+ "foursquare": $fa-var-foursquare,
+ "stack-overflow": $fa-var-stack-overflow,
+ "github-alt": $fa-var-github-alt,
+ "phoenix-squadron": $fa-var-phoenix-squadron,
+ "pagelines": $fa-var-pagelines,
+ "algolia": $fa-var-algolia,
+ "red-river": $fa-var-red-river,
+ "creative-commons-sa": $fa-var-creative-commons-sa,
+ "safari": $fa-var-safari,
+ "google": $fa-var-google,
+ "square-font-awesome-stroke": $fa-var-square-font-awesome-stroke,
+ "font-awesome-alt": $fa-var-font-awesome-alt,
+ "atlassian": $fa-var-atlassian,
+ "linkedin-in": $fa-var-linkedin-in,
+ "digital-ocean": $fa-var-digital-ocean,
+ "nimblr": $fa-var-nimblr,
+ "chromecast": $fa-var-chromecast,
+ "evernote": $fa-var-evernote,
+ "hacker-news": $fa-var-hacker-news,
+ "creative-commons-sampling": $fa-var-creative-commons-sampling,
+ "adversal": $fa-var-adversal,
+ "creative-commons": $fa-var-creative-commons,
+ "watchman-monitoring": $fa-var-watchman-monitoring,
+ "fonticons": $fa-var-fonticons,
+ "weixin": $fa-var-weixin,
+ "shirtsinbulk": $fa-var-shirtsinbulk,
+ "codepen": $fa-var-codepen,
+ "git-alt": $fa-var-git-alt,
+ "lyft": $fa-var-lyft,
+ "rev": $fa-var-rev,
+ "windows": $fa-var-windows,
+ "wizards-of-the-coast": $fa-var-wizards-of-the-coast,
+ "square-viadeo": $fa-var-square-viadeo,
+ "viadeo-square": $fa-var-viadeo-square,
+ "meetup": $fa-var-meetup,
+ "centos": $fa-var-centos,
+ "adn": $fa-var-adn,
+ "cloudsmith": $fa-var-cloudsmith,
+ "opensuse": $fa-var-opensuse,
+ "pied-piper-alt": $fa-var-pied-piper-alt,
+ "square-dribbble": $fa-var-square-dribbble,
+ "dribbble-square": $fa-var-dribbble-square,
+ "codiepie": $fa-var-codiepie,
+ "node": $fa-var-node,
+ "mix": $fa-var-mix,
+ "steam": $fa-var-steam,
+ "cc-apple-pay": $fa-var-cc-apple-pay,
+ "scribd": $fa-var-scribd,
+ "debian": $fa-var-debian,
+ "openid": $fa-var-openid,
+ "instalod": $fa-var-instalod,
+ "expeditedssl": $fa-var-expeditedssl,
+ "sellcast": $fa-var-sellcast,
+ "square-twitter": $fa-var-square-twitter,
+ "twitter-square": $fa-var-twitter-square,
+ "r-project": $fa-var-r-project,
+ "delicious": $fa-var-delicious,
+ "freebsd": $fa-var-freebsd,
+ "vuejs": $fa-var-vuejs,
+ "accusoft": $fa-var-accusoft,
+ "ioxhost": $fa-var-ioxhost,
+ "fonticons-fi": $fa-var-fonticons-fi,
+ "app-store": $fa-var-app-store,
+ "cc-mastercard": $fa-var-cc-mastercard,
+ "itunes-note": $fa-var-itunes-note,
+ "golang": $fa-var-golang,
+ "kickstarter": $fa-var-kickstarter,
+ "grav": $fa-var-grav,
+ "weibo": $fa-var-weibo,
+ "uncharted": $fa-var-uncharted,
+ "firstdraft": $fa-var-firstdraft,
+ "square-youtube": $fa-var-square-youtube,
+ "youtube-square": $fa-var-youtube-square,
+ "wikipedia-w": $fa-var-wikipedia-w,
+ "wpressr": $fa-var-wpressr,
+ "rendact": $fa-var-rendact,
+ "angellist": $fa-var-angellist,
+ "galactic-republic": $fa-var-galactic-republic,
+ "nfc-directional": $fa-var-nfc-directional,
+ "skype": $fa-var-skype,
+ "joget": $fa-var-joget,
+ "fedora": $fa-var-fedora,
+ "stripe-s": $fa-var-stripe-s,
+ "meta": $fa-var-meta,
+ "laravel": $fa-var-laravel,
+ "hotjar": $fa-var-hotjar,
+ "bluetooth-b": $fa-var-bluetooth-b,
+ "square-letterboxd": $fa-var-square-letterboxd,
+ "sticker-mule": $fa-var-sticker-mule,
+ "creative-commons-zero": $fa-var-creative-commons-zero,
+ "hips": $fa-var-hips,
+ "behance": $fa-var-behance,
+ "reddit": $fa-var-reddit,
+ "discord": $fa-var-discord,
+ "chrome": $fa-var-chrome,
+ "app-store-ios": $fa-var-app-store-ios,
+ "cc-discover": $fa-var-cc-discover,
+ "wpbeginner": $fa-var-wpbeginner,
+ "confluence": $fa-var-confluence,
+ "shoelace": $fa-var-shoelace,
+ "mdb": $fa-var-mdb,
+ "dochub": $fa-var-dochub,
+ "accessible-icon": $fa-var-accessible-icon,
+ "ebay": $fa-var-ebay,
+ "amazon": $fa-var-amazon,
+ "unsplash": $fa-var-unsplash,
+ "yarn": $fa-var-yarn,
+ "square-steam": $fa-var-square-steam,
+ "steam-square": $fa-var-steam-square,
+ "500px": $fa-var-500px,
+ "square-vimeo": $fa-var-square-vimeo,
+ "vimeo-square": $fa-var-vimeo-square,
+ "asymmetrik": $fa-var-asymmetrik,
+ "font-awesome": $fa-var-font-awesome,
+ "font-awesome-flag": $fa-var-font-awesome-flag,
+ "font-awesome-logo-full": $fa-var-font-awesome-logo-full,
+ "gratipay": $fa-var-gratipay,
+ "apple": $fa-var-apple,
+ "hive": $fa-var-hive,
+ "gitkraken": $fa-var-gitkraken,
+ "keybase": $fa-var-keybase,
+ "apple-pay": $fa-var-apple-pay,
+ "padlet": $fa-var-padlet,
+ "amazon-pay": $fa-var-amazon-pay,
+ "square-github": $fa-var-square-github,
+ "github-square": $fa-var-github-square,
+ "stumbleupon": $fa-var-stumbleupon,
+ "fedex": $fa-var-fedex,
+ "phoenix-framework": $fa-var-phoenix-framework,
+ "shopify": $fa-var-shopify,
+ "neos": $fa-var-neos,
+ "square-threads": $fa-var-square-threads,
+ "hackerrank": $fa-var-hackerrank,
+ "researchgate": $fa-var-researchgate,
+ "swift": $fa-var-swift,
+ "angular": $fa-var-angular,
+ "speakap": $fa-var-speakap,
+ "angrycreative": $fa-var-angrycreative,
+ "y-combinator": $fa-var-y-combinator,
+ "empire": $fa-var-empire,
+ "envira": $fa-var-envira,
+ "google-scholar": $fa-var-google-scholar,
+ "square-gitlab": $fa-var-square-gitlab,
+ "gitlab-square": $fa-var-gitlab-square,
+ "studiovinari": $fa-var-studiovinari,
+ "pied-piper": $fa-var-pied-piper,
+ "wordpress": $fa-var-wordpress,
+ "product-hunt": $fa-var-product-hunt,
+ "firefox": $fa-var-firefox,
+ "linode": $fa-var-linode,
+ "goodreads": $fa-var-goodreads,
+ "square-odnoklassniki": $fa-var-square-odnoklassniki,
+ "odnoklassniki-square": $fa-var-odnoklassniki-square,
+ "jsfiddle": $fa-var-jsfiddle,
+ "sith": $fa-var-sith,
+ "themeisle": $fa-var-themeisle,
+ "page4": $fa-var-page4,
+ "hashnode": $fa-var-hashnode,
+ "react": $fa-var-react,
+ "cc-paypal": $fa-var-cc-paypal,
+ "squarespace": $fa-var-squarespace,
+ "cc-stripe": $fa-var-cc-stripe,
+ "creative-commons-share": $fa-var-creative-commons-share,
+ "bitcoin": $fa-var-bitcoin,
+ "keycdn": $fa-var-keycdn,
+ "opera": $fa-var-opera,
+ "itch-io": $fa-var-itch-io,
+ "umbraco": $fa-var-umbraco,
+ "galactic-senate": $fa-var-galactic-senate,
+ "ubuntu": $fa-var-ubuntu,
+ "draft2digital": $fa-var-draft2digital,
+ "stripe": $fa-var-stripe,
+ "houzz": $fa-var-houzz,
+ "gg": $fa-var-gg,
+ "dhl": $fa-var-dhl,
+ "square-pinterest": $fa-var-square-pinterest,
+ "pinterest-square": $fa-var-pinterest-square,
+ "xing": $fa-var-xing,
+ "blackberry": $fa-var-blackberry,
+ "creative-commons-pd": $fa-var-creative-commons-pd,
+ "playstation": $fa-var-playstation,
+ "quinscape": $fa-var-quinscape,
+ "less": $fa-var-less,
+ "blogger-b": $fa-var-blogger-b,
+ "opencart": $fa-var-opencart,
+ "vine": $fa-var-vine,
+ "signal-messenger": $fa-var-signal-messenger,
+ "paypal": $fa-var-paypal,
+ "gitlab": $fa-var-gitlab,
+ "typo3": $fa-var-typo3,
+ "reddit-alien": $fa-var-reddit-alien,
+ "yahoo": $fa-var-yahoo,
+ "dailymotion": $fa-var-dailymotion,
+ "affiliatetheme": $fa-var-affiliatetheme,
+ "pied-piper-pp": $fa-var-pied-piper-pp,
+ "bootstrap": $fa-var-bootstrap,
+ "odnoklassniki": $fa-var-odnoklassniki,
+ "nfc-symbol": $fa-var-nfc-symbol,
+ "mintbit": $fa-var-mintbit,
+ "ethereum": $fa-var-ethereum,
+ "speaker-deck": $fa-var-speaker-deck,
+ "creative-commons-nc-eu": $fa-var-creative-commons-nc-eu,
+ "patreon": $fa-var-patreon,
+ "avianex": $fa-var-avianex,
+ "ello": $fa-var-ello,
+ "gofore": $fa-var-gofore,
+ "bimobject": $fa-var-bimobject,
+ "brave-reverse": $fa-var-brave-reverse,
+ "facebook-f": $fa-var-facebook-f,
+ "square-google-plus": $fa-var-square-google-plus,
+ "google-plus-square": $fa-var-google-plus-square,
+ "mandalorian": $fa-var-mandalorian,
+ "first-order-alt": $fa-var-first-order-alt,
+ "osi": $fa-var-osi,
+ "google-wallet": $fa-var-google-wallet,
+ "d-and-d-beyond": $fa-var-d-and-d-beyond,
+ "periscope": $fa-var-periscope,
+ "fulcrum": $fa-var-fulcrum,
+ "cloudscale": $fa-var-cloudscale,
+ "forumbee": $fa-var-forumbee,
+ "mizuni": $fa-var-mizuni,
+ "schlix": $fa-var-schlix,
+ "square-xing": $fa-var-square-xing,
+ "xing-square": $fa-var-xing-square,
+ "bandcamp": $fa-var-bandcamp,
+ "wpforms": $fa-var-wpforms,
+ "cloudversify": $fa-var-cloudversify,
+ "usps": $fa-var-usps,
+ "megaport": $fa-var-megaport,
+ "magento": $fa-var-magento,
+ "spotify": $fa-var-spotify,
+ "optin-monster": $fa-var-optin-monster,
+ "fly": $fa-var-fly,
+ "aviato": $fa-var-aviato,
+ "itunes": $fa-var-itunes,
+ "cuttlefish": $fa-var-cuttlefish,
+ "blogger": $fa-var-blogger,
+ "flickr": $fa-var-flickr,
+ "viber": $fa-var-viber,
+ "soundcloud": $fa-var-soundcloud,
+ "digg": $fa-var-digg,
+ "tencent-weibo": $fa-var-tencent-weibo,
+ "letterboxd": $fa-var-letterboxd,
+ "symfony": $fa-var-symfony,
+ "maxcdn": $fa-var-maxcdn,
+ "etsy": $fa-var-etsy,
+ "facebook-messenger": $fa-var-facebook-messenger,
+ "audible": $fa-var-audible,
+ "think-peaks": $fa-var-think-peaks,
+ "bilibili": $fa-var-bilibili,
+ "erlang": $fa-var-erlang,
+ "x-twitter": $fa-var-x-twitter,
+ "cotton-bureau": $fa-var-cotton-bureau,
+ "dashcube": $fa-var-dashcube,
+ "42-group": $fa-var-42-group,
+ "innosoft": $fa-var-innosoft,
+ "stack-exchange": $fa-var-stack-exchange,
+ "elementor": $fa-var-elementor,
+ "square-pied-piper": $fa-var-square-pied-piper,
+ "pied-piper-square": $fa-var-pied-piper-square,
+ "creative-commons-nd": $fa-var-creative-commons-nd,
+ "palfed": $fa-var-palfed,
+ "superpowers": $fa-var-superpowers,
+ "resolving": $fa-var-resolving,
+ "xbox": $fa-var-xbox,
+ "searchengin": $fa-var-searchengin,
+ "tiktok": $fa-var-tiktok,
+ "square-facebook": $fa-var-square-facebook,
+ "facebook-square": $fa-var-facebook-square,
+ "renren": $fa-var-renren,
+ "linux": $fa-var-linux,
+ "glide": $fa-var-glide,
+ "linkedin": $fa-var-linkedin,
+ "hubspot": $fa-var-hubspot,
+ "deploydog": $fa-var-deploydog,
+ "twitch": $fa-var-twitch,
+ "ravelry": $fa-var-ravelry,
+ "mixer": $fa-var-mixer,
+ "square-lastfm": $fa-var-square-lastfm,
+ "lastfm-square": $fa-var-lastfm-square,
+ "vimeo": $fa-var-vimeo,
+ "mendeley": $fa-var-mendeley,
+ "uniregistry": $fa-var-uniregistry,
+ "figma": $fa-var-figma,
+ "creative-commons-remix": $fa-var-creative-commons-remix,
+ "cc-amazon-pay": $fa-var-cc-amazon-pay,
+ "dropbox": $fa-var-dropbox,
+ "instagram": $fa-var-instagram,
+ "cmplid": $fa-var-cmplid,
+ "upwork": $fa-var-upwork,
+ "facebook": $fa-var-facebook,
+ "gripfire": $fa-var-gripfire,
+ "jedi-order": $fa-var-jedi-order,
+ "uikit": $fa-var-uikit,
+ "fort-awesome-alt": $fa-var-fort-awesome-alt,
+ "phabricator": $fa-var-phabricator,
+ "ussunnah": $fa-var-ussunnah,
+ "earlybirds": $fa-var-earlybirds,
+ "trade-federation": $fa-var-trade-federation,
+ "autoprefixer": $fa-var-autoprefixer,
+ "whatsapp": $fa-var-whatsapp,
+ "slideshare": $fa-var-slideshare,
+ "google-play": $fa-var-google-play,
+ "viadeo": $fa-var-viadeo,
+ "line": $fa-var-line,
+ "google-drive": $fa-var-google-drive,
+ "servicestack": $fa-var-servicestack,
+ "simplybuilt": $fa-var-simplybuilt,
+ "bitbucket": $fa-var-bitbucket,
+ "imdb": $fa-var-imdb,
+ "deezer": $fa-var-deezer,
+ "raspberry-pi": $fa-var-raspberry-pi,
+ "jira": $fa-var-jira,
+ "docker": $fa-var-docker,
+ "screenpal": $fa-var-screenpal,
+ "bluetooth": $fa-var-bluetooth,
+ "gitter": $fa-var-gitter,
+ "d-and-d": $fa-var-d-and-d,
+ "microblog": $fa-var-microblog,
+ "cc-diners-club": $fa-var-cc-diners-club,
+ "gg-circle": $fa-var-gg-circle,
+ "pied-piper-hat": $fa-var-pied-piper-hat,
+ "kickstarter-k": $fa-var-kickstarter-k,
+ "yandex": $fa-var-yandex,
+ "readme": $fa-var-readme,
+ "html5": $fa-var-html5,
+ "sellsy": $fa-var-sellsy,
+ "sass": $fa-var-sass,
+ "wirsindhandwerk": $fa-var-wirsindhandwerk,
+ "wsh": $fa-var-wsh,
+ "buromobelexperte": $fa-var-buromobelexperte,
+ "salesforce": $fa-var-salesforce,
+ "octopus-deploy": $fa-var-octopus-deploy,
+ "medapps": $fa-var-medapps,
+ "ns8": $fa-var-ns8,
+ "pinterest-p": $fa-var-pinterest-p,
+ "apper": $fa-var-apper,
+ "fort-awesome": $fa-var-fort-awesome,
+ "waze": $fa-var-waze,
+ "cc-jcb": $fa-var-cc-jcb,
+ "snapchat": $fa-var-snapchat,
+ "snapchat-ghost": $fa-var-snapchat-ghost,
+ "fantasy-flight-games": $fa-var-fantasy-flight-games,
+ "rust": $fa-var-rust,
+ "wix": $fa-var-wix,
+ "square-behance": $fa-var-square-behance,
+ "behance-square": $fa-var-behance-square,
+ "supple": $fa-var-supple,
+ "webflow": $fa-var-webflow,
+ "rebel": $fa-var-rebel,
+ "css3": $fa-var-css3,
+ "staylinked": $fa-var-staylinked,
+ "kaggle": $fa-var-kaggle,
+ "space-awesome": $fa-var-space-awesome,
+ "deviantart": $fa-var-deviantart,
+ "cpanel": $fa-var-cpanel,
+ "goodreads-g": $fa-var-goodreads-g,
+ "square-git": $fa-var-square-git,
+ "git-square": $fa-var-git-square,
+ "square-tumblr": $fa-var-square-tumblr,
+ "tumblr-square": $fa-var-tumblr-square,
+ "trello": $fa-var-trello,
+ "creative-commons-nc-jp": $fa-var-creative-commons-nc-jp,
+ "get-pocket": $fa-var-get-pocket,
+ "perbyte": $fa-var-perbyte,
+ "grunt": $fa-var-grunt,
+ "weebly": $fa-var-weebly,
+ "connectdevelop": $fa-var-connectdevelop,
+ "leanpub": $fa-var-leanpub,
+ "black-tie": $fa-var-black-tie,
+ "themeco": $fa-var-themeco,
+ "python": $fa-var-python,
+ "android": $fa-var-android,
+ "bots": $fa-var-bots,
+ "free-code-camp": $fa-var-free-code-camp,
+ "hornbill": $fa-var-hornbill,
+ "js": $fa-var-js,
+ "ideal": $fa-var-ideal,
+ "git": $fa-var-git,
+ "dev": $fa-var-dev,
+ "sketch": $fa-var-sketch,
+ "yandex-international": $fa-var-yandex-international,
+ "cc-amex": $fa-var-cc-amex,
+ "uber": $fa-var-uber,
+ "github": $fa-var-github,
+ "php": $fa-var-php,
+ "alipay": $fa-var-alipay,
+ "youtube": $fa-var-youtube,
+ "skyatlas": $fa-var-skyatlas,
+ "firefox-browser": $fa-var-firefox-browser,
+ "replyd": $fa-var-replyd,
+ "suse": $fa-var-suse,
+ "jenkins": $fa-var-jenkins,
+ "twitter": $fa-var-twitter,
+ "rockrms": $fa-var-rockrms,
+ "pinterest": $fa-var-pinterest,
+ "buffer": $fa-var-buffer,
+ "npm": $fa-var-npm,
+ "yammer": $fa-var-yammer,
+ "btc": $fa-var-btc,
+ "dribbble": $fa-var-dribbble,
+ "stumbleupon-circle": $fa-var-stumbleupon-circle,
+ "internet-explorer": $fa-var-internet-explorer,
+ "stubber": $fa-var-stubber,
+ "telegram": $fa-var-telegram,
+ "telegram-plane": $fa-var-telegram-plane,
+ "old-republic": $fa-var-old-republic,
+ "odysee": $fa-var-odysee,
+ "square-whatsapp": $fa-var-square-whatsapp,
+ "whatsapp-square": $fa-var-whatsapp-square,
+ "node-js": $fa-var-node-js,
+ "edge-legacy": $fa-var-edge-legacy,
+ "slack": $fa-var-slack,
+ "slack-hash": $fa-var-slack-hash,
+ "medrt": $fa-var-medrt,
+ "usb": $fa-var-usb,
+ "tumblr": $fa-var-tumblr,
+ "vaadin": $fa-var-vaadin,
+ "quora": $fa-var-quora,
+ "square-x-twitter": $fa-var-square-x-twitter,
+ "reacteurope": $fa-var-reacteurope,
+ "medium": $fa-var-medium,
+ "medium-m": $fa-var-medium-m,
+ "amilia": $fa-var-amilia,
+ "mixcloud": $fa-var-mixcloud,
+ "flipboard": $fa-var-flipboard,
+ "viacoin": $fa-var-viacoin,
+ "critical-role": $fa-var-critical-role,
+ "sitrox": $fa-var-sitrox,
+ "discourse": $fa-var-discourse,
+ "joomla": $fa-var-joomla,
+ "mastodon": $fa-var-mastodon,
+ "airbnb": $fa-var-airbnb,
+ "wolf-pack-battalion": $fa-var-wolf-pack-battalion,
+ "buy-n-large": $fa-var-buy-n-large,
+ "gulp": $fa-var-gulp,
+ "creative-commons-sampling-plus": $fa-var-creative-commons-sampling-plus,
+ "strava": $fa-var-strava,
+ "ember": $fa-var-ember,
+ "canadian-maple-leaf": $fa-var-canadian-maple-leaf,
+ "teamspeak": $fa-var-teamspeak,
+ "pushed": $fa-var-pushed,
+ "wordpress-simple": $fa-var-wordpress-simple,
+ "nutritionix": $fa-var-nutritionix,
+ "wodu": $fa-var-wodu,
+ "google-pay": $fa-var-google-pay,
+ "intercom": $fa-var-intercom,
+ "zhihu": $fa-var-zhihu,
+ "korvue": $fa-var-korvue,
+ "pix": $fa-var-pix,
+ "steam-symbol": $fa-var-steam-symbol,
+);
diff --git a/_scss/font-awesome/brands.scss b/_scss/font-awesome/brands.scss
new file mode 100644
index 0000000000000000000000000000000000000000..01fb4c623f3914f1f35409beabd79187662ff1eb
--- /dev/null
+++ b/_scss/font-awesome/brands.scss
@@ -0,0 +1,30 @@
+/*!
+ * Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */
+@import 'functions';
+@import 'variables';
+
+:root, :host {
+ --#{$fa-css-prefix}-style-family-brands: 'Font Awesome 6 Brands';
+ --#{$fa-css-prefix}-font-brands: normal 400 1em/1 'Font Awesome 6 Brands';
+}
+
+@font-face {
+ font-family: 'Font Awesome 6 Brands';
+ font-style: normal;
+ font-weight: 400;
+ font-display: $fa-font-display;
+ src: url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype');
+}
+
+.fab,
+.#{$fa-css-prefix}-brands {
+ font-weight: 400;
+}
+
+@each $name, $icon in $fa-brand-icons {
+ .#{$fa-css-prefix}-#{$name}:before { content: unquote("\"#{ $icon }\""); }
+}
diff --git a/_scss/font-awesome/fontawesome.scss b/_scss/font-awesome/fontawesome.scss
new file mode 100644
index 0000000000000000000000000000000000000000..61541e368d83d80710855f44d086c3bb3306cd65
--- /dev/null
+++ b/_scss/font-awesome/fontawesome.scss
@@ -0,0 +1,21 @@
+/*!
+ * Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */
+// Font Awesome core compile (Web Fonts-based)
+// -------------------------
+
+@import 'functions';
+@import 'variables';
+@import 'mixins';
+@import 'core';
+@import 'sizing';
+@import 'fixed-width';
+@import 'list';
+@import 'bordered-pulled';
+@import 'animated';
+@import 'rotated-flipped';
+@import 'stacked';
+@import 'icons';
+@import 'screen-reader';
diff --git a/_scss/font-awesome/regular.scss b/_scss/font-awesome/regular.scss
new file mode 100644
index 0000000000000000000000000000000000000000..f48ff6cdf569e6c05a0da504d9bbb26c253f2e28
--- /dev/null
+++ b/_scss/font-awesome/regular.scss
@@ -0,0 +1,26 @@
+/*!
+ * Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */
+@import 'functions';
+@import 'variables';
+
+:root, :host {
+ --#{$fa-css-prefix}-style-family-classic: '#{ $fa-style-family }';
+ --#{$fa-css-prefix}-font-regular: normal 400 1em/1 '#{ $fa-style-family }';
+}
+
+@font-face {
+ font-family: 'Font Awesome 6 Free';
+ font-style: normal;
+ font-weight: 400;
+ font-display: $fa-font-display;
+ src: url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype');
+}
+
+.far,
+.#{$fa-css-prefix}-regular {
+ font-weight: 400;
+}
diff --git a/_scss/font-awesome/solid.scss b/_scss/font-awesome/solid.scss
new file mode 100644
index 0000000000000000000000000000000000000000..91672f9e11015e5e5b1dc969e95b0357c8fb1c93
--- /dev/null
+++ b/_scss/font-awesome/solid.scss
@@ -0,0 +1,26 @@
+/*!
+ * Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */
+@import 'functions';
+@import 'variables';
+
+:root, :host {
+ --#{$fa-css-prefix}-style-family-classic: '#{ $fa-style-family }';
+ --#{$fa-css-prefix}-font-solid: normal 900 1em/1 '#{ $fa-style-family }';
+}
+
+@font-face {
+ font-family: 'Font Awesome 6 Free';
+ font-style: normal;
+ font-weight: 900;
+ font-display: $fa-font-display;
+ src: url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
+ url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype');
+}
+
+.fas,
+.#{$fa-css-prefix}-solid {
+ font-weight: 900;
+}
diff --git a/_scss/font-awesome/v4-shims.scss b/_scss/font-awesome/v4-shims.scss
new file mode 100644
index 0000000000000000000000000000000000000000..263b16ef70cad7f03aa21fe7821ea4ac2d1225e8
--- /dev/null
+++ b/_scss/font-awesome/v4-shims.scss
@@ -0,0 +1,11 @@
+/*!
+ * Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */
+// V4 shims compile (Web Fonts-based)
+// -------------------------
+
+@import 'functions';
+@import 'variables';
+@import 'shims';
diff --git a/_scss/type-on-strap.scss b/_scss/type-on-strap.scss
new file mode 100644
index 0000000000000000000000000000000000000000..9cc55928bb581dbcbbdafbc4035a66e4f59ac496
--- /dev/null
+++ b/_scss/type-on-strap.scss
@@ -0,0 +1,8 @@
+/* TYPE_ON_STRAP Main style sheet */
+
+/* External */
+// CSS from external sources
+@import 'external/font-awesome';
+
+// Other files ...
+
diff --git a/assets/css/my-remark.scss b/assets/css/my-remark.scss
index c1c87b87ca08fd55a0be5425de19490c73c4c15f..a3075109a32fc51c9bbdfce9df2607ab6d4cc8c9 100644
--- a/assets/css/my-remark.scss
+++ b/assets/css/my-remark.scss
@@ -4,13 +4,13 @@
$fa-font-path: "../fonts/font-awesome/";
@import 'fontawesome.all.min.css';
@import "remark-base";
-$body-font: 22pt;
+$body-font: 24pt;
$h2-font: 30pt;
-$list-font: 20pt;
-$code-font: 18pt;
-$mediumsmall-font: 16pt;
+$list-font: 22pt;
+$code-font: 20pt;
+$mediumsmall-font: 18pt;
$title-font: 28pt;
-$footnote-font: 12pt;
+$footnote-font: 18pt;
$blue: #0066ff;
$lightblue: #39d;
$lightgreen: #2c7;
@@ -216,7 +216,6 @@ blockquote p {
display: inline;
}
-
.inverse {
background: $dark;
color: $medium;
@@ -482,7 +481,7 @@ html.remark-container, body.remark-container {
}
.remark-container:-webkit-full-screen {
width: 100%;
- height: 100%;
+ height:100%;
}
diff --git a/assets/css/site.scss b/assets/css/site.scss
index daeb3662b51f2e40102cca4d97d09a61321fa48d..d213f690c4d8145ee344aaf18f85a3926f65792a 100644
--- a/assets/css/site.scss
+++ b/assets/css/site.scss
@@ -3,9 +3,7 @@
---
@charset "utf-8";
-$fa-font-path: "../fonts/font-awesome/";
-@import 'fontawesome.all.min.css';
-@import "{{site.theme}}";
+@import 'font-awesome/font-awesome';
$font-size-base: 1rem;
$headings-font-weight: 500;
@@ -15,4 +13,4 @@ $icon-font-path: "{{ site.github.url }}/assets/fonts/bootstrap";
@import "bootstrap/bootstrap";
-
+@import "jekyll-theme-cayman";
diff --git a/assets/css/style.scss b/assets/css/style.scss
index db55c486301b593afb091c6da5a08c0f0f4fe80e..b2ea545433d228be4777bbf633b8dff614021e9b 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -19,6 +19,10 @@ $activity-color: #f0f4f2;
$highlight-darkest: #660000;
$white: white;
+html {
+ scroll-padding-top: 4rem;
+}
+
details {
summary {
font-weight:bold;
@@ -26,10 +30,29 @@ details {
background-color: $background;
color: $dark-color;
padding:5px;
+ list-style: none;
}
padding:1em;
}
+h1 {
+ font-weight: 1.2em
+}
+
+summary::-webkit-details-marker {
+ display: none
+}
+
+summary::before {
+ content: '+ ';
+}
+
+details[open] summary:before {
+ content: "- ";
+}
+
+
+
a {
color: $link-color;
text-decoration: underline;
@@ -120,9 +143,30 @@ h1.week{
background-image: linear-gradient(to right, $gradient-dark, $gradient-dark, $gradient-light);
color: $white;
padding:5px;
- font-size: 1.8em;
+ font-size: 1.2em;
+}
+
+
+h2.homework {
+ style:bold;
+ font-size: large;
+ background-color: $activity-color;
+ color: $dark-color;
+ padding:5px;
+ margin-top: 1em !important;
+}
+
+
+h2.topic{
+ style:bold;
+ font-size: large;
+ background-color: $topic-color;
+ color: $dark-color;
+ padding:5px;
+ margin-top: 1em !important;
}
+
dl dt.lecture {
style:bold;
font-size: large;
@@ -132,14 +176,15 @@ dl dt.lecture {
margin-top: 1em !important;
}
+// dl dt.homework::before {
+// font-family: FontAwesome;
+// font-size: 1.2em;
+// content: "\e066";
+// float: left;
+// margin-right: 0.4em;
+// }
+
dl dt.homework {
- &::before {
- font-family: FontAwesome;
- font-size: 1.2em;
- content: "\e066";
- float: left;
- margin-right: 0.4em;
- }
style:bold;
font-size: large;
background-color: $activity-color;
@@ -204,6 +249,15 @@ h2 {
font-size: larger;
}
+h3 {
+ font-size: large;
+}
+
+h4 {
+ font-size: large;
+ font-style: italic;
+}
+
h2.holiday {
style:bold;
font-size: large;
@@ -322,7 +376,12 @@ table.schedule tfoot td {
padding-bottom: 1rem;
}
+.project-name {
+ font-size: 2rem;
+}
+
.project-tagline {
+ font-size: 1.5rem;
padding-bottom: 1rem;
margin-bottom: 1rem;
}
diff --git a/assets/fonts/font-awesome/fa-brands-400.ttf b/assets/fonts/font-awesome/fa-brands-400.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..5efb1d4f96407d7019631b361b571ea454f6ce09
Binary files /dev/null and b/assets/fonts/font-awesome/fa-brands-400.ttf differ
diff --git a/assets/fonts/font-awesome/fa-brands-400.woff2 b/assets/fonts/font-awesome/fa-brands-400.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..36fbda7d334c3ecea7fc1c378c84bd9b3e4d9be4
Binary files /dev/null and b/assets/fonts/font-awesome/fa-brands-400.woff2 differ
diff --git a/assets/fonts/font-awesome/fa-regular-400.ttf b/assets/fonts/font-awesome/fa-regular-400.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..838b4e2cfec1735771f6a237c7b28d6be5f62bfc
Binary files /dev/null and b/assets/fonts/font-awesome/fa-regular-400.ttf differ
diff --git a/assets/fonts/font-awesome/fa-regular-400.woff2 b/assets/fonts/font-awesome/fa-regular-400.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..b6cabbacb67f4ac88248ef235c5d7a5361f7003b
Binary files /dev/null and b/assets/fonts/font-awesome/fa-regular-400.woff2 differ
diff --git a/assets/fonts/font-awesome/fa-solid-900.ttf b/assets/fonts/font-awesome/fa-solid-900.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..ec24749db906da77229dcecd61d37b6489d02140
Binary files /dev/null and b/assets/fonts/font-awesome/fa-solid-900.ttf differ
diff --git a/assets/fonts/font-awesome/fa-solid-900.woff2 b/assets/fonts/font-awesome/fa-solid-900.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..824d518eb4cbbd1fc837dcac2ccad718119d1ac9
Binary files /dev/null and b/assets/fonts/font-awesome/fa-solid-900.woff2 differ
diff --git a/assets/fonts/font-awesome/fa-v4compatibility.ttf b/assets/fonts/font-awesome/fa-v4compatibility.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..b175aa8ece8b1881ed7a23ec6ee6db6ad6b7cd94
Binary files /dev/null and b/assets/fonts/font-awesome/fa-v4compatibility.ttf differ
diff --git a/assets/fonts/font-awesome/fa-v4compatibility.woff2 b/assets/fonts/font-awesome/fa-v4compatibility.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..e09b5a55009f8a66dbd08af7e1a314d7f5afaa25
Binary files /dev/null and b/assets/fonts/font-awesome/fa-v4compatibility.woff2 differ
diff --git a/assets/img/staff/desai.jpg b/assets/img/staff/desai.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..e7d39a04bedf3afb1ba72412ef18ff7f41614874
Binary files /dev/null and b/assets/img/staff/desai.jpg differ
diff --git a/assignments/ai.md b/assignments/ai.md
new file mode 100644
index 0000000000000000000000000000000000000000..7487391041774f8deba7ebb698e7562a24007c27
--- /dev/null
+++ b/assignments/ai.md
@@ -0,0 +1,64 @@
+---
+layout: assignment
+published: true
+
+title: Benchmarking AI Ableism
+revised: 3/23/2024
+
+objective: Learn about benchmarking in AI
+
+---
+# Overview
+
+The goal of this assignment is to investigate ableism in a generative AI model. It will also give you a chance to learn about best practices for benchmarking
+
+## Learning Goals / Competencies
+This homework will contribute to your competency grade on
+- Accessible document/presentation creation
+
+It may also contribute to your competencies on
+- Finding First Person Accounts of Accessibility Tech
+- Familiarity with a range of accessibility technologies
+- Image description
+
+# Basic Requirements for Project
+
+Your goal in this project is to create a set of benchmarks, and test them, on a generative AI platform of your choice.
+
+## Preparation
+Two recent papers have conducted benchmarking tasks. You may find it valuable to read them.
+
+The first paper is a study of ableism in resume ranking titled ["Identifying and Improving Disability Bias in GAI-Based Resume Screening"](https://arxiv.org/abs/2402.01732). The primary method used was to ask GPT to rank two almost identical resumes, and then explain its ranking. Qualitative and quantatative analyses were conducted on the results.
+
+The second paper is called ["'They only care to show us the wheelchair': disability representation in text-to-image AI models"](https://drive.google.com/file/d/1Fys0pKsAFqN9zY8LcxxL2lTUmn01xU73/view?usp=sharing). The authors developed a series of prompts that they provided to generate images from text, and then showed those images to disabled participants to gather qualitative responses to those images.
+
+# Details
+
+To complete this assignment you will need to do the following (we hope to accomplish some of this in small groups in class)
+
+## 0. Pick a GAI and a task
+You will need to pick a domain in which to develop your benchmark. For example, the task could be generating images of disabled people, generating stories that include disabled characters, generating ALT text of images that have disabled people in them, and so on. Try to find a first person account of someone with a disability using the GAI for that task.
+
+## 1. Search for known examples of human ableism in this domain
+It is likely that GAI ableism will reproduce human ableism, which is likely documented somewhere. For example, there are articles about [ableism visual representations of disabled people](https://mythcreants.com/blog/five-common-harmful-representations-of-disability/); [ableist tropes in fiction](https://bookriot.com/ableist-tropes-in-fiction/) and [problematic language in descirptions of disabled people](https://ncdj.org/style-guide/).
+
+## 2. Develop prompts that are likely to elicit ableism
+Based on one or more of the resources and if relevant your own experiences, develop a series of prompts that can be used to test ableism in GAI
+
+## 3. Collect data on these prompts and analyze it
+This is somewhat open ended. You could compare the same prompts with and without disability, or just do a bottom up coding of the results of the prompting for example
+
+## 4. Reflect on what you learned
+
+Write a 1 page reflection telling us about
+- What the GAI you chose does.
+- What task you used it for, and what are the strengths and weaknesses of the GAI for that task from the perspective of a disabled person (ideally informed by a first person account)
+- What background research you did on possible sources of ableism
+- What prompts you used
+- What you found
+- An appendix with example data you generated
+- An appendix with a list of the [competencies](index.html#competencies) you wish to be assessed on, if any, beyond the required Accessible Document/Presentation creation. For example, if you include an image, should should describe it and we will assess Image Descriptions. If you find a first person account, you could include a link to the first person account and also meet the requirements for familiar with a range of AT by adding an appendix describing the range of users and strengths and weaknesses of the AT.
+
+# Hand in
+
+Turn your writeup in on [Canvas]({{site.canvas}})
diff --git a/assignments/fabricating.md b/assignments/fabricating.md
new file mode 100644
index 0000000000000000000000000000000000000000..5763394e4846533a993571565eff8241ff051529
--- /dev/null
+++ b/assignments/fabricating.md
@@ -0,0 +1,87 @@
+---
+layout: assignment
+published: true
+
+title: Fabricated Accessibility
+revised: 3/23/2024
+
+objective: Learn about physical computing & fabrication
+
+---
+# Overview
+
+The goal of this assignment is to learn about fabrication technology and their value in designing physical accessibility aids.
+
+## Learning Goals / Competencies
+This homework will contribute to your competency grade on
+- Accessible document presentation/creation
+- Image description
+- Disability model analysis
+
+It may contribute to other competencies depending on how you approach it.
+
+# Basic Requirements for Project
+Your goal in this project is to select a fabrication technology, learn about how it is being used to slove accessibility problems, and create a fabricated accessibility technology using that technology. There is a great deal of flexibility in what fabrication approach you use. You could, for example, use knitting (hand or machine), laser cutting (with a variety of possible hard and soft material choices), or 3D printing, among others.
+
+## Preparation
+Several papers have talked about different uses of fabrication for accessibility including the following.
+- (3D printing and lesercutting) [Sharing is Caring: Assistive Technology Designs on Thingiverse](https://doi.org/10.1145/2702123.2702525), CHI 2015
+- (3D printing) [Reprise: A Design Tool for Specifying, Generating, and Customizing 3D Printable Adaptations on Everyday Objects](https://doi.org/10.1145/2984511.2984512), UIST 2016
+- (Knitting) [Stitching Together the Experiences of Disabled Knitters](https://doi.org/10.1145/3411764.3445521), CHI 2021
+- (3D printing) [The Global Care Ecosystems of 3D Printed Assistive Devices](https://dl.acm.org/doi/10.1145/3537676), TACCESS 2022
+
+In addition, there is beginning to be a literature around making fabrication more accessible, particulary to people who are blind or visually impaired (BVI) including the following.
+- (laser cutting) [Daedalus in the Dark: Designing for Non-Visual Accessible Construction of Laser-Cut Architecture](https://dl.acm.org/doi/abs/10.1145/3472749.3474754?casa_token=qcWkLOy0lOUAAAAA:vQt3CFQJ7aUZDiNms5kzS6DY1jWa_hrbIr1LyZckdEg-v68L4SS8iyI8V4Sr1OE5x3h6zssZkSvm2oo), UIST 2021
+- (soldering) [Putting tools in hands: Designing curriculum for a nonvisual soldering workshop](https://dl.acm.org/doi/pdf/10.1145/3373625.3418011)
+
+You may find it valuable to read them.
+
+# Details
+
+To complete this assignment you will need to do the following (we hope some of this will take place in class)
+
+## 0. Find one or more examples of an accessibility support or accessible object you want to fabricate
+There are there ways you might use fabrication in this project
+1. **Access technology**: You might use fabrication to support an accessibility need, such as making something easier to grasp or manipulate
+2. **Access technology modification**: You might use fabrication to make an existing accessibility support object more aesthetically appealing or functional. For example, you might make a beautiful "skin" to decorate a cane.
+3. **Everyday technology modification**: You might use fabrication to make an make a task or object that is not accessible more accessible. For example, you might create a sweater that does not bunch up or catch in the wheels when seated in a wheelchair.
+
+You should search for examples of aids on places such as thingiverse, ravelry, and so on. You may also look on amazon or other sites that sell accessibility products but do not include open sourced fabricatable patterns for them. You may also use ideas drawn from the [slides we presented in class](../slides/3dprinting.html).
+
+{% details Example Objects for Inspiration %}
+Some examples of things that one can laser cut which serve an accessibility purpose
+- A [cookbook, or book, stand](https://bookriot.com/accessories-for-accessible-reading/)
+- **A pillbox** - make with [boxes.py](https://www.festi.info/boxes.py/)
+- A **one handed cutting board** with edges and pins to hold things in place
+- A [jar opener](https://www.thingiverse.com/thing:40131) and another [jar opener](https://www.thingiverse.com/thing:2801157)
+- [iPad keyguard](https://www.thingiverse.com/thing:1365497)
+- [Key handle](https://www.thingiverse.com/thing:2802082)
+- [Bag holder](https://www.instructables.com/Making-a-laser-cut-bag-holder/)
+- Something to [hold a book open](https://www.etsy.com/listing/883330413/book-buddy-book-holder-wood-thumb-page)
+- [Fidget spinners](https://www.instructables.com/Laser-Cut-MDF-Fidget-Spinner/)
+{% enddetails %}
+
+## 1. Manufacture it
+1. Make it your own: Create a model or a pattern from scratch, or personalize the object you found in some way.
+2. Create a low cost prototype: Create a low-cost prototype (such as printing it on paper) to double check it
+3. Fabricate it
+4. "Finish" it (i.e. sand and/or assemble your object
+
+## 2. Reflect on what you learned
+
+<!-- - Create a Ravelry, Thingiverse or Instructables page for your project with a brief description of the project, a video, the model or pattern used for fabrication, any a similar technology in a paper, product site, or open source repository that you based it on, and the final project. -->
+- Write a 1 page reflection
+ <!-- - Include a link to your external page -->
+ - Analyzing what you created using positive disability principles (or specify if a principle doesn't apply)
+ 1. Is it ableist
+ 2. What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?)
+ 3. Are people with disabilities engaged in guiding this work? At what stages?
+ 4. Is it being used to give control and improve agency for people with disabilities
+ 5. Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)
+ - What are three things you learned from the manufacturing and finishing process?
+ - An appendix with your model or pattern, a picture of your prototype, and a picture of your final manufactured object.
+ - An appendix with a list of the competencies you wish to be assessed on other than Accessible document presentation/creation; Image description; and Disability model analysis, and any additional information needed to be assessed (as specified in [the competencies](index.html#competencies)). For example, if you find a first person account, you could include a link to the first person account and also meet the requirements for familiar with a range of AT by adding an appendix describing the range of users and strengths and weaknesses of the AT.
+
+# Hand in
+
+Turn your writeup in on [Canvas]({{site.canvas}})
diff --git a/assignments/finding-accessibility.md b/assignments/finding-accessibility.md
index 4ec3654a5854e9ec6d113ff391ff514d7fd3ef36..376c95a24cd246595fdad866fb22a7866e9eb95e 100644
--- a/assignments/finding-accessibility.md
+++ b/assignments/finding-accessibility.md
@@ -4,13 +4,7 @@ published: true
title: AT Around Us
description: Find and learn about how people with disabilities use a variety of accessibility technologies
-code: hw1
-
-assigned: September 28th, 2023
-due: Slides October 3, 2023, (2 day grace period October 5th); Presentation October 6, 2023 (no grace period, class presentations )
-
-revised: September 28, 2023
-
+revised: 3/22/2024
---
* TOC
@@ -24,30 +18,29 @@ The goal of this assignment is to give you experience with seeking out first-per
## Learning Goals/ Competencies
This homework may contribute to your competency grade on
-- Accessible presentation creation
+- Accessible document/presentation creation
- Finding first person accounts by and for people with disabilities
- Image description
-- Presenting accessibly to an audience with mixed disabilities
-- Familiarity with a range of accessibility technologies (requires being present and engaged with student presentations)
-- Your participation grade, as a percentage of completeness (are all the required parts present)
+- Presenting accessibly
+- Familiarity with a range of accessibility technologies
## Length and Difficulty
-Students in the past have reported that this assignment takes an median of 4 hours (mode=3). However, in our experience many students have had to make multiple attempts to fully meet the competency for finding first person accounts. We recommend you carefully read the requirements for that below, and check in if you have a question. Many students also found presenting accessibly difficult, particularly with respect to how to describe images on their slides. We recommend that you practice this ahead of time.
+Students in the past have reported that this assignment takes about 3 hours. However, in our experience many students have had to make multiple attempts to fully meet the competency for finding first person accounts. We recommend you carefully read the requirements for that below, and check in if you have a question. Many students also found presenting accessibly difficult, particularly with respect to how to describe images on their slides. We recommend that you practice this ahead of time.
Some things students have told us about this assignment:
- "I like the requirement of looking at real world tools or tech, expanding beyond the computer."
- "I enjoy doing this because I watched a few videos and learned a lot of accessibility technology tools [and why we have them]."
- "It was surprisingly difficult to find first-person accounts for the tech I chose."
## Example
-An example can be found at the start of the [slide deck]({{site.discussion}}/3515497) that you will add your slide to.
+An example can be found at the start of the slide deck (posted on [the class discussion board]({{site.discussion}})) that you will add your slide to.
## Assignment FAQ
-### I know somebody who uses AT for their accessibility needs. Does talking to them count as finding a first person account?
+### I know or interviewed somebody who uses AT for their accessibility needs. Does talking to them count as finding a first person account?
-yes, this counts as a first-person account. As for citing sources in that situation, best effort to help us understand that you actually talked to the user would be very helpful. If you were to submit a note or video testimony from them (this not required), we will ensure at most privacy to not share it outside of class. Nothing that is not in the slide will be shared with the class.
+Yes, this counts as a first-person account, but not for this assignment unless you are able to submit a transcript or video testimony for us to review (unlikely under IRB rules).
-### Does asking an other student in this class who may use AT count as first person response?
+### Does asking an other student or TA in this class who may use AT count as first person response?
No. This does not count as a first-person account. It is additional burden on the student who you are asking to help out in this capacity.
@@ -88,25 +81,25 @@ In addition, you should pick something that *expands your knowledge of accessibi
Find first person accounts *by a person with a disability* that is *not an advertisement* describing each technology and how they use it. A first person account is written or presented by someone who
- Uses this technology themselves on a regular basis
-- has a disability
+- Has a disability
A first person account that meets the requirements of this assignment is not
-- a teaching video/presentation
-- an advertisement
-- based on your personal experience
-- based on experiences of your peers or the course staff
+- A teaching video/presentation
+- An advertisement
+- Based on your personal experience
+- Based on experiences of your peers or the course staff
For example, here is a [personal perspective on audio crosswalks](https://www.youtube.com/watch?v=xPlsYhU1HBU) and here is an interview with two black AAC users about their experiences using AAC technology (start at 00:16:00)
<iframe width="560" height="315" src="https://www.youtube.com/embed/iTSAK4yRf5A" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
-Ideally, you will find a video account showing the technology in use. Try searching for "howto" or try searching first for vloggers who have a disability, and then looking in their channels for technology reviews. Also ask for help on our [discussion site]({{site.discussion}}) if you are having trouble. If you cannot find a video, you can look for a written account, such as a blog or review. In this case, it still needs to be written by a person with a disability who would benefit from the AT that you are trying to learn about. This may influence your choice of technologies, it is OK to iterate.
+Ideally, you will find a video account showing the technology in use. Try searching for "howto" or try searching first for vloggers who have a disability, and then looking in their channels for technology reviews. Also ask for help on our [class discussion site]({{site.discussion}}) if you are having trouble. If you cannot find a video, you can look for a written account, such as a blog or review. In this case, it still needs to be written by a person with a disability who would benefit from the AT that you are trying to learn about. This may influence your choice of technologies, it is OK to iterate.
## 3. Try it yourself
While some technologies may be expensive or hard to get, many accessibility technologies are easily available and some are even re-purposed everyday items. Try at least one of the technologies you find yourself.
-## 3. Reflect on What you Learned
+## 3. Reflect on what you learned
Take some time to reflect on these questions, which will help you to prepare for your presentation
@@ -131,13 +124,22 @@ You will create one accessible slide (per AT) in a shared slide deck posted in t
- Information about its audience (range of disabilities that use it)
- A picture of it
- A link to the first person account you found
-- Something you learned from the video and/or by trying it, about its strengths and weaknesses
+- Something you learned from the first person account about its strengths and weaknesses
+
+## 5. Create a reflection for Canvas containing
-Make sure the slides are accessible.
+1. A list of the competencies you wish to be assessed on. Your choices are
+ - Accessible presentation creation
+ - Finding first person accounts by and for people with disabilities
+ - Image description
+ - Presenting accessibly
+ - Familiarity with a range of accessibility technologies
+2. A brief reflection on what you learned by trying the technology and how your experience differed from that in the first person account
# Turnin
-1. You will turn the slide in by adding it to the shared slide deck
-2. You will also present at one of those slides in class. You should be prepared to
+1. Turn the slides in by adding them to the shared slide deck
+2. On Canvas, turn in your list of competencies and reflection
+3. You will also present at one of those slides in class. You should be prepared to
- Stay on time (3-4 minutes + 1-2 minutes of questions). This will require you to pick and choose what to focus on when you design your slide, and to practice ahead of class.
- Present accessibly (you may want to revisit [presenting accessible](https://www.youtube.com/watch?v=L9TxhGv91kc) by Kyle Rector)
diff --git a/assignments/index-ugrad.md b/assignments/index-ugrad.md
new file mode 100644
index 0000000000000000000000000000000000000000..38aa81ced1e0968f03a69e8a36a3ee42658feb96
--- /dev/null
+++ b/assignments/index-ugrad.md
@@ -0,0 +1,204 @@
+---
+layout: default
+title: Assignments
+description: Course assignments
+---
+
+* TOC
+{:toc}
+
+This class uses a combination of in class work, individual
+assignments, and one larger project. Students spend a majority of the
+class on a longer open ended final project that is more research
+oriented. All of the assignments will have some minimum required
+competencies (see the [syllabus]({{site.baseurl}}/index.html) and the
+section on [competencies](#competencies) below) and students may
+indicate a certain number of self-selected additional competencies
+they wish to be assessed on.
+
+
+# Short Required Assignments:
+
+1. [Finding AT Around Us](finding-accessibility.html): Students need to find first-person videos by
+ people with disabilities about their use of standard or cutting
+ edge AT technology, and then give an accessible presentation about
+ what they find.
+2. [Disability Justice](disabilityjustice.html): Analyize a reading using our model based approach
+2. [Laser Cut Accessibility](lasercutting.html): Laser cut an accessibility aid
+2. [Fabricating Accessibility](fabricating.html): Fabricate cut an accessibility aid
+3. [Research Paper Analysis](research-paper-analysis.html): Analyize a research paper using our model based approach
+4. [Plain Language Summary](plain-language.html): Write a plain language description of a research paper abstract
+5. [Post GUI Accessibiliy](technology-review.html): Review accessible options for a modern technology
+6. [Improve accessibility of a thing](technology-implementation.html): Make something (not necessarily disability focused) that already exists more accessible
+
+<!-- # Choose your Own Adventure -->
+<!-- These assignments serve multiple purposes including first -->
+<!-- opportunities to practice many of the competencies as well as -->
+<!-- providing students with a way to do useful voluntary work in support -->
+<!-- of the disability community. These are generally weekend projects. -->
+<!-- Students need to do at least twice, and this list is still -->
+<!-- somewhat tentative. -->
+
+<!-- 1. [Develop a set of benchmark tasks for testing GAI ableism](ai.html) -->
+<!-- 2. [Create a custom accessibility support tool using fabrication](lasercutting.html) -->
+<!-- <\!-- 4. [Build a better button](button.html) -\-> -->
+
+# Larger Projects
+
+[Conduct an accessibility assesssment](website.html) and write a [report about it](website-report.html) (service learning opportunity) -->
+
+There will be a larger project that takes place over the entire quarter. Currently, we plan on
+
+- [Project proposals](project-proposals.html) | [Project proposals (Grad)](project-proposals-grad.html) due in week **N**
+- [Checkpoint presentations](project-checkpoint.html) in week **N**
+- [Checkpoint presentations](project-checkpoint.html) in week **N**
+- [Final presentatons and writeup](project-final.html) | [Final poster and writeup](project-poster.html) in Week **N**
+
+This project is fairly open ended.
+
+# Competencies
+As described in the [syllabus]({{site.baseurl}}/index.html), your
+grade in the class will be based on whether you achieve *non
+competent*, *competent* or *excellent* in each of these topics,
+averaged over all the times that you are assessed.
+
+Your scores on these competencies determine your grade in the class as follows:
+- Base grade: Number of Competents/2.5 + Number of Excellents/2
+- Final grade: Base grade - (Number of non competents/2)
+
+## 1. Disability Model Analysis
+We want you to demonstrate an ability to argue for how a given technology or research project, including your own, meets or fails to meet appropriate disability principles drawn from disability studies' [models of disability](https://books.google.com/books?hl=en&lr=&id=7inBEAAAQBAJ&oi=fnd&pg=PA17&dq=Shakespeare,+T.,+and+N.+Watson.+2001.+%E2%80%9CThe+Social+Model+of+Disability:+An+Outdated+Ideology%3F%E2%80%9D.%E2%80%9D+&ots=GRsD_zEq8B&sig=lzBhwThMZyur4r01nxJj9zoW0kM#v=onepage&q=Shakespeare%2C%20T.%2C%20and%20N.%20Watson.%202001.%20%E2%80%9CThe%20Social%20Model%20of%20Disability%3A%20An%20Outdated%20Ideology%3F%E2%80%9D.%E2%80%9D&f=false), disability justice's [10 principles laid out by Sins Invalid](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf), Liz Jackson's concept of a [disability dongle](https://blog.castac.org/2022/04/disability-dongle/), and so on.
+
+{% details How to address this %}
+To address this, you must specify which three principles you are using in your analysis, and then analyze a product (research or otherwise) using these models. When you summarize a paper, or turn in a proposal, we will assess this competency. Your writing should be specific about which principals you are analyzing, define them, and explain how they apply.
+{% enddetails %}
+
+## 2. Familiarity with a Range of Accessibility technologies
+You should demonstrate that you are expanding your familiarity with various accessibility technologies. You must do this at least three times and/or for at least three different AT cases.
+
+{% details How to address this %}
+Not all AT will count toward this assignment, and the teaching staff will determine what counts. Here are some things that would not count. Check with us if you have any questions.
+
+- A technology you are already familiar with / using (i.e. if you are a screen reader user, don't ask to be assessed on your familiarity with screen readers)
+- The technologies you ask to be evaluated on are very similar and/or address very similar accessibility needs. For example, if you ask to be evaluated on a web based screen reader, and then NVDA, those would be too similar.
+- The technologies you select are not used by disabled people.
+- Your description of these technologies does not demonstrate learning or investigation of disability use cases.
+
+Turn in a reflection telling us about AT you have presented about or used in your assignments. The reflection should include Information about how the AT works, users, and strengths and weaknesses of the AT. Your reflection or presentation should demonstrate that it is currently in use by people with disabilities (i.e. through a first-person account). You should also demonstrate a nuanced understanding of the AT. For example, understanding that audiobooks are not only useful for BLV people but also used by people with dyslexia and what limitations exist in their availability or usefulness.
+{% enddetails %}
+
+
+## 3. Finding First-Person Accounts of Accessibility Tech
+You should be able to find first person accounts to motivate your research and arguments even before you consider approaching the disability community. A first person account is a description by a disabled person of their experiences, needs and goals with respect to an accessibility topic. Souch accounts are typically found on youtube, social media, or a blogging platform.
+
+{% details How to address this %}
+A first person account is written or presented by someone who
+- Uses this technology themselves on a regular basis
+- Has a disability
+- Describes first person concerns such as:
+ - How do they the use device to meet their needs?
+ - In what ways does it help?
+ - In what ways does it fall short?
+ - Is their use of the AT specific to needs in their life (i.e. commuting, work)?
+ - What improvements or changes would they like to see?
+
+A first person account that meets the requirements of this assignment is not
+- a teaching video/presentation
+- an advertisement.
+- based on your personal experience
+
+Multiple assignments require finding first-person accounts. We will assess whether they qualify when we grade those assignments. You can also include first-person accounts in your reflection for your competency on Familiarity with a Range of Accessibility Technologies.
+
+If you have an existing relationship with a disability community, early phase input from that community can also address this and is strongly encouraged in your research more generally. However, while we know that some of you may have engaged withor interviewed people with disabilities, we ask that explore what is on social media for this particular competency.
+{% enddetails %}
+
+## 4. Application of Positive Disability Principals to Research
+This competency assess wheth your understand and can summarize and critique the premise of accessibility or disability-related research in relation to the following concerns:
+
+{% details How to address this %}
+You should be able to summarize and critique accessibility research, including your own, on the following concerns:
+
+1. Is it ableist
+2. What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?)
+3. Are people with disabilities engaged in guiding this work? At what stages?
+4. Is it being used to give control and improve agency for people with disabilities
+5. Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)
+
+You will be assessed on this based on things like paper summaries and based on your writeup of your final project, as well as our assessment of how well your final project embodies these goals.
+{% enddetails %}
+
+## 5. Accessible Document Creation
+It is important that you know how to make sure that documents and presentations you create are accessible to everyone in your intended audience, including people with disabilities.
+
+{% details How to address this %}
+This applies to presentations, word documents, and pdfs. You’ll need to demonstrate this on at least one presentation and one assignment writeup that is long and complex enough to have headers and structure to achieve competency.
+
+Best practices:
+- Avoid visual clutter (e.g. use San serif fonts (for digital viewing), don’t have too many things on the page)
+- Use headers and styles where appropriate. For example, in Microsoft Word these are built-in “styles†and in Google Docs you can see these under “Format -> Paragraph Styles.†Headers should be nested like they are in HTML (e.g., H2 after and H1). Read this for more guidance in [how to do styles in Word](https://support.microsoft.com/en-us/office/make-your-word-documents-accessible-to-people-with-disabilities-d9bf3683-87ac-47ea-b91a-78dcacb3c66d#bkmk_builtinheadings_win)
+- Use proper color contrast.
+- Write alt text for all non-decorative photos.
+- Use meaningful hyperlink text Good example: check out [this class's syllabus]({{site.baseurl}}); Bad examples: check out this class's syllabus [here]({{site.baseurl}}); check out this class's sylabus: [{{site.baseurl}}]({{site.baseurl}})
+- Properly mark up tables
+- Screen reader order is correct (in documents where it applies, such as Powerpoint)
+
+You will be assessed on this any time you turn in a required document. In addition, inaccessible documents may not be assessed for other competencies until they are made accessible.
+{% enddetails %}
+
+
+## 6. Accessible Presenting
+You should be able to present accessibly, following [best practices](https://www.washington.edu/doit/making-your-presentation-accessible). As with accessible document creation this ensures that everyone in your intended audience, including people with disabilities, can participate in what you are doing.
+
+{% details How to address this %}
+Follow these guidelines:
+1. Introduce and describe yourself
+2. Speak slowly and clearly
+3. Read entire quotes
+4. Clearly describe images and videos so that someone who cannot see the screen can understand them
+5. Spell acronyms and avoid or define terms, jargon, and idioms.
+6. Repeat questions for clarity
+7. Slides are available to Audience 24 hrs ahead of presentation
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/L9TxhGv91kc?si=gTEEKwMk6C5rAiW5" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+
+How to demonstrate this competency: Tell us at least 24 hours ahead of time that you want to be evaluated on this competency and in what context (office hours, a classroom presentation, etc). It should be a situation in which we can record the presentation.
+{% enddetails %}
+
+## 7. Image Description
+Image descriptions should be concise, complete and accurate. You should use best practices to decide when to mention the background, describe people, and so on. You should learn to do this for various types including pictures, diagrams, screen shots, and so on in an accessible fashion.
+
+{% details How to address this %}
+You will be evaluated on this any time you turn in a document that has images in it. You can also ask us to assess a specific image description in some other context.
+{% enddetails %}
+
+## 8. Sharing Research Back: Plain Language
+Plain language writing is part of ethical research in accessibility, namely to share research with the accessibility community. Please pick at least four guidelines to focus on from the following list and specify which four you picked. You can address more to reach a higher competency score. Follows best practices for text simplification as described on the [federal text simplification website](https://www.plainlanguage.gov/guidelines/)
+
+{% details How to address this %}
+Guidelines we will assess:
+
+Use simple words
+- Use positive language
+- Use short paragraphs
+- Use short sentences
+- Avoid jargon
+- Use active voice
+- Use present tense
+- Use examples
+- Use headers
+- Use transition words
+How this will be assessed: You should tell us when you use plain language writing, and ask us to assess. There will be multiple opportunities to do this during the quarter.
+{% enddetails %}
+
+# Accessibility Problem
+# Accessibility Technology Based Accessibility Checking
+# Automated Accessibility Checking
+# Correct use of Web/App Accessibility Rules
+
+# Regrades
+Regrades are done per competency, not per assignment. All regrade requests must be submitted at least a week ahead of the last class of the quarter. Please check with your TA about what exactly is required for a regrade for any given competency.
+
+
+
+
+
diff --git a/assignments/index.md b/assignments/index.md
deleted file mode 100644
index 9fffcf40a85feb6d3c622079bff061f61dd2f760..0000000000000000000000000000000000000000
--- a/assignments/index.md
+++ /dev/null
@@ -1,74 +0,0 @@
----
-layout: default
-title: Assignments
-description: Course assignments
-warning: draft
----
-
-* TOC
-{:toc}
-
-You can track your assignments through our [Canvas portal]({{site.canvas}}). Please check submission formats for each assignment. Please contact the course staff when in doubt.
-
-Reminder, our class discussion happens using the class [discussion board]({{site.piazza}}) should you have any
-questions or run into issue, please contact the course staff.
-
-
-# Assignments
-
-
-| Link to Assignment | Turn in Link | Due Date |
-|------------------------------------------------------------------------------|-------------------------------------------------------|-----------|
-| HW1: [Finding AT around us](finding-accessibility.html) | [Canvas HW1]({{site.canvas}}/assignments/8443510) | 10/3 |
-| HW2: [Disability Justice](disabilityjustice.html) | [Canvas HW2]({{site.canvas}}/assignments/8443521) | 10/9 |
-| HW3: [Web/App Access UARS](website.html) | [Canvas HW3]({{site.canvas}}/assignments/8443528) | 10/16 |
-| HW4: [Web/App Access Report](website-report.html) | [Canvas HW4]({{site.canvas}}/assignments/8712208) | 10/30 |
-| ~~HW5: [Post GUI Accessibility](technology-review.html)~~ | ~~[Canvas HW5]({{site.canvas}}/assignments/8712482)~~ | ~~10/30~~ |
-| HW6: [Accessibility Implementation](technology-implementation.html) | [Canvas HW6]({{site.canvas}}/assignments/8712492) | 11/6 |
-| HW7: [Final Project Proposal](project-proposals.html) | TBD | 11/13 |
-| HW8: [Final Project Checkpoint](project-checkpoint.html) | TBD | 11/20 |
-| HW9: [Final Project Presentation](project-final.html) | TBD | 12/12 |
-
-# Regrades
-Regrades are done per competency, not per assignment. All regrade requests must be submitted at least a week ahead of the last class of the quarter. Please check with your TA about what exactly is required for a regrade for any given competency.
-
-# Competencies
-
-Assignment grading will be broken into two parts, as described in the [syllabus]({{site.baseurl}}/index.html). The first part will be participation, which adds up to 10% of your grade. The second part will be broken into competencies. Some of these are assessed only once, some multiple times. We have broken these into categories as described below. In addition, everything you submit in this class has to have inclusive language and include accessible documents.
-
-Your grade in the class will be based on whether you achieve *non
-competent*, *competent* or *excellent* in each of these topics,
-averaged over all the times that you are assessed.
-
-## Disability Awareness and Justice
-
-| Competency | Assessed in Which Assignment? |
-|--------------------------------------------------------|---------------------------------------------------------|
-| Disability Justice | HW2, Final Project |
-| Finding First Person Accounts of Disability Technology | HW1, Final Project |
-| Familiarity with a Range of Accessibility technologies | HW1, HW6, Final Project (by choice) |
-| Presenting Accessibly | HW1, Final Project |
-
-## Accessibility Compliance
-
-| Competency | Assessed in Which Assignment? |
-|-------------------------------------------------------|---------------------------------------------------------|
-| Accessibility Problem Fixes | HW4, HW6, Final Project (by choice) |
-| Accessibility Technology Based Accessibility Checking | HW3, HW6, Final Project (required) |
-| Automated Accessibility Checking | HW3, HW6 (by choice), Final Project (by choice) |
-| Correct use of Web/App Accessibility Rules | HW4, HW6, Final Project (by choice) |
-
-## Accessible Media
-
-| Competency | Assessed in Which Assignment? |
-|---------------------------------|---------------------------------|
-| Accessible Presentation Creation | HW1, Final Project |
-| Image Description | HW1, HW3, Hw5, HW6, Final Project |
-| Plain Language Writing | HW2, Any Reading response (by choice) |
-| Accessible Document Creation | HW4, HW6, Final Project |
-
-
-
-
-
-
diff --git a/assignments/plain-language.md b/assignments/plain-language.md
new file mode 100644
index 0000000000000000000000000000000000000000..0538994c4907c5f6c47283e1ebec74bcb408ce74
--- /dev/null
+++ b/assignments/plain-language.md
@@ -0,0 +1,61 @@
+---
+layout: assignment
+published: true
+
+title: Plain Language Summary
+description: Summarize an article using text simplification
+revised: March 24, 2024
+
+---
+* TOC
+{:toc}
+
+# Overview
+
+The goal of this homework is to practice your text simplification skills
+
+## Learning Goals / Competencies
+This homework may contribute to
+- Your competency grade on Accessible Document Creation
+- Your competency grade on Plain Language Writing
+- Other competencies you choose, if relevant
+
+## Length & Difficulty
+Students in the past have reported that this assignment takes an median of 4 hours (mode=3). However, in our experience many students have to make multiple attempts to fully meet the competency for analysis. It is recommended to carefully read the requirements for these competencies and related documentation
+
+Some things students have told us about this assignment:
+
+> Writing well in text simplification is harder than I thought.
+
+We do not yet have an example of the latest version of this assignment for this year.
+
+## 1. Learn about text simplification and write a second summary in plain language
+Read about [plain language writing for accessibility](https://www.forbes.com/sites/andrewpulrang/2020/10/22/plain-language-writing---an-essential-part-of-accessibility/?sh=4afd8af77935) and [text simplification guidelines](https://www.med.unc.edu/healthsciences/clds/wp-content/uploads/sites/859/2021/06/Minimized-Text-Complexity-Guidelines-version-2.03.2021.pdf) and check out examples at the [plain truth project](https://www.plaintruthproject.org).
+
+Please pick at least four guidelines (necessary for competence) or five (necessary for excellence) to focus on from the following list and **state which four you picked**. You can address more to reach a higher competency score (3).
+
+- Use simple words
+- Use positive language
+- Use short paragraphs
+- Use short sentences
+- Avoid jargon
+- Use active voice
+- Use present tense
+- Use examples
+- Use headers
+- Use transition words
+
+## 2. Select a research paper and reproduce the *abstract* in plain language
+You should pick one of the research papers assigned as a reading in class, or a paper of your own choosing (requires instructor approval).
+
+It is important that you don't try to redo the entire article as this will take a very long time.
+
+Instead, use the 4 text simplification principals you picked to simplify the text from the article abstract.
+
+# Turnin
+This should be submitted on [Canvas]({{site.canvas}}). Your writeup should include
+- An APA style reference and link to the article you read
+- It's original abstract
+- The 4 text simplification principals you picked
+- The revised abstract
+- Remember the [academic conduct guidelines]({{site.baseurl}}/academic-conduct.html) and tell us if and how you used generative AI in your assignment, or any other sources of information you used.
diff --git a/assignments/project-checkpoint.md b/assignments/project-checkpoint.md
index bd427118ee154ceddb2bf4d5bef9c6c1aa9a3487..b2169196d85018bb123d85905905a49171b63489 100644
--- a/assignments/project-checkpoint.md
+++ b/assignments/project-checkpoint.md
@@ -1,84 +1,43 @@
---
layout: assignment
-published: draft
-
title: Final Project Checkpoint
-code: hw7b
-
-assigned: Feb 7, 2023
-due:
- - <strong>Submit slides on Canvas and present your project in class</strong> Feb 14, 2023
-
-revised: April 12, 2023
+revised: March 23, 2024
description: Present a complete plan for a project to make the world slightly more accessible
-
---
# Overview
-The goal of your final project is to build an accessibility technology or make an existing technology more accessible.
-
-{% details Final Project Examples %}
-Some examples of what people have done in the past include:
-- [Making a light mode for zoom](https://students.washington.edu/sgbowen8/light-mode/)
-- [Creating a plugin for word to prompt for better alt text](https://thenorthwes.github.io/improved-word-alt-text/)
-- [Make arduino programming more accessible](https://uwcse-nsds.github.io/arduino-a11y/)
-- Make a system to help someone with motor impairments create [macros for fixing typos](https://katyp.github.io/input_macros)
-- Improving [coding acessiblity for BLV people in vscode](https://kburtram.github.io/CodeTalk/)
-- Developing a [plain language checker](https://yichiang.github.io/plain-language-checker/#/)
-- Improving [chart accessibiliy](https://accessiplot.readthedocs.io/en/latest/)
-- Improving the accessibility of a [VSCode plugin for code tours](https://github.com/cclaridad/codetour)
-- Creating [tactile schematics](https://www.hackster.io/monica/creating-tactile-schematics-using-fritzing-5b47f8) for circuits
-- Making [markdown accessible](https://github.com/jaedong98/accessibility4md)
-- Addressing [open issues](https://github.com/odilia-app/odilia/pulls?q=is%3Apr+is%3Aclosed+author%3Asamtay) for a free and open source screen reader, [odilia](https://github.com/odilia-app/)
-{% enddetails %}
-
-In this phase of the final project, you will present a complete *final* proposal for your idea to the class.
-
-## Learning Goals / Competencies
-This homework may contribute to
-- Disability Awareness and Justice (including Disability Justice Framing; Finding First Person Accounts)
-- Accessible Media and Documents (including Accessible Presentation Deck; Accessible Presenting; Image Description).
-- Your participation grade, as a percentage of completeness (all required parts are present)
-
-## Length & Difficulty
-We do not have details on how long this single piece of the final project usually takes students. However, overall students report a median of 7.5 hours per week plus meetings during the four weeks of the project. Some things students commented on regarding the project include:
-- "I appreciate the open-endedness of this project. It gives a good opportunity to apply what we have learned, combined with the knowledge we have brought to this course."
-- "I really enjoyed working with [disabled mentor]"
-- "I like how open ended the project is, and it made for a really interesting last session with a wide variety of presentations."
-- "Learned a lot through the project"
+Prepare a 3 to 4 slide deck to support a conversation about the state of your project. This is an opportunity for feedback, and to practice presenting accessibly. You may want to decide who will take part in the presentation based on who needs to improve their accessible presentation competency. At a minimum, include information about:
-# Details
-To complete this assignment you will need to do the following
-
-## 0. Group formation
-
-Your "group" should include 1-4 people. Many students prefer to work in groups, some prefer to work alone. Both are acceptible. If you join forces with other students in class, you will need to work together to finalize a joint vision for what you plan to do.
-
-## 1. Refine Project Definition
-
-You may need to update other aspects of your project because of group formation or feedback from the instructors. In addition, your project needs to have additional components it did not have before, and we will be breaking some things up to ask for more detail.
-
-1. *update* What will you do?
-2. *update* What is your evidence for why this is needed? Includes your first person evidence and your disability justice analysis.
+0. *update* Project title and team members
+1. *update* What will you do?
+2. *update* What is your evidence for why this is needed? Includes your first-person evidence and your disability justice analysis*
3. **new** Why don't we have this already? To answer this you will need to look at what we *do* have and explain why your idea isn't already solved
-4. **new** Provide technical details. How will you achieve your goals? What software/platforms will you use? What will you do yourself?
-4. *update* How will you validate your idea
-5. *update* Why is this feasible (timeline, etc)
+4. **new** Provide technical details. How will you achieve your goals? What software/platforms will you use? What will you do yourself? What have you done already
+5. *update* How will you validate your idea
+6. *update* Why is this feasible (timeline, etc)
+7. Areas where you need advice/feedback.
-## 2. Write an Accessible Slide Deck and Present In Classs
-
-Include one slide for each of the points above. Also include a title slide with your team members on it (or yourself if you are working solo)
-
-You may want to decide who will take part in the presentation based on who needs to improve their accessible presentation competency.
+Use this to engage us in a conversation that is useful to your project team.
+## Learning Goals / Competencies
+This homework contributes to / will be assessed on
+- Accessible Document Creation
+- Accessible Presenting (for those who participate in the presentation)
+
+At least two other Competencies of your choice, selected as relevant.
+- Familiarity with a Range of Accessibility Technologies
+- Plain Language Writing
+- Applicaiton of Positive Disability Principals
+- Disability Model Analysis
+- Finding First Person Accounts
+- Image Description
# Turnin
-Turn in is individual as competencies are assessed and submitted individually. Please include
-- Your group's slidse
-- The competencies you wish to be assessed on
-- A description of part of your handin should be used
-to assess this (slide content or presentation), and what your role was in producing that.
-
-Note that for each competency, you will need to meet the requirements
-of the rubric for that competency
+In addition to a scheduled presentation slot, you should turn in:
+1. Your slides
+2. For each individual
+ - The competencies you wish to be assessed on
+ - Your role in achieving the competence
+ - Any additional information specified in the rubric for that competency (i.e. anything we need to assess you on the competency)
+
diff --git a/assignments/project-final-poster.md b/assignments/project-final-poster.md
new file mode 100644
index 0000000000000000000000000000000000000000..e084cc61316575bcb9a5186107e5ed08a47650e4
--- /dev/null
+++ b/assignments/project-final-poster.md
@@ -0,0 +1,88 @@
+---
+layout: assignment
+title: Final Project Final Presentations and Handin
+revised: May 15, 2024
+description: Present your final project
+---
+# Overview
+
+In this phase of the final project, you will present a complete *final* writeup and presentation of your project.
+
+## Learning Goals / Competencies
+This homework contributes to / will be assessed on
+- Accessible Document Creation
+- Accessible Presenting (for those who participate in the presentation)
+- Applicaiton of Positive Disability Principals
+- Disability Model Analysis
+- Finding First Person Accounts
+- Image Description
+
+Optionally, you can add
+- Familiarity with a Range of Accessibility Technologies
+- Plain Language Writing
+
+# Details
+
+## 0. Work on your final project
+
+You should work to meet the goals you set out in your [Project Checkpoint](project-checkpoint.html). Make sure to leave sufficient time for validation and writing up your project.
+
+## 1. Create A poster And Present It
+
+You will submit a poster to us by 12/7 bedtime (hard deadline). This is required so we can print it before the poster session. Here is a [UW page with poster templates](https://www.washington.edu/brand/templates/research-posters/). Please follow DO-IT's [guide to creating an accessible poster](https://www.washington.edu/doit/how-can-i-create-conference-poster-accessible-people-disabilities) when you do this.
+
+You should start with these templates and add the following things:
+1. Key basic information
+ a. A [CREATE logo](https://drive.google.com/drive/u/1/folders/1d7XCBCCrWdhcw3gLB_l50YaZgySatbgK)
+ b. a QR code that links to your website
+2. The following headers:
+ a. What did you do
+ b. Why is it needed (including first person evidence & disability model analysis)
+ c. Technical details of what you did including how you achieved goal and what software / platforms you used
+ d. How you validated the idea
+ e. What you learned & suggested questions ("Ask me about...")
+
+## 2. Be prepared to talk about your poster at a poster session (REQUIRED)
+
+You should bring a demo with you to the poster session and be prepared to show what you did in addition to talking about your poster.
+
+Presenting a poster accessibly is similar to giving an accessible talk -- you need to describe images visuals you are talking about on the poster. In addition, keep in mind the following points (quoted from Rua Williams' [Guide to Making Accessible Research Posters](http://www.ruamae.com/disability-advocacy/guide-to-making-accessible-research-posters/)
+
+- "conversation during poster presentation times can be difficult for people who are Deaf, Hard of Hearing, have auditory processing issues, affected speech or expressive language, or use AAC to communicate."
+- "As a presenter, keeping a notepad on hand to pass notes back and forth with interested attendees can help."
+- "Also, remain patient and allow people with communication disabilities equal access to your time."
+- Finally, "don’t assume someone is uninterested in talking to you based solely on their equipment or behavior. Any person who seems to linger around your poster deserves to be asked directly if they have questions or would like you explain the poster for them."
+
+Rua also recommends:
+
+"While your poster should be informational enough to be of interest even when you aren’t present, don’t expect people to read the poster while you are standing there. Present it! When you are not there, consider leaving a way for people to ask questions, such as post-it notes, a Sli.do event, or even a twitter tag."
+
+## 2. Create a web page
+You will make a (minimum W3C Level A) accessible, public-facing web page as part of the class site by providing us with [kramdown markdown](https://kramdown.gettalong.org/syntax.html). You can test accessibility using the [kramdown markdown editor](https://kramdown.electricbook.works/).
+
+Be sure to follow the writing guidelines put out by [SIGACCESS for writing about disability](https://www.sigaccess.org/welcome-to-sigaccess/resources/accessible-writing-guide/)
+
+Your page should contain the following:
+
+- Text describing:
+ - Introduction– ~3 paragraphs (about 750 words): Present the promise/ obstacle/ solution for your project— What is the problem you are solving and why is it important to solve it?
+ - Positive Disability Principals ~3-5 paragraphs: Address the questions in this competency
+ - Related Work– ~3 paragraphs: Talk about relevant work that closely connects with your project.
+ - Methodology and Results– ~6 paragraphs : What did you do in your project- what did you design or implement? What were your metrics for success, and how did you validate? This should include at least one picture of your project, with alt text.
+ - Disability Model Analysis ~3 paragraphs (one per principal)
+ - Learnings and future work ~1-2 paragraphs (about 400 words): Describe what you learned and how this can be extended/ built on in the future.
+
+To demonstrate that your website is accessible, please include an accessibility check summary at a minimum using an automated tool to generate it.
+
+# Turnin
+Your final set of deliverables are individual as competencies are assessed and submitted individually.
+- Your slide deck presenting your work
+- Your public-facing web page markdown and any associated images
+- Your public web page accessibility assessment
+- The competencies you wish to be assessed on
+- A description of part of your hand-in should be used
+to assess this (slide content or presentation), and what your role was in producing that.
+
+Note that for each competency, you will need to meet the requirements
+of the rubric for that competency
+
diff --git a/assignments/project-final-quals.md b/assignments/project-final-quals.md
new file mode 100644
index 0000000000000000000000000000000000000000..fff946e4f63251dafab782062e9e3dddc21e7539
--- /dev/null
+++ b/assignments/project-final-quals.md
@@ -0,0 +1,70 @@
+---
+layout: assignment
+title: Final Project Final Presentations and Handin
+revised: May 15, 2024
+description: Present your final project
+---
+# Overview
+
+In this phase of the final project, you will present a complete *final* writeup and presentation of your project.
+
+## Learning Goals / Competencies
+This homework contributes to / will be assessed on
+- Accessible Document Creation
+- Accessible Presenting (for those who participate in the presentation)
+- Applicaiton of Positive Disability Principals
+- Disability Model Analysis
+- Finding First Person Accounts
+- Image Description
+
+Optionally, you can add
+- Familiarity with a Range of Accessibility Technologies
+- Plain Language Writing
+
+# Details
+
+## 0. Work on your final project
+
+You should work to meet the goals you set out in your [Project Checkpoint](project-checkpoint.html). Make sure to leave sufficient time for validation and writing up your project.
+
+## 1. Create Slides And Present Them
+
+You will submit, and present slides in-class. Presentation time will be decided based on group formation and number of projects and discussed in class. Please ensure that your submitted slides are accessible and that you are making best-effort to present accessibly while staying on-time. Your slides should include the following. Note that *update* are slides you have presented before and **new** are new content.
+
+1. *update* What (at a high level) did <s>will</s> you do?
+2. *update* What is your evidence for why this is needed? Includes your first person evidence and your disability justice analysis.
+3. *update* Why don't we have this already? To answer this you will need to look at what we *do* have and explain why your idea isn't already solved
+4. *update* Provide technical details. How did <s>will</s> you achieve your goals? What software/platforms did <s>will</s> you use? What did <s>will</s> you do yourself?
+5. **new** Show us a demo!
+5. *update* How did <s>will</s> you validate your idea and what were the results
+6. **new** What are some things you learned from this effort? <s> Why is this feasible (timeline, etc)</s>
+
+## 2. Create a web page
+You will make a (minimum W3C Level A) accessible, public-facing web page as part of the class site by providing us with [kramdown markdown](https://kramdown.gettalong.org/syntax.html). You can test accessibility using the [kramdown markdown editor](https://kramdown.electricbook.works/).
+
+Be sure to follow the writing guidelines put out by [SIGACCESS for writing about disability](https://www.sigaccess.org/welcome-to-sigaccess/resources/accessible-writing-guide/)
+
+Your page should contain the following:
+
+- Text describing:
+ - Introduction– ~3 paragraphs (about 750 words): Present the promise/ obstacle/ solution for your project— What is the problem you are solving and why is it important to solve it?
+ - Positive Disability Principals ~3-5 paragraphs: Address the questions in this competency
+ - Related Work– ~3 paragraphs: Talk about relevant work that closely connects with your project.
+ - Methodology and Results– ~6 paragraphs : What did you do in your project- what did you design or implement? What were your metrics for success, and how did you validate? This should include at least one picture of your project, with alt text.
+ - Disability Model Analysis ~3 paragraphs (one per principal)
+ - Learnings and future work ~1-2 paragraphs (about 400 words): Describe what you learned and how this can be extended/ built on in the future.
+
+To demonstrate that your website is accessible, please include an accessibility check summary at a minimum using an automated tool to generate it.
+
+# Turnin
+Your final set of deliverables are individual as competencies are assessed and submitted individually.
+- Your slide deck presenting your work
+- Your public-facing web page markdown and any associated images
+- Your public web page accessibility assessment
+- The competencies you wish to be assessed on
+- A description of part of your hand-in should be used
+to assess this (slide content or presentation), and what your role was in producing that.
+
+Note that for each competency, you will need to meet the requirements
+of the rubric for that competency
+
diff --git a/assignments/project-final.md b/assignments/project-final.md
deleted file mode 100644
index ecfc6b46382db5969fd39f20d0e48b0f9637b040..0000000000000000000000000000000000000000
--- a/assignments/project-final.md
+++ /dev/null
@@ -1,112 +0,0 @@
----
-layout: assignment
-published: draft
-
-title: Final Project Final Presentations
-code: hw7c
-
-assigned: Feb 7, 2023
-due:
- - <strong>Final presentations and deliverables due</strong> Final Exam Time slot, March 14, 6:30pm, 2023
-
-revised: February 5, 2023
-
-description: Present your final project description
-
----
-# Overview
-
-The goal of your final project is to build an accessibility technology or make an existing technology more accessible.
-
-{% details Final Project Examples %}
-Some examples of what people have done in the past include:
-- [Making a light mode for zoom](https://students.washington.edu/sgbowen8/light-mode/)
-- [Creating a plugin for word to prompt for better alt text](https://thenorthwes.github.io/improved-word-alt-text/)
-- [Make Arduino programming more accessible](https://uwcse-nsds.github.io/arduino-a11y/)
-- Make a system to help someone with motor impairments create [macros for fixing typos](https://katyp.github.io/input_macros)
-- Improving [coding accessibility for BLV people in VS Code](https://kburtram.github.io/CodeTalk/)
-- Developing a [plain language checker](https://yichiang.github.io/plain-language-checker/#/)
-- Improving [chart accessibility](https://accessiplot.readthedocs.io/en/latest/)
-- Improving the accessibility of a [VS Code plugin for code tours](https://github.com/cclaridad/codetour)
-- Creating [tactile schematics](https://www.hackster.io/monica/creating-tactile-schematics-using-fritzing-5b47f8) for circuits
-- Making [markdown accessible](https://github.com/jaedong98/accessibility4md)
-- Addressing [open issues](https://github.com/odilia-app/odilia/pulls?q=is%3Apr+is%3Aclosed+author%3Asamtay) for a free and open source screen reader, [odilia](https://github.com/odilia-app/)
-{% enddetails %}
-
-In this phase of the final project, you will present a complete *final* proposal for your idea to the class.
-
-## Learning Goals / Competencies
-This homework may contribute to
-- Disability Awareness and Justice (including Disability Justice Framing; Finding First Person Accounts)
-- Accessibility Compliance (including Accessibility Problem Fixes; Automated Checking (if you turn in relevant UARS); AT based Checking (if you turn in relevant UARS))
-- Accessible Media and Documents (including Accessible Document Creation; Accessible Presentation Deck; Accessible Presenting; Image Description).
-- Your participation grade, as a percentage of completeness (all required parts are present)
-
-## Length & Difficulty
-We do not have details on how long this single piece of the final project usually takes students. However, overall students report a median of 7.5 hours per week plus meetings during the four weeks of the project. Some things students commented on regarding the project include:
-- "I appreciate the open-endedness of this project. It gives a good opportunity to apply what we have learned, combined with the knowledge we have brought to this course."
-- "I really enjoyed working with [disabled mentor]"
-- "I like how open ended the project is, and it made for a really interesting last session with a wide variety of presentations."
-- "Learned a lot through the project"
-
-# Details
-
-## 0. Work on your final project
-
-You should work to meet the goals you set out in your [Project Checkpoint](project-checkpoint.html). Make sure to leave sufficient time for validation and writing up your project.
-
-Along the way, you will participate in checkpoints throughout the weeks of the final project. All team members are expected to attend such meetings.
-
-In addition, please drop by office hours if you need guidance on any aspect of your project. The course staff can work with you on a case-by-case basis if you are unable to attend office hours and would like to meet at a different time.
-
-## 1. Create Slides And Present Them
-
-You will submit, and present slides in-class. You will follow a similar format as your proposal 1 presentations, but will focus more on your solutions. Presentation time will be decided based on group formation and number of projects. Please ensure that your submitted slides are accessible and that you are making best-effort to present accessibly while staying on-time. Your slides should include the following. Note that *update* are slides you have presented before and **new** are new content.
-
-1. *update* What (at a high level) did <s>will</s> you do?
-2. *update* What is your evidence for why this is needed? Includes your first person evidence and your disability justice analysis.
-3. *update* Why don't we have this already? To answer this you will need to look at what we *do* have and explain why your idea isn't already solved
-4. *update* Provide technical details. How did <s>will</s> you achieve your goals? What software/platforms did <s>will</s> you use? What did <s>will</s> you do yourself?
-5. **new** Show us a demo!
-5. *update* How did <s>will</s> you validate your idea and what were the results
-6. **new** What are some things you learned from this effort? <s> Why is this feasible (timeline, etc)</s>
-
-Presentation length TBD depending on the number of groups.
-
-## 2. Create a web page
-You will make a (minimum W3C Level A) accessible, public-facing web page. There are several simple options for you to host a public-facing page, we'll post more details about that.
-
-You should also follow the writing guidelines put out by [SIGACCESS for writing about disability](https://www.sigaccess.org/welcome-to-sigaccess/resources/accessible-writing-guide/)
-
-Your page should contain the following:
-
-- Text describing:
- - Introduction– 1-3 paragraphs: Present the promise/ obstacle/ solution for your project— What is the problem you are solving and why is it important to solve it?
- - Related Work– 1-3 paragraphs: Talk about relevant work that closely connects with your project.
- - Methodology– about 3 paragraphs: What did you do in your project- what did you design or implement? What role did people with disabilities play in this, if any
- - Disability Justice Perspective– 1 paragraph: How did a disability studies perspective inform your project?
- - Learnings and future work -- 1-2 paragraphs: Describe what you learned and how this can be extended/ built on in the future.
- - How you made your app accessible -- 1-2 paragraphs and (optionally) UARS you found in an appendix
-
-To demonstrate that your website is accessible, please include an accessibility check summary at a minimum using an automated tool to generate it.
-
-## 3. Create a video
-You may optionally create a video. Typically, this would contain
-similar content to your presentation, and should be included in your
-web page. In your video, you should present accessibly, verbally
-describing important visual elements and events. Your video should
-also include captions.
-
-
-# Turnin
-Your final set of deliverables are individual as competencies are assessed and submitted individually.
-- Your slide deck presenting your work
-- Your public-facing web page
-- Your public web page accessibility assessment
-- The competencies you wish to be assessed on
-- A description of part of your hand-in should be used
-to assess this (slide content or presentation), and what your role was in producing that.
-
-Note that for each competency, you will need to meet the requirements
-of the rubric for that competency
-
diff --git a/assignments/project-proposals-quals.md b/assignments/project-proposals-quals.md
new file mode 100644
index 0000000000000000000000000000000000000000..e6d227b33c0c6989835d6a53ed2a61a8736b200f
--- /dev/null
+++ b/assignments/project-proposals-quals.md
@@ -0,0 +1,105 @@
+---
+layout: assignment
+published: draft
+
+title: Final Project Proposal
+revised: March 23, 2024
+
+description: Propose a project to make the world slightly more accessible
+
+---
+* TOC
+{:toc}
+
+# Overview
+
+The goal of your final project is to build an accessibility technology or make an existing technology more accessible. In this phase of the final project, you will propose a specific project idea that you come up with.
+
+{% details Final Project Examples from past Undergraduate Accessibility Courses %}
+Some examples of what people have done in the past include:
+**UPDATE**
+{% enddetails %}
+
+
+{% details Final Project Examples From Past Graduate Accessibility Courses %}
+Some examples of what people have done in the past:
+**UPDATE**
+<!-- - [Making a light mode for zoom](https://students.washington.edu/sgbowen8/light-mode/) -->
+- [Creating a plugin for word to prompt for better alt text](https://thenorthwes.github.io/improved-word-alt-text/)
+- [Make Arduino programming more accessible](https://uwcse-nsds.github.io/arduino-a11y/)
+- Make a system to help someone with motor impairments create [macros for fixing typos](https://katyp.github.io/input_macros)
+- Improving [coding accessibility for BLV people in VS Code](https://kburtram.github.io/CodeTalk/)
+- Developing a [plain language checker](https://yichiang.github.io/plain-language-checker/#/)
+- Improving [chart accessibility](https://accessiplot.readthedocs.io/en/latest/)
+- Improving the accessibility of a [VS Code plugin for code tours](https://github.com/cclaridad/codetour)
+- Creating [tactile schematics](https://www.hackster.io/monica/creating-tactile-schematics-using-fritzing-5b47f8) for circuits
+- Making [markdown accessible](https://github.com/jaedong98/accessibility4md)
+- Addressing [open issues](https://github.com/odilia-app/odilia/pulls?q=is%3Apr+is%3Aclosed+author%3Asamtay) for a free and open source screen reader, [Odilia](https://github.com/odilia-app/)
+- **Qbit: An Accessible Tangible User Interface for Window Management and Multitasking**: Screen reader users who are blind use built-in mechanisms (e.g. alt+tab) to switch between windows. This requires them to remember the ordering of windows in these tab
+switchers and linearizes the switching process. Sighted computer users, on the other hand, use a variety of strategies like positioning windows and tabs within and across screens. We address this gap through an exploratory Tangible User Interface (TUI) -- a physical cube -- and report results from an exploratory pilot with one participant. Our preliminary findings show that rotating the cube is an intuitive way to navigate between windows and tabs, the cube’s verbal feedback is helpful while switching windows, and user can distinguish different sides easily due to the textures on the cube.
+- **Knitting4All: Fabricating Solutions to Knitting Accessibility Problems**: We performed one (soon to be more) case study
+with a participant, pseudonym Magnolia, with a traumatic brain injury (TBI), which causes her tremors, pain in her hands, loss of movement in her right (dominant) hand, double vision, and short term memory loss. Using a combination of semi structured interviews and contextual inquiry, we met with our participant to get a sense of how they knit today, the issues they face, and their goals for what they would like to knit. Following, we utilized participatory design, dubbing our participant as the expert, and
+worked closely with the participant to create prototypes via 3D printing and software programming to help her knit more complex patterns with more comfort (now published as part of ["Stitching Together the Experiences of Disabled Knitters"](https://dl.acm.org/doi/10.1145/3411764.3445521))
+- **[Dis]placed: navigating third places and chronic illness**: People experiencing chronic illness often are excluded from
+third places for relaxing and socializing outside of the workplace and home. Designs of public places often neglect important characteristics like: frequent seating, temperature control, and accessible restrooms. However, public places also provide healing elements like relaxation, socialization, and views of nature. Because of the lack of proper design of third places, people with chronic illness find it challenging to find third places that fit their accessible and therapeutic needs and preferences. This project explored whether an information service could be helpful for people navigating the experience of place and chronic illness, by showing which places have certain qualities (now published as part of ["Navigating Illness, Finding Place: Enhancing the Experience of Place for People Living with Chronic Illness"](https://dl.acm.org/doi/10.1145/3460112.3471955)
+{% enddetails %}
+
+We have solicited project ideas from faculty, researchers and community members. They will be made available on the [class discussion board]({{site.discussion}})
+
+## Learning Goals / Competencies
+Required Competencies for this homework:
+
+- Accessible Document Creation
+- Disability Model Analysis
+- Application of Positive Disability Principals to Research
+- Finding First Person Accounts of Accessibility Tech
+
+Other competencies, such as image description, depend on what you have in your proposal.
+
+## Length & Difficulty
+We do not have details on how long this single piece of the final project usually takes students. However, overall students report a median of 7.5 hours per week plus meetings during the four weeks of the project. Some things students commented on regarding the project include:
+- "I appreciate the open-endedness of this project. It gives a good opportunity to apply what we have learned, combined with the knowledge we have brought to this course."
+- "I like how open ended the project is, and it made for a really interesting last session with a wide variety of presentations."
+- "Learned a lot through the project"
+
+# Details
+To complete this assignment, you will need to do the following
+
+## 0. Brainstorm an Idea
+ In choosing this project, you may want to draw from personal expertise, literature, or user data should you have access to it. Your idea should have the following components.
+ - Implementation component: This project should require the creation of novel technology or resources involving programming.
+ - Validation component: Your project also must include a validation component (some way of measuring how well it works). This typically involves developing a set of examples and metrics for success, and assessing how well the technology performs on them.
+
+*Note on disability involvement in this project* It is not feasible to do a full iterative design cycle in this project (and not necessarily an ethical use of the time of people with disabilities). However if you want to include data from interviewing, or testing with, people with disabilities, that is permissible. That said, your project should not unduly burden the disability community. Some projects may allow for direct collaboration with or feedback from people with disabilities, others may not. Please reach out to us for guidance on this if you intend to work with disabled participants.
+
+## 1. Develop an Argument for The Idea
+
+Your idea should be
+- *Promising:* It should offer novel research insights or technology that will help to advance both our field, and the needs of people with disabilities
+- *Informed by a [First Person Account](index.html#3-finding-first-person-accounts-of-accessibility-tech")
+- Embody *Positive Disability Principles:* We understand that you cannot necessarily address all of the positive disability principles that we discuss in class, but at the very least you should be able to argue for principles 1 and 4: (1) It is not ableist (4) It furthers disabled agency and control. Ideally, you will also be able to address at least one more principle of the five [specified in the competency](index.html#4-application-of-positive-disability-principals-to-research).
+- Embody *Disability Theory:* You should consider what [disability theories/principles](index.html#1-disability-model-analysis) are useful in guiding your work.
+- Feasible in the time available during the quarter.
+
+## 2. Write About Your Proposal
+
+Your write up should include the following information
+- *Promise:*
+ - What new knowledge or capabilities does this project enable?
+ - Why is this challenging today? What is already known about this, and what is not known? You should discuss related literature and/or products in answering this question.
+- What [First Person Account](index.html#3-finding-first-person-accounts-of-accessibility-tech") are you drawing from? What data do you have about the disability need for this? You must have one of the following
+ - An existing ongoing project involving interviews or other engagements with people with disabilities that you can refer to
+ - Find an existing interview paper or ethnography/auto-ethnography on the topic
+ - Find an online content creator who provides a first person account of the need for this project
+- How does this project embody [Positive Disability Principles](index.html#4-application-of-positive-disability-principals-to-research):?
+ - List the principals you are addressing (you must include at least 1 and 4) and explain how they are embodied in your work.
+- What [disability theories/principles](index.html#1-disability-model-analysis) are guiding your work?
+ - List the theories you are drawing from and explain how they are guiding your work.
+- Feasible in the time available during the quarter.
+ - What do you plan to accomplish by each of the two intermediate project milestones (week 7 and 10), and by the end of the quarter (week 12)?
+ - What will you *omit* in order to make the project feasible? In other words, how will you scope this project to fit within the quarter? Given the number of weeks available (7), be careful not to over commit.
+
+# Turnin
+Submit your write up on Canvas.
+
+
diff --git a/assignments/project-proposals-ugrad.md b/assignments/project-proposals-ugrad.md
new file mode 100644
index 0000000000000000000000000000000000000000..5964bac89a27e1bd19dc2e4e290c3ad188c27634
--- /dev/null
+++ b/assignments/project-proposals-ugrad.md
@@ -0,0 +1,93 @@
+---
+layout: assignment
+published: draft
+
+title: Final Project Proposal
+revised: March 23, 2024
+
+description: Propose a project to make the world slightly more accessible
+
+---
+* TOC
+{:toc}
+
+# Overview
+
+The goal of your final project is to build an accessibility technology or make an existing technology more accessible. In this phase of the final project, you will propose a specific project idea that you come up with.
+
+{% details Final Project Examples from past Undergraduate Accessibility Courses %}
+Some examples of what people have done in the past include:
+**UPDATE**
+{% enddetails %}
+
+
+{% details Final Project Examples From Past Graduate Accessibility Courses %}
+Some examples of what people have done in the past:
+**UPDATE**
+<!-- - [Making a light mode for zoom](https://students.washington.edu/sgbowen8/light-mode/) -->
+- [Creating a plugin for word to prompt for better alt text](https://thenorthwes.github.io/improved-word-alt-text/)
+- [Make Arduino programming more accessible](https://uwcse-nsds.github.io/arduino-a11y/)
+- Make a system to help someone with motor impairments create [macros for fixing typos](https://katyp.github.io/input_macros)
+- Improving [coding accessibility for BLV people in VS Code](https://kburtram.github.io/CodeTalk/)
+- Developing a [plain language checker](https://yichiang.github.io/plain-language-checker/#/)
+- Improving [chart accessibility](https://accessiplot.readthedocs.io/en/latest/)
+- Improving the accessibility of a [VS Code plugin for code tours](https://github.com/cclaridad/codetour)
+- Creating [tactile schematics](https://www.hackster.io/monica/creating-tactile-schematics-using-fritzing-5b47f8) for circuits
+- Making [markdown accessible](https://github.com/jaedong98/accessibility4md)
+- Addressing [open issues](https://github.com/odilia-app/odilia/pulls?q=is%3Apr+is%3Aclosed+author%3Asamtay) for a free and open source screen reader, [Odilia](https://github.com/odilia-app/)
+- **Qbit: An Accessible Tangible User Interface for Window Management and Multitasking**: Screen reader users who are blind use built-in mechanisms (e.g. alt+tab) to switch between windows. This requires them to remember the ordering of windows in these tab
+switchers and linearizes the switching process. Sighted computer users, on the other hand, use a variety of strategies like positioning windows and tabs within and across screens. We address this gap through an exploratory Tangible User Interface (TUI) -- a physical cube -- and report results from an exploratory pilot with one participant. Our preliminary findings show that rotating the cube is an intuitive way to navigate between windows and tabs, the cube’s verbal feedback is helpful while switching windows, and user can distinguish different sides easily due to the textures on the cube.
+- **Knitting4All: Fabricating Solutions to Knitting Accessibility Problems**: We performed one (soon to be more) case study
+with a participant, pseudonym Magnolia, with a traumatic brain injury (TBI), which causes her tremors, pain in her hands, loss of movement in her right (dominant) hand, double vision, and short term memory loss. Using a combination of semi structured interviews and contextual inquiry, we met with our participant to get a sense of how they knit today, the issues they face, and their goals for what they would like to knit. Following, we utilized participatory design, dubbing our participant as the expert, and
+worked closely with the participant to create prototypes via 3D printing and software programming to help her knit more complex patterns with more comfort (now published as part of ["Stitching Together the Experiences of Disabled Knitters"](https://dl.acm.org/doi/10.1145/3411764.3445521))
+- **[Dis]placed: navigating third places and chronic illness**: People experiencing chronic illness often are excluded from
+third places for relaxing and socializing outside of the workplace and home. Designs of public places often neglect important characteristics like: frequent seating, temperature control, and accessible restrooms. However, public places also provide healing elements like relaxation, socialization, and views of nature. Because of the lack of proper design of third places, people with chronic illness find it challenging to find third places that fit their accessible and therapeutic needs and preferences. This project explored whether an information service could be helpful for people navigating the experience of place and chronic illness, by showing which places have certain qualities (now published as part of ["Navigating Illness, Finding Place: Enhancing the Experience of Place for People Living with Chronic Illness"](https://dl.acm.org/doi/10.1145/3460112.3471955)
+{% enddetails %}
+
+We have solicited project ideas from faculty, researchers and community members. They will be made available on the [class discussion board]({{site.discussion}})
+
+## Learning Goals / Competencies
+Required Competencies for this homework:
+
+- Accessible Document Creation
+- Disability Model Analysis
+- Application of Positive Disability Principals to Research
+- Finding First Person Accounts of Accessibility Tech
+
+Other competencies, such as image description, depend on what you have in your proposal.
+
+## Length & Difficulty
+We do not have details on how long this single piece of the final project usually takes students. However, overall students report a median of 7.5 hours per week plus meetings during the four weeks of the project. Some things students commented on regarding the project include:
+- "I appreciate the open-endedness of this project. It gives a good opportunity to apply what we have learned, combined with the knowledge we have brought to this course."
+- "I like how open ended the project is, and it made for a really interesting last session with a wide variety of presentations."
+- "Learned a lot through the project"
+
+# Details
+To complete this assignment, you will need to do the following
+
+## 0. Brainstorm an Idea
+ In choosing this project, you may want to draw from personal expertise, literature, or user data should you have access to it. Your idea should have the following components.
+ - Implementation component: This project should require the creation of novel technology or resources involving programming.
+ - Validation component: Your project also must include a validation component (some way of measuring how well it works). This typically involves developing a set of examples and metrics for success, and assessing how well the technology performs on them.
+
+*Note on disability involvement in this project* It is not feasible to do a full iterative design cycle in this project (and not necessarily an ethical use of the time of people with disabilities). However if you want to include data from interviewing, or testing with, people with disabilities, that is permissible. That said, your project should not unduly burden the disability community. Some projects may allow for direct collaboration with or feedback from people with disabilities, others may not. Please reach out to us for guidance on this if you intend to work with disabled participants.
+
+## 1. Develop an Argument for The Idea
+
+Your idea should offer develop technology that will help to advance the needs of people with disabilities. However, we want to avoid creating [Disability Dongles](https://blog.castac.org/2022/04/disability-dongle/). To avoid this, we do three important things
+1. You should inform your project from first person accounts if at all possible. If you cannot find first person commentary on the topic, please reach out to the course staff for help. We may tell you not to worry about it, or point you at resources such as research papers that have interviews of people with disabilities in them.
+2. You should embody *Positive Disability Principles:* We understand that you cannot necessarily address all of the positive disability principles that we discuss in class, but at the very least you should be able to argue for principles 1 and 4: (1) It is not ableist (4) It furthers disabled agency and control. Ideally, you will also be able to address at least one more principle of the five [specified in the competency](index.html#4-application-of-positive-disability-principals-to-research).
+3. Analyze your idea from a disability models perspective. You should identify at least *two principles* that your idea helps to address.
+
+## 2. Write About Your Proposal
+
+Your write up should include the following information
+- **Paragraph 1:** What will you do? What first person evidence did you find for this idea? Provide a brief summary and links.
+- **Paragraph 2:** How does this project embody [Positive Disability Principles](index.html#4-application-of-positive-disability-principals-to-research):? List the principals you are addressing (you must include at least 1 and 4) and explain how they are embodied in your work.
+- **Paragraph 3:** How will you validate your idea
+- **Paragraph 4:** Why is this feasible (timeline, etc) What do you plan to accomplish by each of the project milestones?
+
+# Turnin
+Submit your write up on Canvas.
+
+
diff --git a/assignments/project-proposals.md b/assignments/project-proposals.md
deleted file mode 100644
index 25e69effd890ffaa9340bda353aba3660905dca7..0000000000000000000000000000000000000000
--- a/assignments/project-proposals.md
+++ /dev/null
@@ -1,96 +0,0 @@
----
-layout: assignment
-published: draft
-
-title: Final Project Proposal
-code: hw7
-
-assigned: November 8, 2023
-due: Post and comment on ideas on Ed by Friday 11/10, 2023 (2 day late window)
-
-revised: September 28, 2023
-
-description: Propose a project to make the world slightly more accessible
-
----
-* TOC
-{:toc}
-
-# Overview
-
-The goal of your final project is to build an accessibility technology or make an existing technology more accessible.
-
-{% details Final Project Examples %}
-Some examples of what people have done in the past include:
-- [Making a light mode for zoom](https://students.washington.edu/sgbowen8/light-mode/)
-- [Creating a plugin for word to prompt for better alt text](https://thenorthwes.github.io/improved-word-alt-text/)
-- [Make Arduino programming more accessible](https://uwcse-nsds.github.io/arduino-a11y/)
-- Make a system to help someone with motor impairments create [macros for fixing typos](https://katyp.github.io/input_macros)
-- Improving [coding accessibility for BLV people in VS Code](https://kburtram.github.io/CodeTalk/)
-- Developing a [plain language checker](https://yichiang.github.io/plain-language-checker/#/)
-- Improving [chart accessibility](https://accessiplot.readthedocs.io/en/latest/)
-- Improving the accessibility of a [VS Code plugin for code tours](https://github.com/cclaridad/codetour)
-- Creating [tactile schematics](https://www.hackster.io/monica/creating-tactile-schematics-using-fritzing-5b47f8) for circuits
-- Making [markdown accessible](https://github.com/jaedong98/accessibility4md)
-- Addressing [open issues](https://github.com/odilia-app/odilia/pulls?q=is%3Apr+is%3Aclosed+author%3Asamtay) for a free and open source screen reader, [Odilia](https://github.com/odilia-app/)
-
-Other ideas could be to make something that is useful, or fun, more accessible to people with disabilities. Examples:
-- A screen-reader accessible COVID visualization
-- A simple educational game that can be used with switch input
-- A CAPTCHA interface that can be used with an on screen keyboard for someone who uses switch input
-- Fabrication: Make an object more accessible using [laser cutting or 3D printeing](lasercutting.html)
-- Physical Computing: Build a [button](button.html) that makes it easier to control a real world object
-- An online spaces for kids with disabilities (any age)
-- A simple VR environment that is supports magnification and verbal description for low vision and screen reader users
-- A physical attachment for a spray bottle that makes it easier to squeeze
-{% enddetails %}
-
-
-In this phase of the final project, you will propose a specific project idea that you come up with.
-
-## Learning Goals / Competencies
-This homework may contribute to
-- Understanding how to apply a disability justice framing
-- Image description
-- Finding first person accounts
-- Your participation grade, as a percentage of completeness (all required parts are present)
-
-## Length & Difficulty
-We do not have details on how long this single piece of the final project usually takes students. However, overall students report a median of 7.5 hours per week plus meetings during the four weeks of the project. Some things students commented on regarding the project include:
-- "I appreciate the open-endedness of this project. It gives a good opportunity to apply what we have learned, combined with the knowledge we have brought to this course."
-- "I really enjoyed working with [disabled mentor]"
-- "I like how open ended the project is, and it made for a really interesting last session with a wide variety of presentations."
-- "Learned a lot through the project"
-
-# Details
-To complete this assignment, you will need to do the following
-
-## 0. Brainstorm an Idea
- In choosing this project, you may want to draw from personal expertise, literature, or user data should you have access to it. Your idea should have the following components.
- - Implementation component: This project should require the creation of novel technology or resources involving programming.
- - Validation component: Your project also must include a validation component (some way of measuring how well it works). This typically involves developing a set of examples and metrics for success, and assessing how well the technology performs on them.
-
-*Note on disability involvement in this project* It is not feasible to do a full iterative design cycle in this project (and not necessarily an ethical use of the time of people with disabilities). However if you want to include data from interviewing, or testing with, people with disabilities, that is permissible. That said, your project should not unduly burden the disability community. Some projects may allow for direct collaboration with or feedback from people with disabilities, others may not. Please reach out to us for guidance on this if you intend to work with disabled participants.
-
-## 1. Develop an Argument for The Idea
-
-We want to avoid creating [Disability Dongles](https://blog.castac.org/2022/04/disability-dongle/). To avoid this, we do two important things
-1. You should inform your project from first person accounts if at all possible. If you cannot find first person commentary on the topic, please reach out to the course staff for help. We may tell you not to worry about it, or point you at resources such as research papers that have interviews of people with disabilities in them.
-2. You should analyze your idea from a disability justice perspective. You should identify at least *two disability justice principles* that your idea helps to address. Think critically about whether and how your project empowers and gives agency to people with disabilities, as well as the extent to which it expects/engages the larger structural issues around the problem you’re trying to solve.
-
-
-## 2. Write 4 paragraphs summarizing the idea
-
-Your write up should include the following information
- - **Paragraph 1:** What will you do? What first person evidence did you find for this idea? Provide a brief summary and links.
- - **Paragraph 2:** How does it address disability justice? Define the two principles you selected and explain how your idea furthers them.
- - **Paragraph 3:** How will you validate your idea
- - **Paragraph 4:** Why is this feasible (timeline, etc)
-
-Given the number of weeks available, be careful not to over commit. You must figure out how to fit this all in about four weeks.
-
-# Turnin
-You will need to submit your write up to the class [discussion board]({{site.discussion}}) before next class. The category should be "Assignments", the subcategory should be "Disability Justice"
-
-
-
diff --git a/assignments/reflection.md b/assignments/reflection.md
deleted file mode 100644
index 6c1f666860944635bdd06b6e54ade5eff4121bd6..0000000000000000000000000000000000000000
--- a/assignments/reflection.md
+++ /dev/null
@@ -1,28 +0,0 @@
----
-layout: default
----
-
-# What is a Reflection
-
-
-A running theme in this course will be reflecting on our work and our work practices.
-
-**Reflection** is a way to examine the present while critically looking at the past in order to
-inform the future. It is also a vital part of the engineering process, and will be a vital part of
-you honing your skill as a Programmer, Computer Scientist, and/or Engineer.
-
-In general, what does it mean to reflect well:
-
-- First and foremost, the reflection answers any guiding questions given.
-- Specific details of the experience(s) being reflected upon are described clearly and
-concisely and in such a way that a non-expert (in this field) reader can understand. This does not
-mean you must explain it so that a novice reader can understand the problem deeply, just a
-non-expert (someone who knows the field but is not an expert in the field.) **Note** that a
-reflection is NOT just a factual recounting of a situation or situation(s).
-- There is a “depth†to the reflection. There are a number of ways to make a reflection deep, thoughtful and thorough.
- - The reflection elaborates what the significance and meaning are of the given examples and why they are particularly important.
- - The reflection includes a personal reaction to the events or examples described. Reactions are
- open and honest and indicate the writer's ability to appraise what is presented.
- - The reflection describes connections between these details and other events,
- examples, ideas or concepts from the past or present.
- - The reflection may raise questions or have implications on future work.
diff --git a/assignments/research-paper-analysis.md b/assignments/research-paper-analysis.md
new file mode 100644
index 0000000000000000000000000000000000000000..b22a2cd7547e2bcb1b3babeb5540732efbc7bfaf
--- /dev/null
+++ b/assignments/research-paper-analysis.md
@@ -0,0 +1,63 @@
+---
+layout: assignment
+published: true
+
+title: Research Paper Analysis
+description: Analyze an article using theoretical frameworks drawn from disabilty studies and activism
+revised: August 20, 2023
+
+---
+* TOC
+{:toc}
+
+# Overview
+
+The goal of this homework is to apply a disability model/framework to
+analyzing a technology or service currently in use in the world. It is also helpful to your peers, it is due 2 days ahead of the lecture on that topic.
+
+## Learning Goals / Competencies
+This homework may contribute to
+- Your competency grade on understanding how to apply Positive Disability Principals to Research
+- Your competency grade on Disability Model Analysis
+- Your competency grade on Accessible Document Creation
+- Other competencies you choose, if relevant
+
+# Details
+
+To complete this assignment, you will need to do the following
+
+## 0. Select an article to focus on.
+You should pick one of the research papers assigned as a reading in class, or a paper of your own choosing (requires instructor approval).
+
+## 1. Select and define three principals/models you will use to analyze it.
+
+You may analyze and critique it using concepts such as
+- One of the medical, social or other models of disability as defined [in this book chapter](https://books.google.com/books?hl=en&lr=&id=7inBEAAAQBAJ&oi=fnd&pg=PA17&dq=Shakespeare,+T.,+and+N.+Watson.+2001.+%E2%80%9CThe+Social+Model+of+Disability:+An+Outdated+Ideology%3F%E2%80%9D.%E2%80%9D+&ots=GRsD_zEq8B&sig=lzBhwThMZyur4r01nxJj9zoW0kM#v=onepage&q=Shakespeare%2C%20T.%2C%20and%20N.%20Watson.%202001.%20%E2%80%9CThe%20Social%20Model%20of%20Disability%3A%20An%20Outdated%20Ideology%3F%E2%80%9D.%E2%80%9D&f=false)
+- The concept of a disability dongle as defined [in this post](https://blog.castac.org/2022/04/disability-dongle/)
+- Up to three of the [10 principles of disability justice](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf)
+- [A feminist theory of universal design](https://ojs.library.osu.edu/index.php/dsq/article/view/3871/3411)
+- Something else approved by the instructors
+
+## 1. Read and summarize article on the topic you have selected.
+Read your article and summarize it. Your summary should be about a two paragraphs long. The first paragraph should explain what the paper is about. The second paragraph should answer the following questions:
+
+- Is this project ableist?
+- What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?)
+- Are people with disabilities engaged in guiding this work? At what stages?
+- Is it being used to give control and improve agency for people with disabilities
+- Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)
+
+## 2. Analyze it from the perspective of the principles/models you chose
+
+How did the article you chose address, or fail to address, your there principles?
+
+For each principle
+- Name and define it
+- Write 1-2 paragraphs (250-500 words) explaining how it relates to the article. Does it highlight a flaw? Or a good aspect?
+
+# Turnin
+This should be shared with the class on the [discussion board]({{site.discussion}}) and submitted on [Canvas]({{site.canvas}}). Your writeup should include
+- The article you read
+- Your summary of the article
+- Your analysis including **definitions of the 3 principles/models you picked** and your analysis of them
+- Remember the [academic conduct guidelines]({{site.baseurl}}/academic-conduct.html) and tell us if and how you used generative AI in your assignment, or any other sources of information you used.
diff --git a/assignments/technology-implementation.md b/assignments/technology-implementation.md
index 34013a17ff53eb7dc8161ed6e221130e9824f9b6..61aa6789b219c52912e5d468e84dad00a7e770da 100644
--- a/assignments/technology-implementation.md
+++ b/assignments/technology-implementation.md
@@ -2,16 +2,9 @@
layout: assignment
published: true
-title: Accessibility Implementation
-description: Learn about accessibility implementation
-code: hw6
-
-assigned: November 1, 2023
-due:
- - November 6, 2023
- - Two day grace period, November 8, 2023
-
-revised: October 30, 2023
+title: Accessibility Implementation
+description: Apply accessibility principals to a thing
+revised: March 24, 2024
---
@@ -19,36 +12,27 @@ revised: October 30, 2023
{:toc}
# Overview
-The goal of this homework is to build something that is accessible. Specifically, you should create a *more accessible version* of a user interface you've already made for a class or for fun.
+The goal of this homework is to make something more accessible. Specifically, you should create a *more accessible version* of a thing (website, visualization, user interface, AR/VR, etc) that you've already made.
## Learning Goals / Competencies
-This homework may contribute to your competency grade on
+This homework will contribute to your competency grade on
- Accessible Document Creation
-- Accessibility Problem Fixes
-- Your participation grade, as a percentage of:
- - completeness (are all the required parts present)
- - consistency: are you applying the skills you've learned so far consistently as relevant
-
-In addition, you can *optionally* ask us to assess the following things to your homework:
-- Automated Accessibility Checking (requires writing up UARs)
-- AT-Based Accessibility Checking (requires writing up UARs)
-- Image Description (you have to provide alt text anyway, so just tell us if we should assess it)
-- Familiarity with a Range of Accessibility technologies
-- Presenting Accessibly
+- Familiarity with a Range of Accessibility Technologies
+- Image Description
-## Length and Difficulty
-This is a new assignment, so we are still figuring this out! Please bear with us and reach out if you have trouble!
+It may contribute to other competencies depending on how you approach it.
# Details
To complete this assignment, please do the following
## 1. Select a specific interface or web app that you will make more accessible
-You should identify a technology you have implemented *for general use* (i.e. not an accessibility technology). Ideally this should be an interactive technology (some kind of user interface, app, etc). If you have no such thing, you can ask us about using a website or other static content that you have generated as an alternative.
+You should identify a technology you have implemented *for general use* (i.e. not an accessibility technology). Ideally this should be an interactive technology (some kind of user interface, app, etc). If you have no such thing, you can ask to approve using a website or other static content that you have generated as an alternative.
{% details Possible examples (this list is still unders construction) %}
- A class assignment that has an interface
- A web app
-- A mobile app (e.g. final project for 340)
+- A mobile app (class projects are ok)
+- Your personal website
- An interface wrapped around some machine learning program
- An educational game for young children
- Tools for learning programming
@@ -57,7 +41,10 @@ You should identify a technology you have implemented *for general use* (i.e. no
- VR/AR: A game or game control interface.
{% enddetails %}
-Also be clear about what task you want to accomplish. **If you don't have any interactive application that you can do this with** you can use a static website or content, however in this case you need to get our approval by submitting the content you will focus on to us **before class on Friday.**
+Also be clear about what task you want to accomplish. **If you don't
+have any interactive application that you can do this with** you can
+use a static website or content, however in this case you need to get
+our approval by submitting the content you will focus on to us ahead of time.
## 2. Select an accessibility technology and test your app with it
@@ -67,26 +54,26 @@ Be clear about what task your are testing.
Test out your app with that accessibility aid and identify any problems with completing that task.
-*Note* UARs are not required unless you want to be assessed on competencies that require them
-(Automated Accessibility Checking & AT-Based Accessibility Checking)
## 3. Fix the problem
Once you have identified problems, it is time to fix them. The expectations here will depend partly on the details of the task you select (which must be instructor approved) but it needs to include at least two different areas of POUR (i.e. address issues with both percievability and operability) or otherwise demonstrate that you have not done something overly simple.
-## 4. Turn in the following information for us-
-- An accessible 1 page document stating
- - What app or website did you pick and what is it's main purpose
- - What task you picked
- - What you had to do to make the app or website more accessible
- - What was hardest about this assignment
- - Your document should be accessible, including using headers for each section, and images to illustrate your text.
+## 4. Present it to us
+We will **announce/decide closer to this assignment** whether this should be done as a live demo, in section, or by video depending on factors like class size. Regardles of how you present, your presentation will need to demonstrate the problems you found and the fix you created. This should include a "before & after" style presentation, where you use the technology with the accessibility technology you used to test and improve the experience, before and after the fix, demonstrating what did not work and how it improved.
-Note: **do not submit a PDF**. We expect your submission to be a Word or Google Doc.
-## 5. Present about it in Section
-Be prepared to demonstrate the problems you found and the fix you created in section. This should be a "before & after" style presentation, where you show what your subject looked like before & how it wasn't appropriately accessible, followed by an explanation or demonstration of what you did about it.
+# Hand in
+
+Turn the following in on [Canvas]({{site.canvas}})
+
+- An accessible 1 page document stating
+ - What thing or app and task you picked (include pictures)
+ - What accessibility technology you picked
+ - What you had to do to make it more accessible
+ - What are three things you learned from doing this?
+ - An appendix with a list of the competencies you wish to be assessed on other than the required ones, and any additional information needed to be assessed (as specified in [the competencies](index.html#competencies))
+
+Note: **do not submit a PDF**. We expect your submission to be a Word or Google Doc.
-The format of this presentation is flexible, but should take about 3 minutes (and no more than 5). You can choose to do a live demo of your before & after, do a classic live presentation with slides (which ideally would include screenshots or recordings), you can pre-record a slide presentation video, or you could narrate a recording of interacting with your system (again, focusing on the before & after).
-To meaningfully demonstrate your system's accessibility, we recommend using at least one accessibility technology in your presentation or demo.
diff --git a/index-quals.md b/index-quals.md
new file mode 100644
index 0000000000000000000000000000000000000000..67ec00cd498469ccca26dc376d17a7e528a07e43
--- /dev/null
+++ b/index-quals.md
@@ -0,0 +1,408 @@
+---
+title: Syllabus/FAQ
+layout: default
+---
+
+* TOC
+{:toc}
+
+# Why take this class?
+
+To learn how computing can enable new solutions to accessibility, including both access to the world and access to computers? Similarly, how can a disability studies perspective guide us in developing empowering and relevant solutions to accessibility problems? This course explores both of those questions through a combination of discussions, reading, and building. In addition, by studying access technology, we can gain valuable insights into the future of all user interface technology.
+
+{% details What it is about? %}
+<!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/1aFiJDHtRiY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+
+<!-- Highly recommend this course to be [mandatory in CS]... I will keep the lessons learned and try to apply them in my career wherever applicable. -- 2023 student. -->
+<!-- {: .quote} -->
+
+<!-- Even though I have a lot of experience with implementing accessibility in code and pushing for more accessible designs at work, I have learned a lot from this course [that I plan to take back into my workplace] -- 2023 student -->
+<!-- {: .quote} -->
+
+
+Access technology (AT) has the potential to increase autonomy, and improve millions of people’s ability to live independently. In addition, accessibility is a human rights issue and it is the law. If you're creating interactive technologies, you should know how to build regular interfaces that are accessible as well as understanding the value of innovating new approaches to accessibility. Disability touches almost everyone either directly or indirectly at some point in life, temporarily or permanently. Let’s create a future we will also want to and be able to be part of.
+
+In this course we will focus on a combination of practical skills such as how to create accessible of documents, websites and apps and how to do disability based UX; advanced skills such as how to address accessibility in visualization, AR/VR and AI/ML; and forward looking topics such as intersectional concerns, accessible healthcare, and accessibility in disaster response. The largest project in the class will be an open ended opportunity to explore access technology in more depth. We will also cover disability justice and advocacy.
+
+
+{% enddetails %}
+
+{% details What are the Prerequisites and Expectations? %}
+
+The only requirement for this class is that you are comfortable programming and picking up new languages and tools that you have not been exposed to before. You will have some control over this, however, basic web skills are likely to be useful. The primary programming project in this class is one you design yourself.
+
+In addition, please familiarize yourself with the course [academic conduct]({{site.baseurl}}/academic-conduct.html) policy. Looking beyond policy, plagiarizing is a violation of disability justice and in direct conflict with the learning goals of this course.
+
+{% enddetails %}
+
+{% details What is the Teaching Philosophy and Approach? %}
+
+Many of the goals in this class center around learning by doing. This
+means that hands on time trying out everything from implementation to
+evaluation is critical to learning. Active learning has been [shown to
+increase student performance in STEM
+subjects](https://www.pnas.org/content/111/23/8410).
+
+Thus, class time will be used as much as possible for in **class
+exercises and discussion** for understanding using a variety of
+technologies. We also highly encourage questions in lecture. Often
+many students share the same question and those questions can help the
+instructor gauge student understanding.
+
+Preparation outside of class and participation in class are both very
+important and will improve your class experience. Preparation may
+include online discussion, pre-class readings and videos, and
+post-lecture reflections in addition to homework. Participation in
+class will include discussion, question asking, and active engagement
+in learning exercises.
+
+{% enddetails %}
+
+
+# Logistics
+
+This is an in person class. As much as possible, we ask that you
+attend in person. That said, we know that many individual concerns may
+make this a barrier. We will do our best to support remote
+participation when there is a need for this due to a family
+obligation, disability, or other concern.
+
+{% details When and Where is the Class Held? %}
+
+See [Canvas]({{site.canvas}}) for all zoom meeting links for classes and office hours.
+
+- **Class Time:** {{site.time}} (PDT)
+- **Class Location:** {{site.room}}
+
+{% enddetails %}
+
+{% details How do I reach the Instructors? %}
+<BR>
+
+|-------------------------------------------------------------------------|------------------------------------------------------------|-----------------|
+| {:width="80px"} | [Jennifer Mankoff]({{site.author.url}}) (she/her) | Instructor |
+| {:class="ta-picture"} | [Aashaka Desai](aashakadesai.github.io) (she/her) | TA |
+
+<BR>
+**Office Hours**
+
+
+|----------------|--------|-----|--------------------------------------------------|
+| Day | Time | Who | Where |
+| Monday | 10-11 | Jen | Online (also this is tentative)) |
+| Wednesday | 2-2:30 | Jen | CSE 2, room 214 |
+| Thursday | 12-1 | Aashaka | Online (Zoom TBD) |
+| Asynchronous | | Any | Post to [discussion board]({{site.discussion}})* |
+| By Appointment | | Any | Post to [discussion board]({{site.discussion}}) |
+
+
+
+*You can discuss matters with us privately on the [discussion
+board]({{site.discussion}}). This notifies the whole course staff at
+once and is usually faster than email.
+
+Staff mailing list: [Mail](mailto:{{site.staff_email}})
+
+{% enddetails %}
+
+
+{% details How do I reach other students in the class? %}
+
+We have a class [discussion board]({{site.discussion}}), where you can
+make public posts that benefit the whole class, and are answered more
+quickly because your fellow students can help the course staff by
+responding also.
+
+- This is the best way to ask questions about things like homework and programming
+- Before posting, please search through the questions that have already been posted in case
+ someone has already asked the same question.
+
+Another great way to meet students is to come to class in person!
+
+{% enddetails %}
+
+{% details How does Synchronous Remote Participation work? %}
+
+When you are remote, ideally you will still participate synchronously. To participate synchronously, you need to do the following:
+
+1. Post in [the class discussion]({{site.discussion}}/4631278) to find or report who your zoom buddy is
+2. Attend via zoom and participate in discussions with the help of your zoom buddy
+3. Report who your zoom buddy was, and how you participated, in your weekly survey
+
+{% enddetails %}
+
+{% details Will lectures be recorded? %}
+
+Class sessions **will be recorded** when possible (guest lecturers may
+refuse this). Recordings will only be accessible to students enrolled
+in the course to review materials.
+
+The University and Zoom have FERPA-compliant agreements in place to
+protect the security and privacy of UW Zoom accounts.
+
+Students who connect by Zoom but do not wish to be recorded should:
+- Change their Zoom screen name to a school appropriate screen name
+that hides any personal identifying information such as their name or
+UW Net ID
+- Not share their computer audio or video during their Zoom sessions (please notify us first!).
+
+{% enddetails %}
+
+# How is COVID safety handled in this class?
+
+Masking is currently optional, however people in the room include those who are high risk with respect to COVID and people who live with vulnerable family members. Masks offer another layer of protection to further reduce the risk of transmission for all of us, and help to support these individuals. Thus, in this class, wearing a mask indoors when around others is recommended, and I ask that you attend class remotely if you are sick or have potentially been exposed to COVID-19.
+
+{% details Why are masks passed around in class? %}
+According to the [UW face covering policy](https://wwwb.ehs.washington.edu/covid-19-prevention-and-response/face-covering-policy).
+
+>As part of the University’s multi-layered strategy to limit the transmission of COVID-19, face coverings, particularly well-fitting, high-quality masks (e.g., N95, KN95, surgical mask) remain a useful tool in helping to limit the spread of COVID-19.
+
+To help support the access needs of these individuals, masks will be available in the classroom as you enter, and if you would like to mask, you are welcome to make use of them.
+{% enddetails %}
+
+{% details When should I attend remotely? %}
+
+If you are sick or have potentially been exposed to COVID-19, **stay home**. We will not be
+assessing you on attendance, so you will not be penalized for missing class to keep our community safe.
+
+Below, we briefly describe the accommodations for students having to miss class due to potential
+illness, with full information in the linked pages.
+
+- [Lectures](index.html#lectures): Course content will be posted as a set of readings/videos
+ that can be watch asynchronously. Recordings of the live class posted on course website, and all
+ materials posted online.
+- [Office Hours](index.html#course-support): We will host remote office hours.
+ Please contact the course staff on the [discussion board]({{site.discussion}})
+ if none of the times/locations work for you.
+- [Asynchronous help]({{site.discussion}}) is available via the [Discussion Board]({{site.discussion}}),
+ post online to get asynchronous help from a member of the course staff.
+
+{% enddetails %}
+
+{% details Do I need to maintain social distancing? %}
+Vaccinations and masking provide strong protection against the spread of COVID. Currently, UW does
+not require social distancing in the classroom or office hours for students who are vaccinated and
+wearing a mask.
+
+Of course, some students might feel more comfortable keeping a little distance. If you would like
+to keep space between you and another student, please kindly ask them to leave a space between you
+and them if there is room available. Similarly, if someone asks you to maintain a space
+between them, please respect that request if possible.
+
+{% enddetails %}
+
+{% details What if I get sick or may have been exposed to COVID-19?%}
+
+See [this FAQ](https://www.ehs.washington.edu/covid-19-prevention-and-response/covid-19-case-and-exposure-guidance) by UW on what you should do if you get
+sick. You should also check out the [Remote Access](#remote-access) options listed above!
+
+If you believe you have been exposed to COVID-19, follow the recommendations outlined in this
+[flowchart by EH&S](https://www.ehs.washington.edu/system/files/resources/COVID-19-public-health-flowchart.pdf).
+
+{% enddetails %}
+
+{% details What if Jen or a TA gets sick? %}
+
+The course staff is committed to keeping you safe, so we will not make you risk a potential exposure
+to COVID to attend class. If one of the course staff feels ill, we will move any in-person activities
+we are hosting to be purely online or have
+someone else on the course staff fill in for us while we are potentially contagious.
+
+Please make sure you check your email frequently for announcements from the
+[discussion board]({{site.discussion}}) and before you attend an in-person event to make sure it is
+still happening in-person. We will always try our best to give as advanced notice as possible for
+any changes from in-person to remote for a day.
+
+{% enddetails %}
+
+
+# Is this class Accessible and Inclusive?
+
+We hope so! The class is a shared learning environment and it is
+important to us to make it a welcoming environment for everyone, from
+all backgrounds. We strive to treat everyone in the class with respect and
+understanding.
+
+{% details How does this class support Accessibility? %}
+
+We know that students in this class may need materials to be
+accessible by screen reader, or may need extra time on exams. We have structured the class to be as accessible as possible to all students by default.
+
+If you have a temporary health condition or permanent disability
+(either mental health, learning, or physical health related) that
+impacts your academic experience, please let us know how we can
+accommodate you.
+
+You are NOT obligated to disclose any of these issues with the
+instructor, only specify if there’s any accommodations required. For
+more on accessibility in this class and how we accommodate you (and
+each other), please see our [Accessibility
+Policy](docs/accessibility.html)
+
+{% enddetails %}
+
+
+{% details What about health and wellness beyond accessibility accommodations? %}
+
+It is very important to us that you take care of your mental health throughout the course. We have built flexibility into course assessments with the goal of reducing stress. However we know that sometimes that is not enough. Everyone on the course staff is available to chat, and you can always attend office hours for a non-academic conversation if necessary. Beyond the course staff, the University of Washington provides the following resources for mental health concerns. Your anonymity and privacy are protected.
+ - Please reach out to the [UW Counseling Center](http://www.washington.edu/counseling/) for any help and
+ concerns related to mental health (including increased stress), available to all UW students at no cost.
+ - If you are ever feeling uncomfortable and need to talk or are worried about someone close to you, it is
+ highly recommended to visit the [UW Heath and Wellness](http://depts.washington.edu/livewell/programs/)
+ programs. They offer resources to students that can help.
+ - If you're concerned for yourself or a friend, please call SafeCampus at (206) 685-7233.
+
+{% enddetails %}
+
+{% details How do you accommodate religious holidays? %}
+
+You may observe religious holidays that overlap class times. We ask
+that you complete the class attendance requirements for remote
+students in this case. If you have additional concerns that this
+policy does not meet, please contact the instructors. In addition,
+here is some potentially helpful information about UW policy:
+[Religious Accommodations
+Policy](https://registrar.washington.edu/staffandfaculty/religious-accommodations-policy/).
+Accommodation can be requested within the first two weeks of this
+course using the [Religious Accommodations
+Request](https://registrar.washington.edu/students/religious-accommodations-request/)
+form on UW's site.
+
+{% enddetails %}
+
+{% details What should I do if something happens that makes me feel unsafe or excluded? %}
+
+If you have been subject to sexual harassment, you feel you have been discriminated against, our you have been made to feel uncomfortable in any way, please tell us. You might choose to speak with your instructor, teaching assistant, the chair of the department, depending on the circumstances.
+
+Should you feel uncomfortable bringing up an issue with a staff member
+directly, , there are a number of [Community Feedback Mechanisms and
+Resources](https://www.cs.washington.edu/community-feedback) including
+the [Anonymous Feedback](https://feedback.cs.washington.edu/) form,
+but understand we can not respond to you directly if you use the
+latter. Responses, if possible, will be broadcast to the class as a
+whole or systematic changes to the class when necessary.
+
+You can also file a complaint with the UW Ombudsman's Office for Sexual Harassment. Their office is located at 339 HUB, (206)543-6028. There is a second office, the University Complaint Investigation and Resolution Office, who also investigate complaints. The UCIRO is located at 22 Gerberding Hall.
+
+If something about the course materials makes you feel excluded, please let us know. We also review them ourselves with inclusion in mind each time we prepare to teach.
+
+We have tried to make the course inclusive of people who have work,
+childcare or appointments that have to be prioritized at specific
+times. However if we can do something to improve this further, or you have needs we haven't thought of, please tell us.
+
+{% enddetails %}
+
+# Expectations and Grading
+
+While grading is a necessary part of what we do at UW, I want to focus
+this class on learning; and to ensure that my approach to assessment
+is inclusive and focuses on a justice based approach. There has been a
+lot of [innovation in
+assessment](https://online.suny.edu/innovativeassessments/) in recent
+years, driven partly by COVID-19. We have tried to learn from this in our grading.
+
+**There will not be quizzes, or a midterm or final exam**. Instead, your knowledge will be assessed
+[Competency based
+grading](https://aurora-institute.org/cw_post/cbe-in-practice-grading/) in alignment with the disability justice focus in this
+course. A portion of your grade will also be based on participation and effort.
+
+{% details What is "*Competency Based Grading*"? %}
+ [Competency based
+grading](https://aurora-institute.org/cw_post/cbe-in-practice-grading/) separates out *how* you learn a skill from *whether you
+know it.* Many of these competencies are assessed repeatedly. *I don't
+care if you get them wrong at first*, as long as you eventually learn
+them. If you learn them all, and participate fully in the class, you
+will get an A.
+
+
+In the image below, you can see how traditional grading assigns a score
+for each assignment and adds them together. If you score badly on your
+first assignment, that negatively affects your grade, *even if* you demonstrate that you've
+learned everything you needed to know in it during later assignments. In contrast
+competency-based grading is structured around learning goals. All of the different
+things you do that demonstrate progress on those learning goals are grouped together
+to help assign a score on that learning goal.
+
+
+
+{% enddetails %}
+
+{% details Nice philosophy and all... what does that mean for me? %}
+
+The competencies needed for this course are listed on the [assignments
+page](assignments/index.html), and can all be found in canvas as well.
+
+Each time you turn in an assignment, you tell *us* which competencies
+we should assess. We may also decide to assess competencies such as
+whether a document is accessible, with accessible image descriptions.
+If an assignment is *not* accessible we *will not assess any
+competencies in it*. Once you achieve competency, we expect you to
+maintain it -- for example, repeatedly turning in inaccessible images
+after achieving competency in image descriptions will lower your
+score.
+
+When you we assess a competency, we rate your skill as "no evidence"
+"below competent" "basic knowledge" or "excellent". Various
+combinations of "basic" "excellent" and "below competent" result in
+various final grades in the class, with all excellents being a 4.0 and
+the grade going down based on the number of competents versus
+excellents. However, if even 1 skill is below
+competence, the highest possible grade in the class is a 3.2.
+
+You can
+view your progress on each competency in Canvas (Excellent is called
+"Mastery" there). **Click on the competency to see details on whether
+you are "competent" or "excellent"**.
+
+{% enddetails %}
+
+{% details What else will I be graded on? %}
+
+### 85%: Competencies
+Competencies are 85% of your grade in the class. See the previous
+question for details on how a grade is calculated from your
+competencies.
+
+Your scores on these competencies determine your grade as follows:
+
+- Base grade: Number of Competents/2.5 + Number of Excellents/2
+- Final grade: Base grade - (Number of Non-Competents/2)
+
+### 15%: Assignment Completion, Participation and Effort
+Your effort grade will reflect your participation in the class across
+multiple dimensions such as whether you answerd reading questions;
+participated in discussions and exercises in class (self reported);
+and to what degree you completed all assignments.
+
+If you participate remotely, or miss a class, you may be asked to
+engage in additional work before, after, or during lecture to ensure
+that you have the most similar experience possible to students who are
+in person.
+
+{% enddetails %}
+
+{% details Does the class have a regrading policy? %}
+
+Reflecting on feedback is one of the most valuable ways you can learn
+from your mistakes, and we encourage you to do so.
+It is also possible for the graders to make mistakes. If that happens
+we certainly would like to correct the error.
+
+However, please note the
+following:
+- Because this class is competency based, you don't necessarily need a regrade, you just need to show that you have learned this competency in this OR a future assignment. Most competencies show up in more than one place
+- When you request a regrade, we may look at the entire assessment, homework or reflection. Therefore,
+it is possible for to lose a competency as well as gain one in this process.
+
+If you have a
+question about a grade you received or if you feel the grade you
+received is incorrect, please **[email an
+instructor](mailto:{{site.staff_email}}) for an appointment to discuss
+the assignment and your grade in detail**.
+
+{% enddetails %}
+
+
+
+
+
diff --git a/index.md b/index.md
index 44639762641774c739eb0f6a06357b9ec9975157..94d62f546182c51884417df212501f3d3a765f54 100755
--- a/index.md
+++ b/index.md
@@ -7,22 +7,35 @@ layout: default
{:toc}
# Why take this class?
+
+To learn how computing can enable new solutions to accessibility, including both access to the world and access to computers? Similarly, how can a disability studies perspective guide us in developing empowering and relevant solutions to accessibility problems? This course explores both of those questions through a combination of discussions, reading, and building. In addition, by studying access technology, we can gain valuable insights into the future of all user interface technology.
{% details What it is about? %}
-<iframe width="560" height="315" src="https://www.youtube.com/embed/1aFiJDHtRiY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+<!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/1aFiJDHtRiY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+
+<!-- Highly recommend this course to be [mandatory in CS]... I will keep the lessons learned and try to apply them in my career wherever applicable. -- 2023 student. -->
+<!-- {: .quote} -->
+
+<!-- Even though I have a lot of experience with implementing accessibility in code and pushing for more accessible designs at work, I have learned a lot from this course [that I plan to take back into my workplace] -- 2023 student -->
+<!-- {: .quote} -->
-Highly recommend this course to be [mandatory in CS]... I will keep the lessons learned and try to apply them in my career wherever applicable. -- 2023 student.
+I almost feel like this class should be mandatory for anyone in Computer Science, especially people who want to work in frontend dev work that allows for direct interaction with customers
+-- 2023 student
{: .quote}
-Even though I have a lot of experience with implementing accessibility in code and pushing for more accessible designs at work, I have learned a lot from this course [that I plan to take back into my workplace] -- 2023 student
+I think this is one of the classes where I learned the most in all the classes I have taken here. As someone with invisible disabilities, I never realized how much of a world there is and learned a lot about myself alongside the material. -- 2023 student
{: .quote}
+It is a class I would instantly recommend anyone to take in terms of the content and just how welcoming it is for anyone to learn this insanely important topic. It is a top 3 class in the whole CSE department for me -- 2023 student ... I think I'll be using the things I learned for the rest of my career.
+-- 2023 student
+{: .quote}
+
How can computing enable new solutions to accessibility, including both access to the world and access to computers? Similarly, how can a disability studies perspective guide us in developing empowering and relevant solutions to accessibility problems? This course explores both of those questions through a combination of discussions, reading, and building. In addition, by studying access technology, we can gain valuable insights into the future of all user interface technology.
-Access technology (AT) has the potential to increase autonomy, and improve millions of people’s ability to live independently. In addition, accessibility is a human rights issue and it is the law. If you're creating interactive technologies, you should know how to build regular interfaces that are accessible as well as understanding the value of innovating new approaches to accessibility. Disability touches almost everyone either directly or indirectly at some point in life, temporarily or permanently. Let’s create a future we will also want to and be able to be part of.
+Access technology (AT) has the potential to increase autonomy, and improve millions of people’s ability to live independently. In addition, accessibility is a human rights issue and it is the law. If you're creating interactive technologies, you should know how to build regular interfaces that are accessible as well as understanding the value of innovating new approaches to accessibility. Disability touches almost everyone either directly or indirectly at some point in life, temporarily or permanently. Let’s create a future we will also want to and be able to be part of.
-In this course we will focus on a combination of practical skills such as how to assess accessibility of documents, websites and apps and how to do disability based UX; advanced skills such as how to address accessibility in visualization, AR/VR and AI/ML; and forward looking topics such as intersectional concerns, accessible healthcare, and accessibility in disaster response. The largest project in the class will be an open ended opportunity to explore access technology in more depth. We will also cover disability justice and advocacy.
+In this course we will focus on a combination of practical skills such as how to create accessible of documents, websites and apps and how to do disability based UX; advanced skills such as how to address accessibility in visualization, AR/VR and AI/ML; and forward looking topics such as intersectional concerns, accessible healthcare, and accessibility in disaster response. The largest project in the class will be an open ended opportunity to explore access technology in more depth. We will also cover disability justice and advocacy.
{% enddetails %}
@@ -31,13 +44,14 @@ In this course we will focus on a combination of practical skills such as how to
The only requirement for this class is that you are comfortable programming and picking up new languages and tools that you have not been exposed to before. You will have some control over this, however, basic web skills are likely to be useful. The primary programming project in this class is one you design yourself.
-In addition, please familiarize yourself with the course [academic conduct]({{site.baseurl}}/academic-conduct.html) policy. We will grade on the assumption that you have read and understood it, and there will be penalties if you do not follow these policies. These will be determined on a case by case basis, but at a minimum:
+In addition, please familiarize yourself with the course [academic conduct]({{site.baseurl}}/academic-conduct.html) policy. Looking beyond policy, plagiarizing is a violation of disability justice and in direct conflict with the learning goals of this course.
+
+We will grade on the assumption that you have read and understood it, and there will be penalties if you do not follow these policies. These will be determined on a case by case basis, but at a minimum:
- If you plagiarize you will receive a 0 on participation for that assignment
- If you plagiarize on any assignment, you will receive a non-competent on your disability justice competency
{% enddetails %}
-
{% details What is the Teaching Philosophy and Approach? %}
Many of the goals in this class center around learning by doing. This
@@ -62,14 +76,20 @@ in learning exercises.
{% enddetails %}
-# Logistics
+# Logistics
+
+This is an in person class. As much as possible, we ask that you
+attend in person. That said, we know that many individual concerns may
+make this a barrier. We will do our best to support remote
+participation when there is a need for this due to a family
+obligation, disability, or other concern.
{% details When and Where is the Class Held? %}
See [Canvas]({{site.canvas}}) for all zoom meeting links for classes and office hours.
-- **Class Time:** Monday/Wednesday/Friday 3:30-4:20PM (PDT)
-- **Class Location:** [ECE 037](https://www.washington.edu/classroom/ECE+037)
+- **Class Time:** {{site.time}} (PDT)
+- **Class Location:** {{site.room}}
- **Section Time:**
- 2:30-3:20 [GUG 218](https://www.washington.edu/classroom/GUG+218)
- 3:30-4:20 [MGH 271](https://www.washington.edu/classroom/MGH+271)
@@ -81,23 +101,19 @@ See [Canvas]({{site.canvas}}) for all zoom meeting links for classes and office
|-------------------------------------------------------------------------|------------------------------------------------------------|-----------------|
| {:width="80px"} | [Jennifer Mankoff]({{site.author.url}}) (she/her) | Instructor |
-| {:class="ta-picture"} | [Venkatesh Potluri](https://venkateshpotluri.me/) (he/him) | TA |
-| {:class="ta-picture"} | [Jesse Martinez](https://homes.cs.washington.edu/~jessejm/) (he/him) | TA |
-| {:class="ta-picture"} | [Dhruv Khanna](https://dhruv-khanna-portfolio.onrender.com/) (he/him)| Course Assistant |
+| {:class="ta-picture"} | [Aashaka Desai](aashakadesai.github.io) (she/her) | TA |
<BR>
**Office Hours**
-|----------------|------------|-------------|-------------------------------------------------|
-| Day | Time | Who | Where |
-| Tuesdays | 3-4pm | Jen Mankoff | [Canvas]({{site.canvas}}) |
-| Wednesdays | 11:30-12pm | Jen Mankoff | 211 Gates |
-| Mondays | 10:30-11:30AM | Venkatesh Potluri | in-person location [Bill and Melinda Gates Center](https://www.engr.washington.edu/about/bldgs/cse2) 121. [zoom link](https://blvi.dev/493e-au23-oo) |
-| Fridays | 1:30-2:30pm | Jesse Martinez | Gates 131 |
-| | | | |
-| Asynchronous | | Any | Post to [discussion board]({{site.discussion}})* |
-| By Appointment | | Any | Post to [discussion board]({{site.discussion}}) |
+|----------------|--------|-----|--------------------------------------------------|
+| Day | Time | Who | Where |
+| Monday | 10-11 | Jen | Online (also this is tentative)) |
+| Wednesday | 2-2:30 | Jen | CSE 2, room 214 |
+| Thursday | 12-1 | Aashaka | Online (Zoom TBD) |
+| Asynchronous | | Any | Post to [discussion board]({{site.discussion}})* |
+| By Appointment | | Any | Post to [discussion board]({{site.discussion}}) |
@@ -125,31 +141,49 @@ Another great way to meet students is to come to class in person!
{% enddetails %}
+{% details How does Synchronous Remote Participation work? %}
+
+When you are remote, ideally you will still participate synchronously. To participate synchronously, you need to do the following:
+
+1. Post in [the class discussion]({{site.discussion}}/4631278) to find or report who your zoom buddy is
+2. Attend via zoom and participate in discussions with the help of your zoom buddy
+3. Report who your zoom buddy was, and how you participated, in your weekly survey
+
+{% enddetails %}
+
+{% details Will lectures be recorded? %}
+
+Class sessions **will be recorded** when possible (guest lecturers may
+refuse this). Recordings will only be accessible to students enrolled
+in the course to review materials.
+
+The University and Zoom have FERPA-compliant agreements in place to
+protect the security and privacy of UW Zoom accounts.
+
+Students who connect by Zoom but do not wish to be recorded should:
+- Change their Zoom screen name to a school appropriate screen name
+that hides any personal identifying information such as their name or
+UW Net ID
+- Not share their computer audio or video during their Zoom sessions (please notify us first!).
+
+{% enddetails %}
+
# How is COVID safety handled in this class?
-All policies below are designed to match guidance from the [University
-of Washington](https://www.washington.edu/coronavirus/spring2022/). It
-is possible for guidance to change as the pandemic evolves over the
-coming months, so we will update this page as rules/regulations
-change. Much of this text was copied and modified with permission from
-[CSE 163](https://courses.cs.washington.edu/courses/cse340/22wi/covid-safety.html)
-and [CSE 340](https://courses.cs.washington.edu/courses/cse163/22sp/covid_safety/).
+Masking is currently optional, however people in the room include those who are high risk with respect to COVID and people who live with vulnerable family members. Masks offer another layer of protection to further reduce the risk of transmission for all of us, and help to support these individuals. Thus, in this class, wearing a mask indoors when around others is recommended, and I ask that you attend class remotely if you are sick or have potentially been exposed to COVID-19.
{% details Why are masks passed around in class? %}
-Masking is currently optional, but ``strongly recommended indoors'' according to the [UW face covering policy](https://www.ehs.washington.edu/covid-19-prevention-and-response/face-covering-policy).
+According to the [UW face covering policy](https://wwwb.ehs.washington.edu/covid-19-prevention-and-response/face-covering-policy).
-In this class, people in the room include those who are high risk with respect to COVID and people who live with vulnerable family members. To help support the needs of these individuals, masks will be available in the classroom as you enter, and if you would like to mask, you are welcome to make use of them.
-
-When masking, UW's masking policy states
-> University strongly recommends wearing a well-fitted, high-quality mask indoors (e.g., KN95, N95, KF94 and surgical masks) to reduce the potential for transmission. High-quality masks are available at no cost in several locations on each campus. University units can purchase high-quality facemasks from the Safe and Clean Storefront.
+>As part of the University’s multi-layered strategy to limit the transmission of COVID-19, face coverings, particularly well-fitting, high-quality masks (e.g., N95, KN95, surgical mask) remain a useful tool in helping to limit the spread of COVID-19.
+To help support the access needs of these individuals, masks will be available in the classroom as you enter, and if you would like to mask, you are welcome to make use of them.
{% enddetails %}
{% details When should I attend remotely? %}
If you are sick or have potentially been exposed to COVID-19, **stay home**. We will not be
assessing you on attendance, so you will not be penalized for missing class to keep our community safe.
-See more [here](https://www.washington.edu/coronavirus/faq/#health).
Below, we briefly describe the accommodations for students having to miss class due to potential
illness, with full information in the linked pages.
@@ -166,7 +200,6 @@ illness, with full information in the linked pages.
{% enddetails %}
{% details Do I need to maintain social distancing? %}
-
Vaccinations and masking provide strong protection against the spread of COVID. Currently, UW does
not require social distancing in the classroom or office hours for students who are vaccinated and
wearing a mask.
@@ -175,17 +208,15 @@ Of course, some students might feel more comfortable keeping a little distance.
to keep space between you and another student, please kindly ask them to leave a space between you
and them if there is room available. Similarly, if someone asks you to maintain a space
between them, please respect that request if possible.
+
{% enddetails %}
-{% details What if I get sick? %}
+{% details What if I get sick or may have been exposed to COVID-19?%}
-See [this FAQ](https://www.washington.edu/coronavirus/faq/) by UW on what you should do if you get
+See [this FAQ](https://www.ehs.washington.edu/covid-19-prevention-and-response/covid-19-case-and-exposure-guidance) by UW on what you should do if you get
sick. You should also check out the [Remote Access](#remote-access) options listed above!
-{% enddetails %}
-
-{% details What if I am potentially exposed to COVID-19? %}
-Follow the recommendations outlined in this
+If you believe you have been exposed to COVID-19, follow the recommendations outlined in this
[flowchart by EH&S](https://www.ehs.washington.edu/system/files/resources/COVID-19-public-health-flowchart.pdf).
{% enddetails %}
@@ -283,44 +314,6 @@ times. However if we can do something to improve this further, or you have needs
# Expectations and Grading
-{% details What are the participation requirements for this class? %}
-
-This is an in person class. As much as possible, we ask that you
-attend in person. That said, we know that many individual concerns may
-make this a barrier. We will do our best to support remote
-participation when there is a need for this due to a family
-obligation, disability, or other concern.
-
-If you participate remotely, or miss a class, you may be asked to
-engage in additional work before, after, or during lecture to ensure
-that you have the most similar experience possible to students who are
-in person.
-
-{% enddetails %}
-
-{% details Will lectures be recorded? %}
-
-Class sessions **will be recorded** when possible (guest lecturers may
-refuse this). Recordings will only be accessible to students enrolled
-in the course to review materials.
-
-The University and Zoom have FERPA-compliant agreements in place to
-protect the security and privacy of UW Zoom accounts.
-
-{% enddetails %}
-
-{% details What if I don't want to be recorded? %}
-
-Students who connect by Zoom but do not wish to be recorded should:
-- Change their Zoom screen name to a school appropriate screen name
-that hides any personal identifying information such as their name or
-UW Net ID
-- Not share their computer audio or video during their Zoom sessions (please notify us first!).
-
-{% enddetails %}
-
-{% details What is the classes Grading Philosophy? %}
-
While grading is a necessary part of what we do at UW, I want to focus
this class on learning; and to ensure that my approach to assessment
is inclusive and focuses on a justice based approach. There has been a
@@ -331,10 +324,7 @@ years, driven partly by COVID-19. We have tried to learn from this in our gradin
**There will not be quizzes, or a midterm or final exam**. Instead, your knowledge will be assessed
[Competency based
grading](https://aurora-institute.org/cw_post/cbe-in-practice-grading/) in alignment with the disability justice focus in this
-course.
-
-{% enddetails %}
-
+course. A portion of your grade will also be based on participation and effort.
{% details What is "*Competency Based Grading*"? %}
[Competency based
@@ -361,69 +351,58 @@ to help assign a score on that learning goal.
The competencies needed for this course are listed on the [assignments
page](assignments/index.html), and can all be found in canvas as well.
-There are three categories of Competency, each with four skills you
-need to learn: (1) Accessible Media and Documents (2) Accessibility
-Compliance and (3) Disability Awareness and Justice.
-
-Your highest score on each skill *in any assignment* determines your
-grade on that skill. In addition, you may request regrades. When you
-are graded on a skill, we rate your skill as "no evidence" "below
-competent" "basic knowledge" or "excellent". Various combinations of
-"basic" "excellent" and "below competent" result in other grades.
-
-The table below shows how scores will be converted to a grade. Note
-that if even 1 skill in a competency category is below competence
-(**!Comp**), the highest possible grade is 75% in that competency
-category. Assuming that you are at least competent in all skills, your
-grade is based on how many skills are excellent versus competent. You
-have to be excellent in all 4 skills to get to 100; at least 3 to get
-to 95%; and at least 2 to get to 85%. Your final score on your
-competencies is an average of your competence in each category.
-
-{:class="page-picture"}
-
-
-| Outcome Category | Score | | 100% | 95% | 85% | 75% | TBD |
-|------------------|-----------|----|------|-----|-----|-----|-----|
-| Media/Docs | !Comp | <= | 0 | 0 | 1 | 2 | 3 or more |
-| (All = 5) | Excellent | >= | 4/4 | 3/4 | 2/4 | 1/4 | 1 or less |
-| Compliance | !Comp | <= | 0 | 0 | 1 | 2 | 3 or more |
-| (All = 5) | Excellent | >= | 4/4 | 3/4 | 2/4 | 1/4 | 1 or less |
-| Justice | !Comp | <= | 0 | 0 | 1 | 2 | 3 or more |
-| (All = 5) | Excellent | >= | 4/4 | 3/4 | 2/4 | 1/4 | 1 or less |
+
+Each time you turn in an assignment, you tell *us* which competencies
+we should assess. We may also assess competencies such as
+whether a document is accessible, with accessible image descriptions.
+If an assignment is *not* accessible we *will not assess any
+competencies in it*. Once you achieve competency, we expect you to
+maintain it -- for example, repeatedly turning in inaccessible images
+after achieving competency in image descriptions will lower your
+score.
+
+When you we assess a competency, we rate your skill as "no evidence"
+"below competent" "basic knowledge" or "excellent". Various
+combinations of "basic" "excellent" and "below competent" result in
+various final grades in the class, with all excellents being a 4.0 and
+the grade going down based on the number of competents versus
+excellents. However, if even 1 skill is below
+competence, the highest possible grade in the class is a 3.2.
You can
view your progress on each competency in Canvas (Excellent is called
-"Mastery" there). **Open up the category to see individual
-competencies; and click on the competency to see details on whether
+"Mastery" there). **Click on the competency to see details on whether
you are "competent" or "excellent"**.
{% enddetails %}
{% details What else will I be graded on? %}
-Grades will be assigned in three categories: Assignment completion, effort, and competencies.
-
-### 80%: Competencies
-Competencies are 80% of your grade in the class. See the previous
+### 85%: Competencies
+Competencies are 85% of your grade in the class. See the previous
question for details on how a grade is calculated from your
competencies.
-### 10%: Assignment Completion
-Assignment completion is 10% of your grade. This is listed as the "participation" competency for each assignment in canvas. The weight of each assignment is simply the number of weeks long it is, so a longer assignment would contribute more to your assignment completion grade than a shorter one.
+Your scores on these competencies determine your grade as follows:
-### 10%: Effort
+- Base grade: Number of Competents/2.5 + Number of Excellents/2
+- Final grade: Base grade - (Number of Non-Competents/2)
+### 15%: Assignment Completion, Participation and Effort
Your effort grade will reflect your participation in the class across
-multiple dimensions such as whether you participated in discussions
-and exercises in class (self reported) and whether you participated in
-discussions outside of class (based on your submissions).
+multiple dimensions such as whether you answerd reading questions;
+participated in discussions and exercises in class (self reported);
+and to what degree you completed all assignments.
+
+If you participate remotely, or miss a class, you may be asked to
+engage in additional work before, after, or during lecture to ensure
+that you have the most similar experience possible to students who are
+in person.
{% enddetails %}
{% details Does the class have a regrading policy? %}
-
Reflecting on feedback is one of the most valuable ways you can learn
from your mistakes, and we encourage you to do so.
It is also possible for the graders to make mistakes. If that happens
@@ -446,3 +425,4 @@ the assignment and your grade in detail**.
+
diff --git a/jekyll-theme-cayman.gemspec b/jekyll-theme-cayman.gemspec
deleted file mode 100755
index d49581b2fd6860133461fef36202dc1c23be3361..0000000000000000000000000000000000000000
--- a/jekyll-theme-cayman.gemspec
+++ /dev/null
@@ -1,20 +0,0 @@
-Gem::Specification.new do |s|
- s.name = 'jekyll-theme-cayman'
- s.version = '0.1.1'
- s.license = 'CC0-1.0'
- s.authors = ['Jason Long', 'GitHub, Inc.']
- s.email = ['opensource+jekyll-theme-cayman@github.com']
- s.homepage = 'https://github.com/pages-themes/cayman'
- s.summary = 'Cayman is a Jekyll theme for GitHub Pages'
-
- s.files = `git ls-files -z`.split("\x0").select do |f|
- f.match(%r{^((_includes|_layouts|_sass|assets)/|(LICENSE|README)((\.(txt|md|markdown)|$)))}i)
- end
-
- s.platform = Gem::Platform::RUBY
- s.add_runtime_dependency 'jekyll', '~> 3.1'
- s.add_runtime_dependency 'jekyll-seo-tag', '~> 2.0'
- s.add_development_dependency 'html-proofer', '~> 3.0'
- s.add_development_dependency 'rubocop', '~> 0.50'
- s.add_development_dependency 'w3c_validators', '~> 1.3'
-end
diff --git a/projects/app_designs.png b/projects/app_designs.png
new file mode 100644
index 0000000000000000000000000000000000000000..a87d4150433b61c9a242bfdaf97f05eaf7d2fd29
Binary files /dev/null and b/projects/app_designs.png differ
diff --git a/projects/app_interfaces.png b/projects/app_interfaces.png
new file mode 100644
index 0000000000000000000000000000000000000000..423bb74f37ca770c34341c0515ec6edd8ad8eed2
Binary files /dev/null and b/projects/app_interfaces.png differ
diff --git a/projects/artwork.md b/projects/artwork.md
new file mode 100644
index 0000000000000000000000000000000000000000..35fdba6eb601f22651241fc17986f440bdafc155
--- /dev/null
+++ b/projects/artwork.md
@@ -0,0 +1,169 @@
+---
+layout: default
+title: Art Insight
+description: Engaging with children’s artwork in mixed-ability families
+---
+
+# Engaging with Children’s Artwork in Mixed-Ability Families
+
+## Introduction
+
+Creating art is a fundamental part of childhood, cherished by both children and parents as a means to connect and bond over their children’s artistic expressions. For children, creating art is a way to express their emotions, imagination, and experiences. For parents, viewing and discussing their children's artwork is a way to understand their child's world, encourage their creativity, and foster emotional connections.
+
+However, for parents who are blind or have low vision (BLV), engaging with their sighted children’s artwork poses unique challenges. Traditional methods of interacting with visual art rely heavily on sight, which can make it difficult for BLV parents to fully appreciate and discuss their children’s creations. This gap in engagement can impact the emotional connection and understanding between parents and their children, potentially affecting the child’s confidence and the parent-child relationship.
+
+Our project aims to address this challenge by developing an iOS app that uses AI-generated descriptions to help BLV parents engage with their children’s artwork. The app leverages advanced GPT-APIs to create detailed, vivid descriptions from pictures of children’s artwork, which parents can then explore using voiceover, high-contrast, and magnification settings. This tool not only facilitates self-exploration of the artwork but also enables BLV parents to have meaningful conversations with their children about their creations, thus bridging the gap caused by visual impairment. By incorporating feedback from formative research with BLV parents and their children, our app is designed to meet the specific needs of mixed visual ability families. The inclusion of a human-in-the-loop system allows children and parents to edit the AI-generated descriptions, ensuring accuracy and personal relevance. This collaborative approach not only improves the quality of the descriptions but also empowers both parents and children to contribute to the understanding and appreciation of the artwork. By ensuring that BLV parents can actively engage with and discuss their children’s artistic expressions, we aim to enhance the emotional bonds within mixed-ability families and support the developmental growth of children through positive reinforcement and shared experiences.
+
+In addition to addressing the immediate needs of BLV parents, our app also contributes to the broader goals of accessibility and inclusion. By demonstrating how technology can be used to create inclusive experiences, we hope to inspire further innovations that support diverse needs and promote equity in family interactions and beyond. With this project, we envision a future where all parents, regardless of their visual abilities, can fully participate in their children’s creative journeys, fostering a more inclusive and understanding world for everyone.
+
+
+*Figure 1: Images of different children's artworks*
+
+## Positive Disability Principles
+
+**1.** Our project is not ableist and aims to make children’s artwork more accessible to BLV parents. The formative work guiding this project ensures that our technology solution is not a “disability dongleâ€.
+
+**2.** BLV family members and their children have guided this work, primarily through the findings from formative studies as previously mentioned. In the future, we hope to co-design and evaluate any technology outputs of this work with mixed visual ability families.
+
+**3.** Our project aims to improve the agency of people with disabilities by providing BLV parents a supplemental understanding of their children’s artwork which they can use to further engagements with their children.
+
+**4.** While we are not addressing multiple disabled people (such as deafblind individuals) through this work, as that would require more formative understanding, we have consulted with multiple different BLV individuals and their children. Additionally, the formative work has looked at a wide range of relative-child relationships: parent-child, grandparent-grandchild, great-grandparent-great-grandchild, aunt/uncle-niece/nephew. This ensures that our solutions work not only for BLV parents and their children but also for other BLV-sighted family relationships.
+
+**5.** All technology produced through this work is accessible to BLV individuals. We tested our app with VoiceOver and other accessibility settings like magnification and high-contrast. We have also avoided cognitively overloaded designs, and used plain language wherever possible in our application. We used standard digital design tools such as PowerPoint or Figma, which have been audited and tested for accessibility, during our design phase.
+
+## Related Work
+
+Several projects and studies have informed our approach to making children’s artwork accessible to BLV parents.
+
+### User-Centered Design in Accessibility
+
+User-centered design principles are crucial in accessibility projects. Previous studies emphasize the importance of involving end-users in the design process to create solutions that truly meet their needs. Hence, the research mentioned above has been conducted with BLV parents and children, ensuring that the app is both usable and valuable in the mixed-ability settings.
+
+### AI-Generated Descriptions
+
+Previous work has explored the use of AI to generate descriptions for visual content. Projects like Microsoft's Seeing AI and Google's Lookout provide insights into the capabilities and limitations of AI in generating useful descriptions for visually impaired users.
+
+### Technology in Mixed-Ability Family Interactions
+
+Prior research in mixed-ability family settings includes work by [Park, S., Cassidy, C.T., & Branham, S.M. (2023). “It’s All About the Pictures:†Understanding How Parents/Guardians With Visual Impairments Co-Read With Their Child(ren). Proceedings of the 25th International ACM SIGACCESS Conference on Computers and Accessibility.](#formative-research1) and [Storer, K.M., & Branham, S.M. (2019). "That's the Way Sighted People Do It": What Blind Parents Can Teach Technology Designers About Co-Reading with Children. Proceedings of the 2019 on Designing Interactive Systems Conference.](#formative-research2), who explore the design of technology for co-reading interactions between BLV parents and their children, approaching the BLV parent's perspective through observational and interview studies like we do in our work. However, prior research has not investigated technology facilitating a mixed visual-ability family's interaction regarding children's artwork.
+
+### Formative Work [In Submission]
+
+A member of our team led formative work that is in submission [Anonymous Authors, “Engaging with Children’s Artwork in Mixed Visual Ability Families,†in Proceedings of the ACM SIGACCESS, 2024.](#formative-research3) to investigate what motivates BLV relatives to engage with their children’s artwork, current practices by BLV relatives and their children to discuss and adapt the child’s artwork, BLV adults and sighted children’s reactions to AI interpretations of the child’s artwork, and the families’ collective responses to the technology design probes. These research questions were explored through two studies: the first was with 14 BLV individuals, and the second study was with 5 BLV relative and sighted children groups. These studies consisted of semi-structured interviews, using two different AI tools to describe children’s artwork (provided by the BLV family members), and two in-person design probes to evaluate preferred technology representation mediums for nonvisual understanding of children’s artwork. Through these studies, researchers found that BLV family members are motivated by a desire to emotionally connect and bond with their child, as well as a need to understand their child’s developmental growth and skills. While many BLV individuals found some benefits to AI descriptions, saying that some information was better than none and it enabled them to have a conversation or ask questions to their children, some parents did not like it when the AI used simplistic or reductive language to explain their child’s art. These findings specifically around the role and language of AI have heavily informed this present work.
+
+## Methodology and Evaluation
+
+### Project Design
+
+We designed an iOS app that uses ChatGPT to generate detailed descriptions from pictures of children's artwork. The app includes essential accessibility features such as voiceover compatibility, high-contrast visual settings, and an intuitive navigation system to ensure ease of use for BLV users. The design process was iterative, involving multiple rounds of feedback from BLV parents and their children to ensure the app met their specific needs.
+
+### Implementation
+
+Our major contributions in the final project include:
+
+- **Finalizing Designs**: We completed the designs for our app, including detailed interaction flows for users. This involved creating wireframes and prototypes using accessible digital design tools like Figma, which were audited for accessibility (Shown in [Figure 2](#figure-designs)).
+- **Prompt Engineering**: We performed extensive prompt engineering to ensure comprehensive and accurate artwork descriptions. We validated the relevance of the prompt by comparing outputs from a custom GPT model (ArtInsight) and GPT-4o.
+
+ Final Prompt:
+
+ > "This assistant helps blind parents understand their childrens visual artwork. It provides detailed, respectful descriptions of the artwork, focusing on descriptive aspects such as orientation, scenery, number of artifacts or figures, main colors, and themes. The assistant avoids reductive or overly simplifying language that minimizes the childs effort and does not assume interpretations if uncertain. For example, it says, ‘The person has a frown, and there are tears falling from their eyes’ instead of ‘The person appears to be sad.’ When given feedback from the parent or child about the artwork, the assistant honors and integrates this perspective into its descriptions and future responses. The assistant maintains a respectful, supportive, and engaging tone, encouraging open dialogue about the artwork. This assistant uses a casual tone but will switch to a more formal tone if requested by the parent or child. The assistant avoids making assumptions about names or identities based on any text in the artwork."
+
+- **Core functionality**: We built the core functionality of the app to process images and generate descriptions using ChatGPT. This included integrating with the iPhone camera and third-party libraries to upload images and process them ([Click here for app demo](https://drive.google.com/file/d/1IIV68pUCShIby07sAVK6CLpHyGJWEWYf/view?resourcekey)).
+- **Voice Memo Integration**: We incorporated a UI feature that allows children to record voice memos describing their artwork, which can be saved and reviewed by BLV parents (The UI of our app is shown in [Figure 3](#figure-app-ui)).
+- **Human-in-the-loop system**: Although out of scope for the current phase, we plan to implement a system that allows users to edit AI-generated descriptions, ensuring they are accurate and personally relevant.
+
+#### Salient Features of the iOS app
+
+- Integrates with iOS accessibility settings (success criterion)
+- Additional, custom VoiceOver and dynamic-type support (success criterion) - It is an iOS / MacOS feature which automatically scales text according to user preference (includes large, accessible fonts)
+- Integrates with iPhone camera via third-party library
+- Core functionality: Uploads image, Asks custom GPT for a description, Polls for response ([Click here for app demo with the Dynamic Type Support](https://drive.google.com/file/d/1sT7chRJkPt9kCuQuaDs2ODw9QF0FjDqA/view?resourcekey))
+
+### Metrics and Validation
+
+These are some metrics for success that we considered:
+
+- **VoiceOver Compatibility**: We conducted manual tests to ensure that all interactive elements are correctly labeled and accessible via VoiceOver.
+- **Contrast Ratio**: We verified that the app meets the minimum contrast ratio requirements (4.5:1 for normal text and 3:1 for large text) as per the Web Content Accessibility Guidelines (WCAG).
+- **Error Handling**: We tested the app for robustness by inputting various types of images, including very complex, very simple, or irrelevant images, and ensure that the app handles errors gracefully without crashing.
+- **AI Descriptions Match Formative Work Guidelines**: We validated that our custom GPT described all elements of the artwork in appropriate language, and was not reductive, simplistic, and presumptive.
+
+#### Success Criteria for AI Descriptions
+
+We evaluated the AI descriptions of 10 different artworks created by children using GPT-4o and our custom GPT (ArtInsight). We measured the number of elements identified, usage of reductive language, simplistic descriptions, and presumptive statements.
+
+Performance Comparison:
+
+- Art Insight performed better than GPT 4o on 6/10 different drawings.
+- GPT 4o performed better than Art Insight on 1/10 drawings.
+- Both (Art Insight and GPT 4o) had equal performance on 3/10 drawings.
+
+These metrics and validation steps ensured that our app met the necessary accessibility standards and provided meaningful, accurate descriptions of children’s artwork.
+
+These are some other metrics for success (Out of Scope):
+
+- **Usability**: We plan to evaluate our app through user testing sessions with BLV parents.
+- **Accuracy**: We plan to compare AI-generated descriptions with a set of reference descriptions created by sighted individuals.
+- **Engagement**: We plan to measure the frequency and quality of interactions between parents and children facilitated by the app.
+
+
+*Figure 2: Different UI screens indicating different states of the Children's artwork app*
+
+
+*Figure 3: Screenshots of the app interface showing screens to capture an artwork and show the AI-generated description*
+
+## Results
+
+The project has made significant strides in developing a tool that addresses a critical need for BLV parents, enabling them to engage more deeply with their children's artwork. The initial technical achievements and validation of core accessibility features provide a solid foundation for further refinement and user testing.
+
+#### Technical Achievements
+
+- **Accessible Design**: The app's design adheres to accessibility principles, ensuring that BLV parents can navigate and use the app effectively. Features like voiceover compatibility and high-contrast settings have been tested and validated.
+- **Accurate Descriptions**: The custom GPT model (ArtInsight) has demonstrated the ability to generate detailed and respectful descriptions of children’s artwork, aligning closely with the guidelines established from our formative research.
+- **Robust Error Handling**: The app has proven to handle a variety of image inputs without crashing, maintaining stability and reliability.
+
+<!--
+Our findings indicate that the app significantly enhances BLV parents' ability to engage with their children's artwork. Users reported that the AI-generated descriptions were generally accurate and helpful, and the ability to edit these descriptions ensured personal relevance. The app's accessibility features, such as voiceover support and high-contrast mode, were well-received and effectively facilitated independent exploration of the artwork.
+-->
+
+## Disability Model Analysis
+
+### Leadership of Those Most Impacted
+
+Our project is guided by findings from formative research consisting of interviews with BLV family members and their sighted children. As such, our project places the perspective of BLV relatives at the center of our work.
+
+### Recognizing Wholeness
+
+While there is a large body of valuable research dedicated to making productivity tools more accessible to people with visual impairments, it is important to recognize that all of our lives encompass so much more than work. With that in mind, this project focuses on aspects of life outside of work and productivity.
+
+### Interdependence
+
+The formative work for this project observed interactions between both the BLV relative and their sighted children, recognizing that artwork engagement in families is an interdependent practice where the relative and child work in support of each other.
+
+## Learnings and Future Work
+
+### Learnings
+
+Through this project, we learned the importance of involving end-users in the design process. Feedback from BLV parents and their children was invaluable in shaping the app's features and ensuring its relevance. We learnt how to build an accessible iOS app while integrating GPT APIs. We defined various success metrics for validating our work, and also recognized the potential of AI in generating meaningful descriptions. However, we noted the necessity of human oversight to ensure accuracy and personal connection.
+
+### Future Work
+
+Future work will focus on expanding the app’s capabilities to include more interactive features, such as voice memos from children describing their artwork. We also plan to explore integrations with other accessibility tools and conduct long-term studies to assess the app’s impact on parent-child relationships. Additionally, we aim to refine the prompts to improve the accuracy and emotional depth of the descriptions.
+
+We will focus primarily on implementing the human-in-the-loop system, conducting extensive user testing, and continuously improving the app based on user feedback. This iterative process will ensure that the app remains relevant, effective, and truly beneficial for BLV parents and their children. Specific next steps include:
+
+- Refining the instructions given to the AI for higher accuracy and emotional depth in descriptions.
+- Incorporating the child’s voice descriptions into the AI-generated descriptions for a more personalized experience.
+- Exploring the app's role as an interactive agent that suggests questions or prompts users to collect more data.
+
+## References
+
+[Park, S., Cassidy, C.T., & Branham, S.M. (2023). “It’s All About the Pictures:†Understanding How Parents/Guardians With Visual Impairments Co-Read With Their Child(ren). Proceedings of the 25th International ACM SIGACCESS Conference on Computers and Accessibility.](#formative-research1)
+
+[Storer, K.M., & Branham, S.M. (2019). "That's the Way Sighted People Do It": What Blind Parents Can Teach Technology Designers About Co-Reading with Children. Proceedings of the 2019 on Designing Interactive Systems Conference.](#formative-research2)
+
+[Anonymous Authors, “Engaging with Children’s Artwork in Mixed Visual Ability Families,†in Proceedings of the ACM SIGACCESS, 2024.](#formative-research3)
+
+---
+
+Arnavi Chheda-Kothary, Melanie Kneitmix, and Anukriti Kumar
diff --git a/projects/artwork.png b/projects/artwork.png
new file mode 100644
index 0000000000000000000000000000000000000000..07d16b65c4f44d7c89dded085f06604ff5444fe7
Binary files /dev/null and b/projects/artwork.png differ
diff --git a/projects/emailAR.md b/projects/emailAR.md
new file mode 100644
index 0000000000000000000000000000000000000000..a75e881396300fe3b6c001835695122281403b76
--- /dev/null
+++ b/projects/emailAR.md
@@ -0,0 +1,113 @@
+---
+layout: default
+title: EmailAR
+description: Towards supporting eyes and hands-free email responses using wearable augmented reality
+---
+
+# EmailAR
+
+## Towards Supporting Eyes and Hands-Free Email Responses Using Wearable Augmented Reality
+
+Hi, I am Jae from the University of Washington. In this article, I will discuss our attempt at designing an on-the-go email composition system for wearable augmented reality (AR). The goal of this project is to empower people with musculoskeletal disorders to write email responses and maintain productivity, while also helping to prevent such disorders by reducing the necessity for poor posture when composing emails.
+
+### Introduction
+For many people, sitting or standing at a desk and looking at computer or smartphone screens can have detrimental health effects [1, 2]. Moreover, looking down at screens and typing on keyboards may be inaccessible to those with musculoskeletal disorders [3, 4]. Musculoskeletal disorders are characterized by impairments in the muscles, bones, joints and adjacent connective tissues leading to temporary or lifelong limitations in functioning and participation [5]. Globally, 1.7 billion people have musculoskeletal conditions, encompassing over 150 different diseases and conditions, including neck pain, back pain, carpal tunnel, muscular dystrophy, and paralysis [5]. Today, one of the most common causes of musculoskeletal disorders is prolonged sitting and technology use in workplace environments [6].
+
+Traditional email composition involves looking down at a laptop screen or smartphone screen and typing on a physical keyboard. However, to people with musculoskeletal disorders such as including carpal tunnel, muscular dystrophy, paralysis, and amputation, these tasks are inaccessible. A commonly used to technology to transform typing tasks into speech tasks is Dictation. Dictation, available on many current devices like iPhones and MacBooks, enable users to speak to fill in text boxes on a screen. For instance, users can select the email body, enable the Dictation feature, then speak their email content. Dictation is often used by blind or low viison (BLV) people and people with musculoskeletal disorders for tasks such as tasking notes and searching on the web. We attempted to construct an email just using Dictation. While it is often accurate, it sometimes writes duplicate sentences and it struggles with punctuation and proper nouns.
+
+To address the aforementioned limitations of traditional email writing tools and accessibility technology, we propose leveraging a pair of augmented reality (AR) glasses and a large language model (LLM) for email writing. We introduce EmailAR, a speech-based email response solution for wearable AR that enables hands- and eyes-free email writing. With EmailAR, users can see unread emails from an always-available scrollable UI panel. Users can click on an email, read it on an expanded UI panel, and respond via speech. Users only need to provide a brief summary of their email content, which an LLM uses to construct a full email response. In this class project, we implement an initial EmailAR prototype and evaluate the quality of AI-generated emails against human-written responses. Results indicate that EmailAR is capable of writing human-like responses, if given a few email samples from the users. However, EmailAR must be carefully designed, as it may not follow key disability models, including Language Justice, Leadership of Those Most Wanted in the 10 Principals of Disability Justice, and Disability Dongle.
+
+The key question is as follows: *How can we design an email composition app for wearable AR that supports hands- and eyes-free operation for individuals with upper-limb musculoskeletal disorders?*
+
+### Related Work
+Prior research has conducted interview-based studies to gather the opinions of individuals with upper body motor impairments regarding wearable AR technology. For instance, Malu et al. conducted two interview studies with people with upper-body motor impairment and found that they prefer wearable AR over traditional technologies, as they don’t have to hold the device while interacting with it, look down to see the screen, or worry about dropping their devices [7]. Additionally, McNaney et al. conducted a 5 day field study with 4 participants with Parkinson’s using Google Glasses. While participants appreciated wearable AR glasses, they expressed concerns regarding social stigma of wearing such technology [8]. Furthermore, Liu et al. conducted a semi-structured interview with 12 participants with upper-body motor impairment and found that they prefer voice or simple touch-based interactions with mobile technology [4]. Results from these interview studies suggest that wearable AR with speech input is a viable solution to support those with upper body motor impairments.
+
+We also reviewed [YouTube videos created by Ryan Hudson Peralta, an amputee and a popular Youtuber who reviews the usability and accessibility of the latest AR technologies](https://youtu.be/dncb-FlUhlM). After trying out the latest wearable AR glasses, including the Meta Quest 3 and Apple Vision Pro, he said wearable AR can empower people with upper-body motor impairment to work better and live more freely using voice and eye gaze [9]. He emphasizes the importance of voice input such as speech-to-text, as this technology allows people who cannot type to bypass physical keyboards [9]. EmailAR follows Ryan's vision of a speech-driven productivity tool.
+
+Prior studies also indicate that AI technologies such as LLMs provide an opportunity to support augmentative and alternative communication (AAC) device users by improving the quality and variety of text suggestions [10]. Most closely related to our work, in a study with 19 adults with dyslexia, Goodman et al. suggested that an LLM can support email composition tasks such as rewriting parts of an email body and coming up with an email subject line [11]. In this work, we aim to understand whether an LLM-based email writing solution for wearable AR, an AAC device receiving increasing interest [12], can support uesrs with upper limb musculoskeletal disorders.
+
+### Methodology
+A common technology used to transform typing tasks into a speech-based task is Dictation, a speech-to-text service available on Apple devices like iPhones and Macbooks. Similar features exist on Android devices as well. To activate Dictation, users first have to select a text box, then press the microphone button available on the digital and physical keyboards. Users can then speak into their devices, which will populate the selected text box with speech transcriptions. Most first-person account videos of disabled people using Dictation were of blind people taking notes and searching on the web. We tried to compose an email response ourselves relying only on Dictation. We observed that while Dictation is often accurate, it tends to repeat text. For instance, when we said “Hi, I’m doing wellâ€, Dictation typed parts of this sentence multiple times. This was more frequent on a Macbook than on an iPhone. Additionally, Dictation had trouble with punctuations, often missing or misplacing commas, periods, and exclamation and question marks. Furthermore, Dictation struggled to spell proper nouns such as people’s names. We believe this limitation will be addressed by leveraging an LLM. With an LLM, users also no longer need to speak aloud their entire email response. They can instead provide a summary of the email content and ask an LLM to construct a full email.
+
+
+
+We designed and developed EmailAR using the HoloLens 2 as our choice of wearable AR headset and GPT-4o as our selected LLM. For programming the EmailAR software, we leveraged Unity 2022.3.25f1 and the Mixed Reality Toolkit (MRTK) 2.8.3, both of which provide tools for rapidly creating an AR experience. Our initial step was to connect the HoloLens 2 with Gmail through the Gmail API. This process turned out to be complex as the HoloLens 2 does not natively support the OAUTH 2.0 protocol required for authenticating users and asking for permissions. To resolve this issue, we engineered a custom solution by creating a simple Node server. We then exposed the localhost endpoint via Ngrok. Lastly, we used this exposed URI as the redirect URI for the Gmail API. By doing so, we were able to establish a custom OAUTH 2.0 authentication loop for the HoloLens 2.
+
+Once users grant appropriate permissions, EmailAR searches for unread emails in their inbox and displays the subject and sender of each unread email within a scrollable, always-available UI panel. Users can select any email they wish to read, which will then expand into a larger UI panel showing the sender, subject, and body of the email. Moreover, users are able to respond via speech commands, dictating a brief summary of their response. This summary is sent to GPT-4o, which generates an appropriate email reply.
+
+We wanted to understand whether an LLM can generate email responses that mimic users' writing styles. To achieve this, we computed and utilized the BERT Score. BERT Score is a common metric used to evaluate an AI-generated text [13]. It compares the similarity between AI-generated text and baseline text. We sampled 13 most recent email-response pairs from five participants where they responded to someone’s email. Participants comprised of authors of this work, as uploading emails to an LLM can pose privacy risks. We randomly sampled three email-response pairs to see if an LLM can generate accurate responses to these emails. The three email samples vary in length: one short response, one medium, and one long. The other ten email-response pairs were used as contextual samples for an LLM to analyze the authors' email writing styles. Initially, we supplied the LLM with zero email examples and gradually incorporated them one at a time. Each participant asked EmailAR to compose email responses. A significant change in BERT Score would suggest that the addition of email examples enabled an LLM to write more author-like email responses.
+
+#### System Demo
+
+[We include a link to a YouTube Shorts video demonstrating how EmailAR works.](https://www.youtube.com/shorts/a0lMrjOgSeA?feature=share)
+
+
+
+### Results
+Unsurprisingly, without any email samples, GPT-4o initially performed poorly in replicating users' actual email responses. Interstingly, while providing email samples to an LLM improved its ability to construct user-like responses, having more samples did not necessarily result in greater performance. An increase in BERT Score of 1 signals a significant improvement in similarity between an AI-generated email and a human-written email. When given one email sample, the BERT Score increased by around 1 compared to the no email sample condition for short, medium, and long emails. When given five or ten email samples, the Bert Score increased by similar amounts. While we only had five participants, our results indicate that an LLM does not need a large number of email samples. This means future EmailAR systems can have a small initial questionnaire asking users to respond to a few dummy emails. This way, an LLM can mimic the user's writing style without privacy risks of accessing real emails.
+
+
+
+### Discussion
+
+#### Positive Disability Principals
+We further evaluated our project idea based on the positive disability principals:
+
+1. Is it ableist?
+
+ Our system is mostly not ableist, as it can support users with and without disabilities. It offers a new way to compose email responses that supports those with musculoskeletal disorders and helps everyone else avoid temporary disorders like carpal tunnel. However, wearable AR technology can be ableist as it is expensive and not widely available. We hope this technology will continue to become cheaper so that more people will have access. We address this point further in a later section.
+
+2. What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?)
+
+ The software system, including email viewing, writing, and editing, is accessible, as it minimizes the need to look down at screens and type on keyboards. People with musculoskeletal disorders can compose emails via speech input. However, the AR glasses hardware may not be accessible to some who cannot easily wear and manipulate glasses-like devices such as amputees (e.g., see Ryan Hudson Peralta's review of the latest AR technologies listed in the Related Work section).
+
+3. Are people with disabilities engaged in guiding this work? At what stages?
+
+ People with disabilities are involved in the planning stages. Our prototype is motivated by prior first-person accounts and interview studies, as highlighted in paragraph three of the project proposal. Additionally, Prof. Kat Steele was involved in designing our system. In this course, the primary goal is to understand whether an LLM can mimic a user’s email writing style. To minimize privacy issues of sending emails to an LLM, we may not involve people with disabilities for this course. However, once a prototype is available, we will bring in people with musculoskeletal disorders to try our system and provide feedback. Again, this may be outside the scope of this course.
+
+4. Is it being used to give control and improve agency for people with disabilities?
+
+ Our tool is designed to support people with musculoskeletal disorders to complete email tasks without having to look down at screen-based technologies like smartphones and laptops. Additionally, users can compose emails via speech instead of typing on a keyboard. Broadly, we hope that our technology will support everyone to be productive and contribute equally without barriers like musculoskeletal discomfort.
+
+5. Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)
+
+ This is a key consideration of our project. Our prototype will support users with musculoskeletal disorders. Additionally, it can benefit those wanting to prevent temporary motor impairments such as carpal tunnel. It may also be helpful to BLV people, as they also often rely on speech-to-text solutions like Dictation for typing tasks. Although the system is initially designed to support people with upper body musculoskeletal disorders, it can certainly be useful to everyone.
+
+#### Disability Model Analysis
+Due to the time constraints of the quarter system at the University of Washington, EmailAR has several limitations. We critique EmailAR using three disability models: Language Justice, Leadership of Those Most Wanted in the 10 Principals of Disability Justice, and Disability Dongle.
+
+Language Justice means making sure everyone has equal access to information, resources, and the ability to participate, regardless of the language they use. Components of EmailAR, including email display UI panel and speech recognition, only works with English. Additionally, prior research suggests that LLMs trained using primarily English data, including ChatGPT, can struggle in multilingual settings [14]. EmailAR unfortunately does not work as well in a language other than English. EmailAR should support any language the user is comfortable with.
+
+Leadership of Those Most Wanted in the 10 Principles of Disability Justice means prioritizing and centering the voices, experiences, and leadership of people who are most affected by disability in decision-making and advocacy. For EmailAR, this means involving people with upper body musculoskeletal disorders, both temporary and permanent, in the design process. While this was the original goal, we did not have enough time to conduct a user study. We instead evaluated whether an LLM can mimic users' writing styles. EmailAR, as of now, goes against the Leadership of Those Most Wanted principle. As future work, we will further improve the EmailAR prototype, then conduct a user study with our stakeholders.
+
+Throughout the course, I questioned whether EmailAR, and largely wearable AR headsets, can be a disability dongle. A disability dongle refers to a well-intentioned but poorly-designed assistive technologies created without sufficient understanding of the needs and realities faced by disabled people. Wearable AR headsets such as the HoloLens 2 are bulky and expensive, meaning assistive technologies built using such hardware cannot yet be deployed. Additionally, the disabled community has expressed concerns regarding reaffirmed dependency on others and the social stigma of wearing specialized technology [8]. However, we believe this limitation in hardware will likely be resolved with time. Even today, companies like XReal and Brilliant Labs are creating lightweight AR glasses that resemble typical glasses and sunglasses. As future work, we plan to utilize a more natural-looking, lightweight pair of AR glasses and conduct a field study or an autoethnographic study evaluating the usability of EmailAR in the real world.
+
+#### Future Work
+In summary, our future work is to:
+
+- Implement EmailAR for a lighter pair of AR glasses.
+- Improve the email display component of EmailAR.
+- Add support for multiple languages.
+- Conduct a more ecologically valid user study.
+ - Multi-day field study with participants OR
+ - Multi-month autoethnographic study
+
+### Summary of Learnings & Conclusion
+In this article, we present EmailAR, an email composition solution for wearable AR that leverages an LLM to facilitate speech-based email writing for people with upper limb musculoskeletal disorders. If done correctly, the process of email composition can be boiled down to looking ahead and dictating a verbal summary of the email content. Additionally, in our preliminary evaluation, we concluded an LLM can write user-like emails with a small number of email samples. However, it is critical to design this technology carefully by following first-person accounts and different disability models. We are excited to continue this project and potentially submit a paper to a human-computer intearction (HCI) conference.
+
+
+### References
+1. Ratan, Z. A., Parrish, A. M., Zaman, S. B., Alotaibi, M. S., & Hosseinzadeh, H. (2021). Smartphone addiction and associated health outcomes in adult populations: a systematic review. International journal of environmental research and public health, 18(22), 12257.
+2. Namwongsa, S., Puntumetakul, R., Neubert, M. S., & Boucaut, R. (2019). Effect of neck flexion angles on neck muscle activity among smartphone users with and without neck pain. Ergonomics, 62(12), 1524-1533.
+3. Naftali, M., & Findlater, L. (2014, October). Accessibility in context: understanding the truly mobile experience of smartphone users with motor impairments. In Proceedings of the 16th international ACM SIGACCESS conference on Computers & accessibility (pp. 209-216).
+4. Li, F. M., Liu, M. X., Zhang, Y., & Carrington, P. (2022, October). Freedom to choose: Understanding input modality preferences of people with upper-body motor impairments for activities of daily living. In Proceedings of the 24th International ACM SIGACCESS Conference on Computers and Accessibility (pp. 1-16).
+5. World Health Organization. Musculoskeletal health. https://www.who.int/news-room/fact-sheets/detail/musculoskeletal-conditions
+6. Centers for Disease Control and Prevention. Work-Related Musculoskeletal Disorders & Ergonomics. https://www.cdc.gov/workplacehealthpromotion/health-strategies/musculoskeletal-disorders/index.html
+7. Malu, M., & Findlater, L. (2015, April). Personalized, wearable control of a head-mounted display for users with upper body motor impairments. In Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems (pp. 221-230).
+8. McNaney, R., Vines, J., Roggen, D., Balaam, M., Zhang, P., Poliakov, I., & Olivier, P. (2014, April). Exploring the acceptability of google glass as an everyday assistive device for people with parkinson's. In Proceedings of the sigchi conference on human factors in computing systems (pp. 2551-2554).
+9. Ryan Hudson Peralta. Apple Vision Pro Accessibility Features: Navigating Without Hands. Equal Accessibility. https://www.youtube.com/watch?v=dncb-FlUhlM
+10. Valencia, Stephanie, Richard Cave, Krystal Kallarackal, Katie Seaver, Michael Terry, and Shaun K. Kane. "“The less I type, the betterâ€: How AI Language Models can Enhance or Impede Communication for AAC Users." In Proceedings of the 2023 CHI Conference on Human Factors in Computing Systems, pp. 1-14. 2023.
+11. Goodman, S. M., Buehler, E., Clary, P., Coenen, A., Donsbach, A., Horne, T. N., ... & Morris, M. R. (2022, October). Lampost: Design and evaluation of an ai-assisted email writing prototype for adults with dyslexia. In Proceedings of the 24th International ACM SIGACCESS Conference on Computers and Accessibility (pp. 1-18).
+12. Bertrand, T., Moccozet, L., & Morin, J. H. (2018, July). Augmented human-workplace interaction: Revisiting email. In 2018 22nd International Conference Information Visualisation (IV) (pp. 194-197). IEEE.
+13. Zhang, T., Kishore, V., Wu, F., Weinberger, K. Q., & Artzi, Y. (2019). Bertscore: Evaluating text generation with bert. arXiv preprint arXiv:1904.09675.
+14. Zhang, Xiang, Senyu Li, Bradley Hauer, Ning Shi, and Grzegorz Kondrak. "Don't Trust GPT When Your Question Is Not In English." arXiv preprint arXiv:2305.16339 (2023).
diff --git a/projects/emailer_images/.gitkeep b/projects/emailer_images/.gitkeep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/projects/emailer_images/emailar_demo.png b/projects/emailer_images/emailar_demo.png
new file mode 100644
index 0000000000000000000000000000000000000000..3de50cdf95c026205f0f75940abcd65553b08d7a
Binary files /dev/null and b/projects/emailer_images/emailar_demo.png differ
diff --git a/projects/emailer_images/emailar_dictation.png b/projects/emailer_images/emailar_dictation.png
new file mode 100644
index 0000000000000000000000000000000000000000..f430f9ab232c62b805288eefb472b0b5d6a8ff3f
Binary files /dev/null and b/projects/emailer_images/emailar_dictation.png differ
diff --git a/projects/emailer_images/emailar_quant_table.png b/projects/emailer_images/emailar_quant_table.png
new file mode 100644
index 0000000000000000000000000000000000000000..a76ca3a0f247bcf506fc60fc1e3e5ef0c5c54bb5
Binary files /dev/null and b/projects/emailer_images/emailar_quant_table.png differ
diff --git a/projects/images/.gitkeep b/projects/images/.gitkeep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/projects/images/website-validation.png b/projects/images/website-validation.png
new file mode 100644
index 0000000000000000000000000000000000000000..c568b8ed090eecfb7594f871c6076b64a3e920aa
Binary files /dev/null and b/projects/images/website-validation.png differ
diff --git a/projects/images/website.png b/projects/images/website.png
new file mode 100644
index 0000000000000000000000000000000000000000..45e7e57ffc017250bfea9fbaecb4b27d6d3dff01
Binary files /dev/null and b/projects/images/website.png differ
diff --git a/projects/index.md b/projects/index.md
new file mode 100644
index 0000000000000000000000000000000000000000..d6ecdb05a244be7d52226472a1ad429547187d71
--- /dev/null
+++ b/projects/index.md
@@ -0,0 +1,18 @@
+---
+layout: default
+title: Final Projects
+description: List of final projects with links
+---
+
+* TOC
+{:toc}
+
+
+The goal of the class final project is to build an accessibility technology or make an existing technology more accessible. Students focused on a variety of wonderful topics in meeting this goal.
+
+- [Art Insight](artwork.html):
+Engaging with children’s artwork in mixed-ability families
+- [Odilia](odilia.html): Contributing to an open-source screen reader
+- [EmailAR](emailAR.html): Towards supporting eyes and hands-free email responses using wearable augmented reality
+- [Intersectional Storyteller](storyteller.html) Share your story ideas, highlighting cultural and disability aspects you want to preserve, and get a story back!
+- [Teaching Accessibly](teaching.html) A Universally Designed Resource for Universal Design
diff --git a/projects/intersectional-storyteller-images/accessibility-assessment.png b/projects/intersectional-storyteller-images/accessibility-assessment.png
new file mode 100644
index 0000000000000000000000000000000000000000..56d11f3a2ac0207ce7d0e3963053e091caa9f953
Binary files /dev/null and b/projects/intersectional-storyteller-images/accessibility-assessment.png differ
diff --git a/projects/intersectional-storyteller-images/edit-page-1.png b/projects/intersectional-storyteller-images/edit-page-1.png
new file mode 100644
index 0000000000000000000000000000000000000000..eb33db35137d24dab9abd7edb440c9f5db02b813
Binary files /dev/null and b/projects/intersectional-storyteller-images/edit-page-1.png differ
diff --git a/projects/intersectional-storyteller-images/edit-page-2.png b/projects/intersectional-storyteller-images/edit-page-2.png
new file mode 100644
index 0000000000000000000000000000000000000000..b3f4cfe2a719677f6df0c5574eefb7a3876c07ca
Binary files /dev/null and b/projects/intersectional-storyteller-images/edit-page-2.png differ
diff --git a/projects/intersectional-storyteller-images/home-page.png b/projects/intersectional-storyteller-images/home-page.png
new file mode 100644
index 0000000000000000000000000000000000000000..c16be6616587802638db7461b514abbf1c1c9d36
Binary files /dev/null and b/projects/intersectional-storyteller-images/home-page.png differ
diff --git a/projects/odilia.md b/projects/odilia.md
new file mode 100644
index 0000000000000000000000000000000000000000..25bcd07f2df67ede5af44cc0b1ed6a8221e3fba4
--- /dev/null
+++ b/projects/odilia.md
@@ -0,0 +1,153 @@
+---
+layout: default
+title: Odilia
+description: Contributing to an open-source screen reader
+---
+
+# Contributing to an Open-Source Screen Reader
+
+## Overview
+Screen readers are software tools that read aloud what is on a computer screen, allowing users to interact with the computer without relying on visuals. The primary users of screen readers are blind and visually impaired people, but they can also benefit other users, such as those with dyslexia or learning disabilities.
+
+However, good screen readers are not available for all computer systems. The most popular screen readers are VoiceOver for Mac and JAWS and NVDA for Windows. While some Linux systems come pre-installed with an open-source screen reader called Orca, it has many limitations. Searching for first-person accounts from BVI Linux users, I found several Reddit posts describing the lack of accessibility features. Here are some examples:
+
+
+
+
+
+These accounts illustrate the common problems with Orca and Linux as a whole: they are difficult to install, buggy, and lack necessary features.
+
+Odilia is another open-source screen reader for Linux with some distinct advantages over Orca. Firstly, it does not rely on a particular desktop environment. Secondly, it has fewer dependencies than Orca, making it easier to install. The only other dependency is a Linux text-to-speech program called Speech Dispatcher.
+
+Despite these advantages, Odilia has not seen the widespread adoption that Orca has because it is much earlier in its development. The project has only existed for a few years and is still in Beta, meaning it is not ready for everyday use yet. For my project, I contributed to Odilia’s development to help speed up the development process and implement features that make Odilia more easy to use.
+
+## Positive Disability Principles
+Here I go discuss how the positive disibility principles relate to my work.
+
+### Is it ableist?
+This project aims to create a screen read reader, which is already a popular tool for BVI users, and similar open-source projects, such as NVDA, have been received positively by the BVI community. Given this, I don't believe this project is ableist.
+
+### What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible)?
+Being free and open source means that the Odilia source code is more accessible than some other screen readers, like VoiceOver and JAWS, and it’s free to sye. However, it is still in Beta, so it does not provide the rich feature that these other screen readers do. Additionally, the source code requires technical knowledge to understand. While the eventual goal is for Odilia to be usable for people with or without technical skills, it is not accessible to most users in its current state.
+
+### Are people with disabilities engaged in guiding this work? At what stages?
+While my work on Odilia is focused on the needs of the BVI community, they are not the primary leaders. My decision to work on a screen reader was influenced by the first-person accounts of BVI users, so the did guide which project I chose to work on. I hoped that working on an open-source project would allow be to tackle issues brough up by the users. However, because Odilia is not complete, end-users are not really submitting bug reports yet. According to their bios on the project website, at least one of the project leaders is visually impaired, but I don’t want to make assumptions about the identities of the rest of the team.
+
+### Is it being used to give control and improve agency for people with disabilities?
+I believe so. Screen readers can help BVI people be more independent by helping them use a computer without relying on others. Additionally, Linux is a popular operating system for developers, so helping to make Linux more accessible could lower the barrier of entry for BVI people wanting to develop new technologies.
+
+### Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)?
+Unfortunately, this project primarily focuses on BVI people and may leave out some intersectional identities as a result. For example, because they are speech based, screen readers are inaccessible to Deafblind people. While braille support is mentioned on Odilia’s website and a skeleton for that module exists in the codebase, it does not appear to be fully implemented yet.
+
+## Related Work
+
+### Accessibility of Open Source
+[Heron et al.](https://link.springer.com/article/10.1186/2194-0827-1-2) provide a comprehensive overview of the benefits and drawbacks of open source accessibility projects. The authors point out that many open source projects begin to address the creators' own needs, which may not be addressed by existing tools. Additionally, the large pool of contributors makes it more likely that a project will stay up-to-date, and the code being open to the public allows other developers to learn from open-source projects. However, they also point out that open-source projects often lack the resources to provide the same features as proprietary ones, and that they tend to provide little end-user documentation or technical support.
+
+
+### A11y
+[The A11y Project](https://www.a11yproject.com/) is an initiative dedicated to making technology more accessible. The project website provides resources for creating and auditing accessible websites. In addition, the word "a11y" is often used to refer to any accessible technology project, even if it is not directly tied to the A11y Project.
+
+While my work is not directly connected to web accessibility, I think it is in line with the a11y movement's goals. Two principles emphasized on the A11y Project's website are Inclusion and Opportunity; the project aims to make technology more inclusive and to create more opportunities for disabled people to participate in online spaces. Similarly, screen readers create more opportunities for disabled people to engage with computing. This also allows disabled people to become technologists and create their own accessible software.
+
+### Odilia
+[Odilia](https://odilia.app/) is the screen reader that I have chosen to work on. It is written in Rust and aims to provide some unique features:
+
+* Addons: the ability to modify Odilia with 3rd-party software
+* Optical character recognition: the ability to read text inside of images
+* Caching: Odilia's caching system dramatically improves its performance
+
+### Orca
+[Orca](https://orca.gnome.org/) is an open-source screen reader that is part of the [GNOME](https://www.gnome.org/) desktop environment. It is primarily written in Python. As mentioned in my overview, Orca is not a perfect solution, but it is currently the most popular screen reader for Linux.
+
+### NVDA
+[NVDA](https://www.nvaccess.org/about-nvda/) is an open-source screen reader for Windows. Unlike other screen readers, this project is primarily lead by BVI developers. It also has significantly more features than most other open-source options, which has made it a viable competitor JAWs and VoiceOver. According to a [WebAim survey from 2019](https://webaim.org/projects/screenreadersurvey8/), NVDA is now the most popular screen reader.
+
+Because NVDA only works on Windows, it is not a direct competitor to Odilia. However Odilia includes many similar features to NVDA, such as support for addons.
+
+## Methods and Validation
+
+### Part 1: Choosing a Screen Reader
+I had originally planned to contribute to Orca, but I was unable to do so because I couldn’t compile it on my computer. After cloning the Git repository and installing the necessary dependencies, I got the following error:
+
+```
+ERROR: Dependency lookup for atspi-2 with method 'pkgconfig' failed: Invalid version, need 'atspi-2' ['>= 2.50.0'] found '2.44.0'.
+```
+
+This was because I had an outdated version of atspi, a library that allows Linux to communicate with AT devices. However, my package manager said that I had the most up-to-date version and would not install the newest one. I asked several Linux forums but got no response, so I decided to switch to Odilia.
+
+Odilia was much easier to install because it’s written in Rust. Rust’s compiler also acts as a package manager, so it was able to install all the necessary dependencies automatically.
+
+### Part 2: Compiling and Running Odilia
+Although it compiled easily, I was not able to run Odilia on my first try. Running it produced this error:
+
+```
+Error: creating log file ‘/var/odilia/odilia.log’
+ Caused by: no such file or directory (OS error 2)
+```
+
+This is because the /var directory in Linux is used primarily for system logs and is not writable on all distros. I found an earlier conversation in the dev team’s Discord about this, where they recommended editing the config file so that it would write the log file to a different location. I pointed out that this was not an ideal solution, and that it doesn’t make sense for the log to be in the /var directory anyway. One of the project leaders agreed and made a Git issue for it. Fixing this issue was the first contribution I made to the project.
+
+### Part 3: Fixing Log Issue
+I started by reading through the code and documentation to figure out where the log file was being generated. Odilia uses an log_settings object to keep track of the default logging settings, so to change the file’s location, I just had to update the appropriate field in this object. However, this was not as simple as hard-coding a path name because I wanted to store the log in the user’s home directory, meaning the exact path would be different for every user. My initial attempt used the \\$HOME environment variable, but the project leaders rejected this change and asked me to use \\$XDG_STATE_HOME, which defines the default location for application state data. After making this change and fixing some formatting errors, my pull request was accepted.
+
+### Part 4: Attempting to Fix Speech Dispatcher
+The second issue I worked on was fixing Odilia’s speech, though I haven’t been able to solve this yet. Odilia uses Speech Dispatcher, a text-to-speech library for Linux. Someone made an issue on Git because Odilia was not able to launch Speech Dispatcher itself. Running Odilia alone wouldn’t cause any sound to be produced, but running another program that uses Speech Dispatcher first would allow Odilia to use it. I don’t have this problem when running Odilia, so investigating the issue was difficult. I started by reading the available documentation on the relevant packages: Speech Dispatcher (text-to-speech), Tokio (a Rust runtime), and SSIP (a protocol for sending screen reader information between processes). I then compared how these are used in Odilia to the sample code provided in the documentation, but I couldn’t find any obvious differences. I also looked at spd-say, another program that uses Speech Dispatcher, and couldn’t find anything that this program does differently than Odilia. My plan is to try installing Odilia on different Linux distros to see if I can replicate this error anywhere.
+
+### Validation
+I’m primarily using community feedback and the impact my changes have on Odilia to validate my work. The first issue was one that I brought up, and the project leader ended up making an issue for it, which indicates that the community agreed that it was a problem. While my first pull request was rejected, it was eventually accepted after I made some changes. Because of this, I would consider this fix a success. However, the second issue I looked into has not yet resulted in changes to the Odilia codebase. Since I still haven’t tracked down the source of the error, I have not made any changes to the code. Because this part of the project did not make an impact on Odilia, I would not consider this portion a success. Overall, I’m happy with the contributions I made, but I still wish I could have done more. Hopefully I can continue to have an impact on Odilia in future work.
+
+## Disability Model Analysis
+This project is guided by three principles from Sins Invalid’s Ten Principles of Disability: leadership of those most impacted, cross-disability solidarity, and collective access. Additionally, one of my primary goals is to create something that aligns with the needs of disabled users in order to avoid making a disability dongle.
+
+### Leadership of Those Most Impacted
+This principle states that disabled people, particularly those who hold other marginalized identities, should be the guiding force in accessibility work. This is in contrast to the traditional power hierarchy within academia, where “experts†are prioritized over those with lived experience. Allowing those most impacted to lead both gives more power to marginalized people and ensures that the work does not result in disability dongles.
+
+Because I wanted my work to align with this principle, I chose my project based on first-person accounts from disabled people about what barriers prevented them from accessing computing. As mentioned in the overview, I found multiple accounts from BVI people talking about the lack of accessibility in Linux, so I chose to work on a tool that would make Linux more accessible. My initial plan was to contribute to Orca because that project already has a lot of interaction with BVI users. Odilia, on the other hand, is not at a stage where users are meaningfully contributing yet. While at least one of the leaders of the Odilia project is visually impaired, I don’t know if the other developers are. Because of this, I don’t think my work upholds this principle as much as I hoped it would.
+
+### Commitment to Cross-disability Solidarity
+This principle emphasizes the importance of collaboration between people with different disabilities and access needs. Although disabled people are a diverse group with varying needs, we are all impacted by ableism, and solidarity between disabled people helps to amplify the voices of people who are most impacted by ableism.. In their article on the ten principles, Sins Invalid emphasizes the need to support “especially those who are most often left out of political conversations.â€
+
+While I have encountered barriers in computer science as a result of my health problems, I recognize that I come from a place of privilege as someone who is able to access a computer easily. Because of this, it was important to me to choose a project that makes interacting with computers more accessible. I wanted to make sure that my work didn’t just benefit me, but helped people with access needs that I haven’t experienced myself.
+
+### Collective Access
+This principle is about “[sharing] responsibility for our access needs†as a community, ensuring that everyone’s access needs are met. In contrast with the medical model of disability, which places the burden on individuals to make things work for them, this principle emphasizes the community’s responsibility to make things accessible for others.
+
+Contributing to an Odilia is in line with this principle, since the end product helps to make Linux more accessible to people who may not be able to access it otherwise. Additionally, both Linux and Odilia are free and open source, which makes them more accessible to people who cannot afford some of the other options.
+
+### Disability Dongles
+The concept of a disability dongle was coined by Liz Jackson to describe accessibility technologies made by people who do not understand the intended users’ needs, resulting in products that are impractical or solve “problems†that did not need solving. In addition to using resources on products that don’t actually benefit disabled people, disability dongles also treat disability as a problem to be solved, rather than pushing for societal changes to make the world more accessible.
+
+Because I am not blind or visually impaired, there’s a greater chance that my work would result in a a disability dongle. My hope was that allowing BVI users to guide the direction of my project would ensure that my work aligned with the needs of those users, but as previously mentioned, switching to Odilia meant that users were no longer determining what I worked on. However, screen readers are popular tools with a long history in the BVI community, so I think it’s unlikely that this is a disability dongle. Additionally, the fact that so many BVI people have complained about the lack of accessibility in Linux indicates that there is a need for a new solution like Odilia.
+
+## Learning and Future Work
+Overall, I learned a lot from this project. As the first open-source project I’ve contributed to, working on Odilia taught me the process of making Git issues, submitting pull requests, making revisions based on feedback, and communicating with project leaders. On a technical level, I learned about Rust libraries that I wasn’t familiar with. My current research is In Rust, but that project is an operating system, so we aren’t using the standard libraries. As Rust grows in popularity, learning about all of its tools is very beneficial.
+
+I also learned more about how screen readers work and how important they are to the BVI community. Reading through the source code and documentation for Odilia made it clear how complicated screen readers are, and how difficult it is to make them compatible with the UI for every program the user might want to use. It also illustrated how difficult it can be for non-expert users to install and run a screen reader on Linux. A lot of Linux software assumes that all users are tech-savvy and provide little instruction on how to run them. While this is ok for a project that’s still in development, I think this creates a massive barrier to BVI people who are just starting out with Linux. As a TA for UW’s systems courses, I’ve seen how Linux is a barrier to beginning computer science students, and the lack of an easy-to-use screen reader makes this even worse.
+
+Moving forward, I plan to keep contributing to Odilia. I really enjoyed working on this project and interacting with the community, and I think the product could be useful to a lot of people once it is more complete. My plan is to first see if I can find more information about the Speech Dispatcher issue, but if not, I will move on to another one. In the future, I might also ask to update the user documentation to make it more understandable for non-technical users, but I decided not to do that until I have done more work on the project.
+
+## References
+1. (2022, January 14). State of funding accessibility on linux, perspective of a blind user. \[Online forum post\]. Reddit. https://www.reddit.com/r/linux/comments/s3vvot/state_of_accessibility_on_linux_perspective_of_a/
+
+2. The A11y Project.(n.d.). *About*. https://www.a11yproject.com/about/
+
+3. \[ChipsAhoiMcCoy\]. (2023, May 25). Linux and Scren Readers for the Blind. \[Online forum post\]. Reddit. https://www.reddit.com/r/linux/comments/13rym2j/linux_and_scren_readers_for_the_blind/
+
+4. GNOME. (n.d.). *Orca Screen Reader*. GNOME Library. https://help.gnome.org/users/orca/stable/index.html.en
+
+5. Heron, M., Hanson, V., & Ricketts, I. (2013). Open Source Accessibility: Advantages and Limitations. *Journal of Interaction Science, 1*(2). https://doi.org/10.1186/2194-0827-1-2
+
+6. \[Jeremus_Ironflesh\]. (2021, September 9). Any opinions on Orca? \[Online forum post\]. https://www.reddit.com/r/linux/comments/pl2r1t/any_opinions_on_orca/
+
+7. \[HyperMisawa\]. (2022, January 12). The state of funding accessibility for handicapped people on linux is quite dire. \[Online forum post\]. Reddit. https://old.reddit.com/r/linux/comments/s1twza/the_state_of_funding_accessibility_development/
+
+8. \[nyakomon\]. (2021, September 9). How is accessibility on Linux? \[Online forum post\]. https://www.reddit.com/r/linux/comments/duqfly/how_is_accessibility_on_linux/
+
+9. NV Access. (n.d.). *About NVDA*. https://www.nvaccess.org/about-nvda/
+
+10. Odilia. (n.d.). *Odilia Screen Reader*. https://odilia.app/
+
+11. Orca. (n.d.). *Orca - A Free and Open Source Screen Reader*. https://orca.gnome.org/
+
+12. Institute for Disability Research, Policy, and Practice. (n.d.). *Screen Reader Use Survey*. WebAIM. https://webaim.org/projects/screenreadersurvey8/
diff --git a/projects/odilia_images/accessibility_audit.png b/projects/odilia_images/accessibility_audit.png
new file mode 100644
index 0000000000000000000000000000000000000000..61c2600a0765a8abb86f7b9f0f29f226743ab169
Binary files /dev/null and b/projects/odilia_images/accessibility_audit.png differ
diff --git a/projects/odilia_images/first-person1.png b/projects/odilia_images/first-person1.png
new file mode 100644
index 0000000000000000000000000000000000000000..4eadff2e798561e2d5e1e32f3d985f882538ef46
Binary files /dev/null and b/projects/odilia_images/first-person1.png differ
diff --git a/projects/odilia_images/first-person2.png b/projects/odilia_images/first-person2.png
new file mode 100644
index 0000000000000000000000000000000000000000..f7d2a37949306b276825e6bae19e29607cdfcd55
Binary files /dev/null and b/projects/odilia_images/first-person2.png differ
diff --git a/projects/storyteller.md b/projects/storyteller.md
new file mode 100644
index 0000000000000000000000000000000000000000..b6b7a3bd37ee216cbd2b8066511d68cbb9365a01
--- /dev/null
+++ b/projects/storyteller.md
@@ -0,0 +1,276 @@
+---
+layout: default
+title: Intersectional Storyteller
+description: Share your story ideas, highlighting cultural and disability aspects you want to preserve, and get a story back!
+---
+
+# Intersectional Storyteller #
+
+Chandni Rajasekaran, Aaleyah Lewis, Simona Liao, Kate Glazko, Caitlyn Rawlings
+
+## Introduction ##
+
+We all have complex, intersectional identities, but only a subset of identities are frequently portrayed in media, whether it be television or literature. In our technology-driven society, the media has become increasingly influential in shaping individuals' perceptions of their own identities. However, even when diverse identities are represented, they fail to capture intersectional identities. This is challenging because representing intersectional identities involves not only the integration of two distinct identities but also emphasizing the subtleties and complexities that arise from their intersection. To narrow our scope, we were particularly interested in exploring ways to promote intersectional representation to the youth demographic. We identified children’s stories as a media form where intersectional representation may be lacking. We selected this medium specifically for its text-based format, which aligns well with advanced text-generation models such as GPT-4. This project was further motivated by semi-structured interviews with Speech Language Therapists (SLTs) who support culturally and linguistically diverse children, which highlighted the lack of representative stories within classrooms and carryover practice material. After exploring existing story generation solutions that were driven by generative AI, we also identified this as a promising avenue for creating personalized stories. Our motivation specifically centers on improving the intersectional representation of AI story generations through the use of prompt engineering, since our initial exploration highlighted how text-generation models often resort to portraying stereotypical identities.
+
+Our product, Intersectional Storyteller, presents an accessible interface for guardians or educators to easily generate diverse and intersectional stories that promote inclusivity. Rather than being tasked with crafting a meticulous prompt in GPT with the hopes of getting a story that does not perpetuate stereotypes, Intersectional Storyteller provides users with a set of simple questions to then produce a story that avoids many of the default stereotypes surface in GPT models. The questions primarily prompt the user to indicate the race and disability of the main character, and optionally provide further details regarding the storyline or desired representation. To provide more structure to users looking for a more nuanced storyline, there are optional questions asking users to specify the key parts of the story, such as the rising action or climax. Finally, to personalize these stories to apply to different audiences, we allow users to specify the age of the target audience and story. The options presented to the user reflect our deliberate focus on improving representation at the intersection of disability and race. Given the impracticality of addressing all aspects of representation in our product's engineering, we have specifically concentrated on generating high-quality outputs concerning the intersection of Chinese and Black racial identities, and the disabilities of autism and cerebral palsy. After inputting answers to the simple questions outlined above, a full story is outputted to the user, broken apart into pages. In order to provide users with the opportunity to continue refining their story, we offer functionality for users to specify edits to particular pages of the story. When submitted, the generated story is updated to reflect these changes. Our vision for a polished version for this product would be to generate a file containing the generated story split across pages, along with AI-generated illustrations. Since exploration representation in generative AI illustrations is its own challenge, we currently give users the option to simply download a .docx file containing the final story.
+
+Our solutions stand out against existing solutions because of its focus on disability representation and more specifically, intersectionality. While we were able to find existing storybook generation tools such as Storybook AI and Childbook AI, these solutions focus on providing customization on the general prompt of the story. They follow a streamlined input/output process, providing limited control over transforming the outputs. Furthermore, they only touch on diversity at the surface level, by merely prompting users to optionally mention the main character’s race. These tools fail to address representation as something much deeper.
+
+We recognize the challenges in this project, where AI models carry inherent biases throughout the training process. These biases embedded in AI would be difficult to eliminate only with a prompt engineering approach and would require more sophisticated investigation into its development and training processes. With these challenges in mind, we develop our project as a first step toward understanding the desired cultural and disability representations by our target audience and categorizing LLM’s biases and stereotypes when producing such intersectional narratives. We also explore the nuanced dynamics between joy-centered and damage-centered perspectives and experiences when writing about diverse cultures and disabilities. By identifying these gaps and opportunities, we aim to provide clear directions for future improvements. Our attempt with prompt engineering also contributes to understanding if biases could be mitigated by prompts, even partially, without more costly approaches such as training an LLM.
+
+## Positive Disability Principals ##
+
+### 1. Is it ableist? ###
+
+This project, Intersectional Storyteller, seeks to be anti-ableist. In our related works, we detail several examples of the biases prevalent in LLM outputs, including disability. LLM storytelling products and apps already exist, however, none of them actively address or seek to dismantle the biases present in the outputs of their base technologies (i.e. GPT). Our storytelling platform, and the meticulous prompt engineering we have engaged in, seeks to avoid tropes such as disabled suffering, inspiration porn, or lack of agency in the outputs. Additionally, by providing the end user opportunities to customize the story and their own representation in the story, we embed agency as a value into our product design as well.
+
+### 2. What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?) ###
+
+To ensure we created an accessible experience, we analyzed the accessibility of the interface from the lens of various accessibility technologies. For instance, we first started with thinking about a screen-reader. This drove our decision on designing the “Edit†button under each of the pages of the generated story. We originally planned to have this button toggle to become a “Close Edits'' button followed by an input box on click. However, we discovered that it may be easy for a screen-reader user to miss this button transformation, since they may have already tabbed past this button. This may leave the user missing out on important functionality. So, we instead decided that when the “Edit†button is clicked, it first generates a new input box, which is then followed by a “Close Edit†button. Thus, if a user is tabbing through the screen, they would encounter the input, and learn about the appearance of a new button, making the edit experience more accessible. Similarly, we thought through the placement of the rest of the buttons on both pages of the webpage. We also took time to thoroughly test that every element of the page (including AI generated texts that appear upon interaction) is reachable via the tab key, ensuring accessibility.
+
+We also considered the visibility accessibility of the page, specifically making sure the color-scheme was colorblind friendly. After doing some research, we discovered that purple and green are colors that contrast well, making them an ideal pairing in a color palette. To further provide an accessible experience for blind and low vision users, we implemented a feature where an announcement is made following a button press, describing the resulting action from the interaction. For instance, when the user interacts with the “Generate Story†button, which navigates the user to the edit page, this navigational change is immediately announced to ensure the user is fully aware of large interface changes. Finally, another key consideration we made was with re-thinking the hover functionality that we presented in our initial mockup. The original idea was that hovering over an icon next to each page’s content would provide information on the disability representation on that page. When thinking about other accessibility tools, we considered how this flow may not be ideal for someone leveraging an eye-tracking device. After reading more about people’s experience with eye-tracking devices, we learned that hover is not very accessible. This is because a user of an eye-tracking device would have to continuously shift their gaze from triggering the hover interactable to viewing the page content, interfering with simultaneous access. This explains our final design choice to move the discussion of disability representation to be a summary near the top of the page rather than a hoverable text blurb associated with each page, further reducing clutter.
+
+When considering the output story file format, we thought about the perspective of someone using a screen magnifier. Our vision was to have the story content split across numerous pages, leaving space to add images in future iterations of this project. However, since there are currently no images, we realized that a non-editable file format may be inaccessible to somehow using a screen magnifier for example, as they would have to frequently scroll through many pages, each containing a limited amount of text. This situation poses a potential navigation challenge, particularly when screen magnification tools necessitate frequent movement across blocks of text. Thus, although it was an additional challenge in terms of implementation, we figured out how to integrate a downloadable .docx file for the story. This gives screen magnifier users and users of other accessibility tools the opportunity to leverage the suite of accessibility tools provided by enterprise products like Microsoft Word, while also giving them the flexibility to conveniently reformat the story output if desired.
+
+### 3. Are people with disabilities engaged in guiding this work? At what stages? ###
+
+Multiple members of the project team of Intersectional Storyteller identify as having a disability. They were involved in the project from the formative, ideations stages throughout the development process and ultimately, authoring this report. However, children with disabilities and educators were not involved in any part of the project. The inability to involve children with disabilities in co-design and development is a major limitation of this project.
+
+### 4. Is it being used to give control and improve agency for people with disabilities? ###
+
+Our storytelling platform seeks to give control and improve agency for people with disabilities by allowing them to customize their representation in stories about them. Emerging research such as Mack et. al’s "They only care to show us the wheelchair" [26], highlighted the lack of representation of LLM outputs in portraying people with disabilities; showing them as primarily lonely, white men in wheelchairs. By allowing people with disabilities to infuse their own identities and desired representations into the story, we provide agency and control to disabled people in how they want to be represented.
+
+### 5. Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)? ###
+
+This work is addressing intersectionality. Through our stories, we represent different races (Black, Asian), genders (Woman/Non-binary), and disabilities (Autism/Cerebral Palsy); and combinations of aforementioned identities. We understand that this is not a comprehensive list of all races and ethnicities, genders, or disabilities but is rather a subset, limited in scope by the nature of a time-limited group project. We likewise did not represent multiply-disabled people in our narratives.
+
+
+## Related Work ##
+
+In this section, we explore the applications of Large Language Models (LLMs) in storytelling, the biases inherent in these models, and the emerging strategies to mitigate these biases through prompt engineering. We examine various studies demonstrating LLMs' potential in creative writing, identify the types of biases that affect their outputs, and discuss these related works as potential approaches to promote fairness and inclusivity in AI-generated content such as stories.
+
+### LLMs for Storytelling ###
+
+Research has demonstrated the suitability of LLMs for generating creative, engaging stories [11, 14, 8, 10]. Yuan et. al demonstrated how the use of an LLM-powered text editor enabled the co-creation of compelling narratives, even “unblocking†authors stuck in creative ruts [14]. Alas, it is the ability of LLMs to imagine novel content that does not exist — which when occurring in an undesired fashion are referred to as "hallucinations" — that bring about their strength in creating stories and narratives, as described in Yotam et. al’s creation of a generated story built on creative hallucinations, MyStoryKnight [10]. The hallucinations built into MyStoryNight foster opportunities for building action and interactivity into the narrative, resulting in an engaging experience for children [10]. Other research has sought to leverage LLM-based story telling to likewise engage with children, even targeting specific purposes and contexts such as education. The Mathemyths project, led by Zhang et. al, showcased an LLM-based storytelling agent that co-creates stories with children in order to teach them mathematical concepts, was comparable to stories created with a human partner [9]. In an example of its use in accessibility as shown in Zhou et. Al, blind parents utilized LLMs to understand the non-verbal story content of picture books, using LLM outputs to expand on their own storytelling and even create an interactive component in reading with their children [13]. These examples, all featuring human co-authors, do not capture the full utility of LLMs as storytellers however — Duah et. al’s work demonstrated that LLM-generated narratives were more preferred by human graders than narratives generated collaboratively by humans and LLMs [12]. This breadth of research highlights the promise and utility of LLMs for generating stories that are well-perceived by human readers.
+
+### Biases in LLMs ###
+
+Unfortunately, the ability of LLMs to produce written content is impeded by built-in biases. Such biases exist across a range of identity-related attributes. Dixon et al. highlighted unintended biases in text classification systems, emphasizing the importance of fairness and the challenges in achieving unbiased machine learning models [15]. Gender biases are extensively explored by Sun et al. [17] and Kotek et al. [18], who show how image-generative AI and LLMs perpetuate stereotypical representations and harmful stereotypes about gender roles, describing how women are frequently depicted as smiling and looking down. These biases even perpetuate into the types of careers genders are affiliated with. Spillner et al found that women were rarely depicted in career roles most affiliated with men [19]. LLMs also exhibit racial biases, resulting in potential real-world harms. Racial biases are examined by Bowen et al. discusses how LLMs used in mortgage underwriting can perpetuate racial disparities, highlighting the need for robust mitigation techniques to ensure fairness[20]. Wan et al. uncover intersectional biases in language models, particularly how gender and racial biases manifest in language agency, emphasizing the need to address multiple dimensions of bias simultaneously [22] . Additionally, Mirowski et al. explore the limitations of LLMs in capturing nuanced human expressions such as humor, which can perpetuate harmful stereotypes and diminish or erase minority perspectives [21]. Gadiraju et al. revealed multiple tropes present in LLM text generation about disabled people, highlighting examples such as "disabled suffering" or "inspiration porn" [16] in the generated narratives. Collectively, these studies underscore the concern that producing written content, such as stories, could result in outputs that are biased in a multitude of ways— presenting negative stereotypes and diminishing agency or perspectives of minoritized groups.
+
+### Improving Biases in LLMs ###
+
+Some emerging research has sought to mitigate biases present in generative AI through the use of prompt engineering, offering various strategies to guide these models toward more equitable outputs. Li et. al introduce a causality-guided debiasing framework that leverages prompt engineering to steer LLMs towards unbiased responses [23]. By identifying causal relationships within the model’s outputs, their approach systematically reduces the influence of biased correlations inherent in the training data, thus promoting fairness in generated responses . Similarly, Glazko et. al focus on debiasing ableist outputs from ChatGPT-based resume screening. They identify disability bias in GPT-based systems and employ targeted, anti-ableist prompt engineering to mitigate these biases, creating a custom GPT build on disability justice and non-discrimination [24]. Dwivedi et. al tackle gender bias by using prompt engineering and in-context learning to promote gender fairness. Their study demonstrates how carefully crafted prompts can adjust the model's behavior, reducing gender biases and ensuring more balanced and representative outputs. Collectively, these studies underscore the pivotal role of prompt engineering in addressing and mitigating various forms of bias in LLMs, highlighting its potential to enhance the fairness and reliability of AI-generated content [25].
+
+Addressing and mitigating biases in LLMs is crucial for ensuring the fairness and reliability of AI-generated content such as stories. Emerging research on prompt engineering underscores the potential of this approach in promoting unbiased outputs. By leveraging these techniques, it is possible to enhance the inclusivity and ethicality of LLM-generated stories, making them more representative and equitable for all users and potentially more suitable for producing narratives representing a variety of identities.
+
+## Methodology and Results ##
+
+Based on prior research and first-person accounts, LLM has been found to perpetuate negative stereotypes about marginalized social groups and to hallucinate inaccurate facts. In order to create an AI storyteller that could produce unbiased and intersectional stories, we need to develop validation metrics that define unbiased stories that are desired by our audiences. These metrics would also help us create AI prompts to finetune our intersectional storyteller tool. We also built a website interface to support accessible user interaction. To evaluate the intersectional storyteller, we qualitatively coded the stories and summarized high-level themes from the codes.
+
+### Building Validation Metrics and Prompts ###
+
+When building the metrics, we started with broad searches of disability and cultural representation in AI, and narrowed them down to 2 specific types of disabilities and cultures. Disability contains a diverse spectrum, from visible disabilities such as vision and motor disabilities to relatively invisible ones, including hearing and neurodiversity. Each disability could face different challenges and stigmas from society, and thus, it would be hard to summarize all of them using the same set of metrics. Similarly, cultural stereotypes are deeply connected to history, and each marginalized racial group faces distinct challenges and stigmatization. Therefore, we selected Autism and Cerebral Palsy disabilities and Black and Chinese cultures to generate more concrete standards for each. We selected these disabilities and cultures also because some of our team identified with or had abundant knowledge of them.
+
+We took three approaches to build our validation metrics for unbiased intersectional stories for disability and cultural representation: searching prior literature, finding first-person accounts, and prompting ChatGPT for existing biases. Prior literature has been extensively covered on the [Related Work](#related-work) section above, and thus, we present results from finding first-person accounts and prompting ChatGPT in this section.
+
+#### First-Person Accounts ####
+
+To center our target audience, people with disabilities and from diverse cultural backgrounds, and their opinions to generate desired children’s stories for them, we collected first-person narratives. Because of the lack of first-person narratives on using AI or LLM tools to generate children’s stories, we searched for narratives about writing stories for children with disabilities or from diverse cultural backgrounds by authors who are also in the same community. These narratives provide us valuable insights into what stories are missing in the current children’s book market and why it’s important to fill in these gaps. They also had suggestions for writing stories for children with disabilities or from diverse cultural backgrounds, which would be helpful to include in our storyteller training prompts. We searched for first-person accounts in three directions: Black authors, Chinese authors, and authors with disabilities.
+
+From Black authors Hannah Lee [1], S.R. Toliver [2], and Crystal Swain-Bates [3], we discovered two insights. First, all authors spoke about the majority of Black children’s storybooks centered on topics such as the history of slavery and liberation in the United States. Despite the importance of these histories and teaching them to the younger generations, these Black authors also expressed the need for stories that portray Black culture and people in a joyful way beyond the harm and wrongs in history. For example, Toliver mentioned she would love to read stories of Black girls being detectives or Black girls with dragons when she was a little girl, but these types of stories were only available when she was in college. Additionally, these authors agreed on the significance of celebrating Black culture in children’s books. This motivated Hannah Lee to write the story My Hair, about a little Black girl styling her hair for her birthday, because “Black hair is my reality,†as Lee said.
+
+Taiwanese author Grace Lin [4], who has published multiple children’s books about Chinese/Taiwanese American culture, emphasized the importance of cultural representation in children's storybooks. By writing and celebrating the cultural heritage, these books could help Chinese American children feel a sense of belongingness. Grace reflected on her childhood and wished there were storybooks centering on Chinese American cultures so she wouldn’t feel the urge to escape her identity but embrace this beautiful heritage.
+
+For children’s books centering on children with disabilities, author and activist Rosie Jones [5], who has cerebral palsy, provided insightful guidelines. She pointed out that the common disability representation in popular culture always perpetuates a singular narrative, only focusing on a few types of disability with stereotypical depictions. Rosie highlights that stories should avoid the “victim†stereotype of people with disabilities or depicting them always as sidekicks. Instead, stories should focus on their joys and independence. To make stories feel authentic, Rosie emphasized that access needs should be included in the stories. For instance, Rosie wrote about how a girl with cerebral palsy would need her friends’ help in carrying a tray of chicken nuggets when they are hanging out in a diner. As Rosie said, “we do need to ensure that a person’s access needs are addressed in the show. That will make it feel more authentic.â€
+
+#### Prompt Engineering Process and Preliminary Findings ####
+
+In order to prompt stories centering on specific disabilities and cultures, we narrowed down our prompt engineering to the scope of two disabilities (autism, cerebral palsy) and two cultures (Black, Chinese). We used ChatGPT 4o because it’s a large language model that is widely available to the public and serves as a good baseline. The goal of this preliminary prompt engineering approach is to identify common pitfalls and biases embedded in the ChatGPT model when writing about disabilities and cultures, providing guidelines for our storyteller tool to avoid these biases.
+
+When generating stories, we experimented with five types of stories, each centering on (1) Black culture (2) Chinese culture (3) Autism (4) Cerebral Palsy, and (5) the intersection of culture and disability. We also attempted various themes and storylines, from day-to-day school life to adventurous superhero stories. Some of the prompts were intentionally made general to elicit different responses from ChatGPT. For example, here are some story prompts we have tried:
+
+1. Write a story about a Black superhero from Baltimore, Maryland/ specific to Black culture/a young Black boy who plays sports.
+2. Write a story of a little Chinese American girl visiting Beijing, China for the first time with her parents/as a superhero/celebrate dragon boat festival/learning math.
+3. Write a story about children with autism/cerebral palsy.
+4. Write a story about a little Chinese girl w/ autism at school/celebrate Chinese new year with her family.
+
+From the stories generated by these prompts, we observed and labeled biased and stereotypical content and summarized them into preliminary findings. For Black culture, we found that ChatGPT perpetuates negative stereotypes about Black people and Black culture, such as focusing on criminality, poverty, struggle, and lower intelligence and capability. It also had negative depictions of regions of the Black community. For example, given the prompt, “Write a story about a Black superhero in Baltimoreâ€, ChatGPT generated A Black superhero that used “his powers to blend into the shadows.†The story included racial bias in naming the superhero, “But by night, he transformed into the city's protector, a black superhero known as ‘Shadowhawk.’†Shadow has historically been used in a derogatory manner to refer to Black people, emphasizing their skin color in negative contexts. It also included regional stereotypes for Baltimore, where was described as “plagued by crime and neglect,†and “He [shadowhawk] tackled drug dealers.†For Chinese culture, we found that ChatGPT tokenizes the culture by superficially representing it through symbols such as dragon, panda, bamboo, and jade without deeper engagement with the culture. For instance, given the prompt, “​​Write a story for children who are 5 year old, the story is about a Chinese superhero,†ChatGPT writes about a Chinese boy and a jade amulet giving him the superpower by saying, "Jade power, activate!" In the story, the boy “found a family of pandas trapped under a fallen bamboo tree. The pandas were scared and unable to move.†Although these tokens are not necessarily negative biases, they contribute to a singular and superficial narrative about Chinese culture. For autism, we found that ChatGPT often defaults the main character to a male, depicting them as lonely, lacking empathy, being a burden for others, and lacking leadership. For cerebral palsy, ChatGPT is portrayed as a disease, depicting people with cerebral palsy as always having an intellectual disability, always in a wheelchair, and dependent on others. ChatGPT’s depiction of people with these disabilities has reductively centered on their disability and not recognizing their wholeness. These depictions also contribute to the singular narrative and stereotypes about these disabilities, failing to include the diverse situations and conditions that people with disabilities are in.
+
+In addition to these findings regarding cultures and disabilities, we also identified other limitations in ChatGPT-generated stories. First, ChatGPT presented gender stereotypes in depicting the binaries between girls and boys, and their family structures. It tends to describe girls’ appearances, such as their faces, eyes, and hair, more than boys and instead depicts boys’ hobbies and interests more than girls. When writing about families, ChatGPT assigns traditional gender roles to dads and moms, and all families are depicted as heteronormative. Additionally, ChatGPT showed stiff language when writing children’s stories and using repetitive words and short phrases. For example, the stories always open with the same phrase, “Once upon a time in a bustling city/a small village/a cozy neighborhoodâ€, feeling artificial and unnatural.
+
+#### Validation Metrics ####
+
+Based on insights from the three approaches, we present the final validation metrics in three categories. First, in high-level standards, we specified overall standards for portraying culture and disability. When representing diverse cultures, the storyteller should prioritize avoiding hallucination, avoiding depicting people of color as lacking agency and describing the culture in a celebratory way rather than focusing on the harm. When representing disabilities, the storyteller should center disability joy, avoid inspiration porn, and avoid reductive portrayal. Second, in specific standards, we specified different standards for the two disabilities and two cultures. The standards here are more detailed and mostly stem from the first-person accounts and prompt engineering preliminary results. Finally, we also included the additional standards to further eliminate gender stereotypes and help our storyteller produce more fluently written stories. The complete validation metrics are presented below.
+
+##### High-Level Standards ######
+
+Cultural:
+
+- Avoid hallucination
+- Avoid lack of agency
+- Celebratory rather than harm-focused
+
+Disability:
+
+- Center disability joy
+- Avoid inspiration porn
+- Avoid reductive portrayal
+
+##### Specific Standards #####
+
+Chinese Culture:
+
+- Avoid homogeneity
+- Avoid portrayal as unfriendly
+- Avoid tokenization
+
+Black Culture:
+
+- Avoid negative portrayal as dangerous and struggling
+
+Autism:
+
+- Avoid negative portrayal as lonely, dependent, and incapable
+
+Cerebral Palsy:
+
+- Avoid negative portrayal as dependent
+- Avoid the assumption that all have intellectual disabilities
+- Avoid portraying as always in wheelchairs
+
+##### Additional Standards #####
+
+- Gender stereotypes
+- Traditional gender roles
+- Gender binaries
+- Heteronormativity
+- Stiff language
+
+### Developing the Web Interface ###
+
+When considering the design for our website, we chose to start a React.js web interface from the ground-up rather than using a pre-existing website template through a different source. Since providing an accessible interface was a core priority, we felt that we would have more control in providing an accessible interface if we designed the layout of the page from scratch. During the development process, we started by creating a mockup of the design. Here, we considered how we can present the necessary content in a clean and accessible manner. Next, we proceeded to scaffold the various input boxes required. These required inputs were identified based on the findings from the prompt engineering process. After the user inputs were set up, we worked to implement the functionality of the various buttons, which required connecting the frontend to the backend. We had set up a Python script to query GPT-4, so we leveraged the framework Flask to allow the frontend to make API calls to this backend. We decided to split the interface into two pages – a home page and an edits page. The home page allows the user to enter text into various inputs, and press a button to view their generated story. These inputs are then sent to the backend via the API call, and formatted into a meticulously crafted prompt which provides GPT with more structure on the desired approaches to race and disability representation. This then directs the user to the edits page, where the generated story is displayed in blocks, where each block represents a page of the story. Furthermore, we wanted to provide users with the flexibility to quickly scan the story, so we ensured that the API response included a short summary of the story, as well as a detailed description of how race and disability are highlighted in this particular story. We then implemented functionality for the user to provide edits to the page by generating input boxes when a user requests to edit a page. Since it is possible that a user may want to edit changes across multiple pages, we implemented functionality to allow the user to apply a set of edits, which essentially contacts another API endpoint. This endpoint is in charge of updating the original story based on the edits specified for each page. To allow users to download the story as a .docx file, we leveraged the docx package published by npm.
+
+#### Home Page ####
+
+
+
+#### Edit Page ####
+
+
+
+
+
+### Evaluation ###
+
+#### Method & Data Analysis ###
+
+After implementation, we evaluated Intersectional Storyteller by generating and qualitatively coding stories centered on different disabilities and cultures. We also used the same prompts to generate stories by ChatGPT 4o and compare them with the ones generated by our storyteller. Here are the 8 main characters’s demographics we focused on:
+
+- Chinese (Woman)
+- Black (Woman)
+- Autism (Woman)
+- Cerebral Palsy (CP) (Non-binary Gender)
+- Chinese x Autism (Woman)
+- Chinese x CP (Woman)
+- Black x Autism (Woman)
+- Black x CP (Woman)
+
+For most of the demographics, we generated one story. For Black x Autism and Cerebral Palsy, we generated two stories to explore different storylines and word counts of the story. Each user prompt included at least one cultural and disability representation as a starting point for the tools to expand on. For qualitative coding, we created a spreadsheet with all the stories, each with a version generated by our storyteller and ChatGPT 4o. Three of us labeled the story contents where the validation metrics were violated, as well as positive and specific portrayals. We compared and discussed notes across different stories to generate high-level evaluation results and themes.
+
+#### Results ####
+
+Our storyteller presents *positive* representations of disability and culture.
+
+Overall, stories generated by our storyteller tool followed the validation metrics to produce positive cultural and disability representation. For cultural representations, all 7 stories with Black or Chinese cultures followed the validation metrics and positively represented them. In the example of portraying the city of Baltimore, our storyteller centers around the joy in the culture and community instead of negative stereotypes, “Zara adored the spirited vibes of Baltimore, with its vibrant streets alive with music and laughter.†In contrast, the story generated with ChatGPT 4o described Baltimore as “plagued by crime and neglect.†When depicting Chinese culture, the storytellers included specific details about cultural festivals instead of only the common tokens. For example, when writing about Zong Zi, Chinese food for celebrating the Dragon Boat Festival, details such as ingredients used in making Zong Zi were depicted: “Mia's mom had prepared sticky rice, sweet red beans, and juicy dates. They were all set to wrap them in soft bamboo leaves.†In contrast, stories generated with ChatGPT 4o with the same user prompts still presented problems such as tokenization, lack of details, and perpetuating singular narratives.
+
+For disability representations, 7 out of 8 stories followed the high-level disability validation metrics to center disability joy, avoid reductive portrayal, and avoid inspiration porn. Some of them recognized the wholeness of people with disabilities’ experiences by acknowledging the existing challenges without centering them. For example, in one story of a Black girl with autism it states, “Though sometimes the world's bustling nature can be overwhelming, Maya has learned to navigate these challenges with grace.†Similarly, in another story of a Black girl with autism, the story portrays her sensory experience in a positive way with emphasis on access needs, “Strolling toward the park, Jasmine delighted in the textures of the environment around her - from the intricate patterns on the fences to the soft rustle of leaves under her fingers. Each sensation shared its unique story with her. Her vibrant yellow headphones hung loosely around her neck, a beacon of comfort should the hustle and bustle grow overwhelming.†Additionally, some stories centered on disability joy, integrating their access needs as part of their positive experience, “under the bright stage lights, Jordan felt an exhilarating mix of nerves and excitement. Their wheelchair, now shimmering with lights, felt like an extension of the performance itself.†However, inspiration porn appeared in one of the stories generated by the storyteller, where the main character Jordan was a non-binary teenager with cerebral palsy. The story ended by describing Jordan as a symbol of strength and inspiring changes, “...Jordan stood as a beacon of resilience and diversity, embodying the true meaning of strength…Faced with new challenges, Jordan remained undaunted, fortified by the knowledge of their ability to inspire change.â€
+
+#### Improvements for Further Engagement with Cultural Representations ####
+
+Despite our storyteller showing improvements in representing Black and Chinese cultures in more detailed ways, we observed that the tool heavily relies on user inputs and has room for improvement. During our evaluation, we started with very generic prompts without specifying any cultural elements in addition to the main character’s race/ethnicity. The generated stories dropped the cultural aspect and did not engage with the main character’s race/ethnicity. This could be caused by the system prompts where we specified the storyteller should not represent culture in stereotypical ways. Later, when we added a particular way to engage with culture in the user prompt, such as specifying a cultural festival or practice, the storyteller centers around it to develop the story with vivid details. One improvement for the storyteller is to generate stories with deeper engagement with cultures without hints or directions provided by the user input. This highlights how prompt engineering can only do so much, and a lot of the patterns are driven by systemic lack of representation in training data.
+
+One of the specific validation metrics for Chinese culture was to avoid tokenizing, such as representing the culture only through symbols such as panda, bamboo, jade, dragon, and dumplings. The storyteller successfully avoided these common symbols but adopted another token in 2 out of 3 stories generated with Chinese culture, which was to include a “grandma†in the story narrative. For example, in the story of making Zong Zi together to celebrate the Dragon Boat Festival, the grandma did not participate in making it with the family but was generally mentioned at the end of the story when they are eating Zong Zi, “Each bite was a delicious link to the stories her grandmother recounted about past festivals.†The “grandma†could be interpreted as a symbol of respect for elders in Chinese culture, but they were not meaningfully engaged in the storyline and became another token. Thus, the storyteller tool does not show an understanding of the concept of tokenization and requires people to explain the prompts with detailed examples for it to follow.
+
+#### LLM Shows a Lack of Knowledge of Accessible Technology ###
+
+In addition to the high-level validation metrics for disability, both the storyteller and ChatGPT 4o failed to meet one specific metric for cerebral palsy, avoiding always portraying people with cerebral palsy as a wheelchair user. Among all four stories generated by the storyteller, the main characters always default to being wheelchair users without any specific mentions of wheelchairs from the user prompts. Indeed, one user prompt was intentionally drafted in a general way to refer to the wide range of mobility devices, “Show the use of mobility devices in a positive and self-expressive way,†but the storyteller and ChatGPT 4o still equate mobility devices to wheelchairs. Despite efforts from both system prompts and user prompts, these models fail to represent people with cerebral palsy in diverse ways and perpetuate a reductive narrative. According to the Cerebral Palsy Research Network, about 40 - 50% of people with cerebral palsy are wheelchair users, and there are other mobility devices such as crutches, canes, or rollators adopted by them but not portrayed by LLM [27]. This gap between reality and the LLM narrative of people with cerebral palsy could be due to the bias embedded in the LLM training process and would require more intentional efforts from researchers to remove these biases.
+
+LLM also demonstrates a lack of details when portraying diverse accessible technologies. For example, in the story below, the LLM mentions the creation of a new accessible technology for making Zong Zi, “Seeing this, Mia's dad had a brilliant idea. He fashioned a handy gadget that made it easier for Mia to join in. With this gadget, Mia could sprinkle rice and spoon in the fillings alongside her family, completely immersed in the festivity.†However, it was only referred to in very general terms and did not include meaningful details on how it was designed to support Mia.
+
+## Disability Model Analysis ##
+
+### Disability Justice ###
+
+The first principle of Disability Justice, Intersectionality, is rooted in Black feminist activism and underscores the importance of recognizing how disability interplays with other marginalized identities such as race, gender, sexuality, immigration status, religion. This principle also emphasizes the necessity of centering the voices of those at these intersections. Our system meaningfully engages this principle by generating stories that center intersecting identities (i.e., disability, culture, and gender), recognizing the diverse experiences and realities of people’s lives. In addition to intersectionality, our system addresses the principle of leadership of those most impacted by focusing on identities that our team members either identify with and are familiar with. Moreover, in creating our system and developing validation metrics, we center the voices of Black, Chinese and disabled storytellers such as Hannah Lee [1], S.R. Toliver [2], Crystal Swain-Bates [3], Grace Lin [4], Rosie Jones [5]. This approach helped us understand their values and standards when creating representative children stories. Lastly, we address the principle recognizing wholeness. For the stories that our system generates, we believe it is important for them to portray characters as multifaceted with diverse experiences, and not solely defined by their disabilities or cultural backgrounds. We also explore this principle through the generating stories balancing the depictions of joy while also acknowledging challenges, without reducing characters’ experiences to solely their struggles.
+
+### Flourishing and Damage-Centered Frameworks ###
+
+In approaching this work, we first sought to understand how existing technologies, particularly LLMs, perpetuate biases rooted in systemic racism and ableism toward people with disabilities and people from diverse cultural backgrounds. We drew from previous literature and first-person accounts that documented instances of harm in LLMs and storytelling, respectively. These damage-centered, or deficit-based, perspectives were essential for us to understand so we could approach our design with a focus of moving towards centering the joy of these marginalized communities and reducing biases embedded in LLMs. While acknowledging and preserving these testaments of harm, we chose to ground our design in a flourishing framework [6]. This framework builds on existing celebratory frameworks such as assets-based design and designing for resilience, shifting to a positive redefinition of design. In designing and building our system, our goal was to center joy within disabled and culturally diverse communities. This was achieved through prompt engineering techniques with ChatGPT 4o, ensuring that the narratives generated reflect a positive and holistic picture of these communities.
+
+### Design A11yhood ###
+
+The final model we adopt to guide our work is Design A11yhood which places emphasis on user agency and control. Our system empowers users to generate personalized stories that center and resonate with their unique backgrounds and experiences, whether for themselves, their child, or their students. On the first page of our interface, the users are given the agency to customize different aspects of the storyline, plot, and character details, therefore empowering them to shape the narratives that reflect and celebrate their identities. Recognizing the need to reduce potential burdens on users, we intentionally made many of these customization fields optional. If a user chooses not to provide an input for certain fields, the system will generate content automatically. The second page of the user interface enhances user control by allowing users to make direct edits to the overall summary and each generated page. Additionally, it provides an explanation of the AI’s decision making process, ensuring transparency. Similar to the first page, these features are also optional in order to reduce potential burden on the users. By prioritizing user agency and minimizing complexity, our system ensures that the creation process is both empowering and inclusive.
+
+## Learnings and Future Work ##
+
+One of the major learnings while working on this project was understanding the tensions between balancing joy-centered and damage-centered perspectives and experiences when developing the validation criteria and analyzing the generated stories. When conducting validation tests, it was difficult at times to confidently determine what were appropriate versus inappropriate culture and disability representations generated by the system. Cultural and disability experiences can vary widely because when constructs such as race and disability intersect there can be complex and amplified experiences, lending to people conceptualizing and identifying with disability differently. It is essential to recognize that all perspectives are valid and should be honored. This complexity underscores the importance of having a nuanced and flexible approach to validation that can accommodate the diverse realities of individuals’ lives. Additionally, when assessing our generated stories against the validation criteria, we had to carefully tease apart and distinguish between what constituted interdependence versus a lack of independence because these can be very nuanced and context-dependent. Interdependence is defined as collaborative efforts to create access with the active involvement of people with disabilities [15]. For example, in the Chinese and cerebral palsy story that our system generated, the narrative stated, “Seeing this, Mia's dad had a brilliant idea. He fashioned a handy gadget that made it easier for Mia to join in.†In this example, Mia’s dad makes an assistive device that helps her participate in the collaborative process of making a traditional Chinese dish. While the intention was to support Mia's involvement, the story did not explicitly state that the process of making the device itself was a collaborative effort between Mia and her dad. As a result, it could be interpreted as a lack of independence rather than interdependence because Mia’s dad is making the device for her rather than with her. To address this, future work will include refining our prompt engineering and validation criteria to better capture and emphasize interdependence, ensuring that our stories reflect a balanced portrayal of collaboration and independence.
+
+One of the key limitations of our work is that the generated story outputs do not fully emulate the layout and interactive features commonly found in traditional children's books. For example, our current system lacks the capability to produce illustrations to accompany text or create the experience of flipping through physical pages. This limitation can affect the user experience, particularly for young readers who benefit from the visual elements of a traditional book format. To address these limitations, future iterations of our system will aim to integrate more visual and interactive features. Specifically, incorporates image generation capabilities to accompany the text, enhancing the visual appeal and engagement of the stories. This development will involve querying OpenAI to generate high-quality illustrations that complement the narrative content and convey intersectional identities, through the use of DALL-E 3.
+
+Recognizing the importance of accessibility, future work will also include developing alt text description generation for these images. By automatically generating accurate and descriptive alt text for each illustration, we can make the stories more inclusive and accessible to users. Incorporating these features will not only improve the overall user experience and accessibility, but also align our system more closely with the interactive and multimedia nature of children's books. These enhancements will further our goal of creating a truly inclusive and engaging storytelling platform that celebrates diverse disabled and cultural backgrounds. Lastly, as noted in the above section, we noticed that the system was too reliant on the user's input to produce stories that meaningfully engaged culture and disability representation. Future work will include additional iterations of prompt engineering in order for the story outputs to engage more deeply with these identities. Another avenue to explore would be to instead experiment with building a custom GPT model by sourcing training data from authors who have researched and captured intersectional representation.
+
+## References ##
+
+[1] [What Inspired Me to Write a Children’s Book About Black Hair](https://www.youtube.com/watch?v=QIsDim3y0l0)
+
+[2] [Talking About Black Representation in Books and the Power of Storytelling with Writer S.R. Toliver.](https://www.youtube.com/watch?v=d1eiWRqdbyk)
+
+[3] [Why I write Black Children's Books: Meet African-American Children's Book Author Crystal Swain-Bates](https://www.youtube.com/watch?v=JqbkkhN0hrI)
+
+[4] [The Windows and Mirrors of Your Child's Bookshelf \| Grace Lin \| TEDxNatick](https://www.youtube.com/watch?v=_wQ8wiV3FVo)
+
+[5] [Disability is not a Character Type (Inclusivity Now - CMC 2021)](https://www.youtube.com/watch?v=kZ7fDvxTrSY)
+
+[6] [Flourishing in the Everyday: Moving Beyond Damage-Centered Design in HCI for BIPOC Communities](https://dl.acm.org/doi/abs/10.1145/3563657.3596057) (To et al.)
+
+[7] [Suspending Damage: A Letter to Communities](https://pages.ucsd.edu/~rfrank/class_web/ES-114A/Week%204/TuckHEdR79-3.pdf) (Tuck)
+
+[8] [Storyverse: Towards Co-authoring Dynamic Plot with LLM-based Character Simulation via Narrative](https://arxiv.org/abs/2405.13042) (Wang et. al)
+
+[9] [Mathemyths: Leveraging Large Language Models to Teach Mathematical Language through Child-AI Co-Creative Storytelling](https://dl.acm.org/doi/full/10.1145/3613904.3642647?casa_token=yaTCFZx-wr0AAAAA%3AWSvt7kG9ytf0dIOCSqGjv90MPgpVQVTVPn-54T0Y-C-HHeDqdrb_ChpR9KMgO35bigzzhsLhkYpdUvA) (Zhang et. al)
+
+[10] [MyStoryKnight: A Character-drawing Driven Storytelling System Using LLM Hallucinations](https://www.interaction-ipsj.org/proceedings/2024/data/pdf/3B-54.pdf) (Yotam et. al)
+
+[11] [From Playing the Story to Gaming the System: Repeat Experiences of a Large Language Model-Based Interactive Story](https://link.springer.com/chapter/10.1007/978-3-031-47655-6_24) (Yong et. al)
+
+[12] [More human than human: LLM-generated narratives outperform human-LLM interleaved narratives](https://dl.acm.org/doi/abs/10.1145/3591196.3596612?casa_token=FbcfuIIUmhQAAAAA:-LvTmHWO76TASoJkM2bkIcFYVKlCBlvczZGSNsGhl30VODO0jl50XcWxWPyFslYQTjZzyXwVCf4PEjU) (Duah et. al)
+
+[13] [Which AI Models Create Accurate Alt Text for Picture Books?](https://www.csun.edu/cod/conference/sessions/index.php/public/presentations/view/4014) (Zhou et. al)
+
+[14] [Wordcraft: Story Writing With Large Language Models](https://dl.acm.org/doi/abs/10.1145/3490099.3511105) (Yuan et. al)
+
+[15] [Measuring and Mitigating Unintended Bias in Text Classification](https://dl.acm.org/doi/abs/10.1145/3278721.3278729) (Dixon et. al)
+
+[16] ["I wouldn’t say offensive but...": Disability-Centered Perspectives on Large Language Models](https://dl.acm.org/doi/abs/10.1145/3593013.3593989) (Gadiraju et. al)
+
+[17] [Smiling women pitching down: auditing representational and presentational gender biases in image-generative AI](https://academic.oup.com/jcmc/article/29/1/zmad045/7596749) (Sun et. al)
+
+[18] [Gender bias and stereotypes in Large Language Models](https://dl.acm.org/doi/abs/10.1145/3582269.3615599) (Kotek et. al)
+
+[19] [Unexpected Gender Stereotypes in AI-generated Stories: Hairdressers Are Female, but so Are Doctors](https://ceur-ws.org/Vol-3671/paper10.pdf) (Spillner et. al)
+
+[20] [Measuring and Mitigating Racial Bias in Large Language Model Mortgage Underwriting](https://papers.ssrn.com/sol3/papers.cfm?abstract_id=4812158) (Bowen et. al)
+
+[21] [A Robot Walks into a Bar: Can Language Models Serve as Creativity Support Tools for Comedy? An Evaluation of LLMs' Humour Alignment with Comedians](https://arxiv.org/abs/2405.20956) (Mirowski et. al)
+
+[22] [White Men Lead, Black Women Help: Uncovering Gender, Racial, and Intersectional Bias in Language Agency](https://arxiv.org/html/2404.10508v1) (Wan et. al)
+
+[23] [Steering LLMs Towards Unbiased Responses: A Causality-Guided Debiasing Framework](https://arxiv.org/pdf/2403.08743) (Li et. al)
+
+[24] [Identifying and Improving Disability Bias in GPT-Based Resume Screening](https://arxiv.org/abs/2402.01732) (Glazko et. al)
+
+[25] [Breaking the Bias: Gender Fairness in LLMs Using Prompt Engineering and In-Context Learning](https://rupkatha.com/V15/n4/v15n410.pdf) (Dwivedi et. al)
+
+[26] [“They Only Care To Show Us The Wheelchairâ€](https://dl.acm.org/doi/full/10.1145/3613904.3642166) (Mack et. al)
+
+[27] [Cerebral Palsy Facts](https://cprn.org/cerebral-palsy-facts/#:~:text=10%20%E2%80%94%20About%2040%2D50%20percent,palsy%20may%20change%20over%20time.) (Cerebral Palsy Research Network)
diff --git a/projects/teaching.md b/projects/teaching.md
new file mode 100644
index 0000000000000000000000000000000000000000..294b209ac3646276e6d1f7822f54cf66f1ab5414
--- /dev/null
+++ b/projects/teaching.md
@@ -0,0 +1,161 @@
+---
+layout: default
+title: Teaching Accessibly
+description: A Universally Designed Resource for Universal Design
+---
+
+# A UDL Index into UDL Content
+
+Suzanne Ender & Adrian Rodriguez | CSE 513 | Spring 2024
+
+
+
+## Introduction
+
+Promoting and developing high level literacy skills in Middle and High School classrooms is complex. The increasingly diverse student population enrolling in schools across the United States adds to this complexity (Meo, 2008; Nowicki, 2022; NCES, 2023; Rao & Meo, 2016). Along with this, higher rates of inclusion and greater access to general education settings for students with disabilities (SWD) further impacts the heterogeneity of general education classroom settings (IDEA, 2004). Current and future students will continue to present a wider range of racial or cultural identities, linguistic repertoires, funds of knowledge or background knowledge, skills and abilities in general education settings than in previous decades.
+
+To support the needs of diverse learners, instruction must be dynamic and flexible. Universal Design for Learning (UDL) is one framework that helps teachers design or implement multidimensional instruction to support a range of learners. The UDL framework centers on three key instructional principles: material representation, student engagement, and opportunities to demonstrate thinking and learning. According to UDL, teachers can support a diverse classroom of learners by offering multiple ways for students to access content and material, engage in learning, or demonstrate thinking and learning.
+
+Current research on UDL suggests that UDL instruction positively impacts student learning and success (Cite). Although more research is needed in order to better understand the full impact of UDL on student learning, most evidence suggests that UDL promotes inclusive, accessible and dynamic learning opportunities for a range of learners. UDL research has also explored the way teachers implement UDL in classroom settings. The majority of UDL instruction is implemented by Special Education teachers or takes place outside of general education classroom settings while a smaller number of studies evaluate UDL instruction in general education settings. Considering that general education classroom settings represent wider ranges of students’ skills, abilities, knowledge, languages, cultures, and other identity markers, implementing UDL instruction in general education settings may help teachers meet a wide range of learning profiles for general education students as well.
+
+A few studies have explored the role of UDL in general education classroom settings. UDL is commonly associated with assistive technology or also tends to be considered in terms of supporting students in “special education.†General education teachers ….. A driving force behind our CSE 513 final project stems from a need to encourage and support general education teachers to implement UDL instruction in their classrooms. One way to support classroom teachers is to offer a resource on UDL instruction. This resource could support teachers by sharing how UDL helps teachers plan and implement instruction to meet a range of learning needs. This resource could also offer specific steps or strategies for teachers to implement in their own classroom to support diverse learners.
+
+Suzanne Ender and Adrian Rodriguez co-developed a tool to help general education classroom teachers integrate UDL instruction into their own classrooms. Suzanne Ender used her theoretical understanding about instruction, pedagogy and Universal Design to design the overall concept and make critical decisions throughout the design process. Adrian applied his expertise in web design and technology development to engineer, and develop the actual tool and interface for this project.
+
+Overall, Suzanne Ender and Adrian Rodriguez created a “UDL Index into UDL content†as a CSE 513 final project. While the tool is still in initial development phases, it successfully presents information and strategies on UDL to support teachers. By offering a free, accessible tool on UDL instruction, this tool ultimately aims to promote inclusive, accessible, and engaging learning environments for diverse learners in classroom settings.
+
+## Methodology and Results
+
+### Introduction
+
+#### What did you design or implement?
+
+“UDL index into UDL content†is a tool or resources to support classroom teachers. The tool intends to share information about UDL as well as instructional tips and strategies. Suzanne Ender and Adrian Rodriguez partnered to design this tool. The overall design of this project took place across several phases.
+
+### Phase 1
+
+#### Theoretical Framework: Concept Development
+
+The first phase of the project identified a current problem of practice. Suzanne’s literature review evidenced the need to share information on why and how UDL can help general education teachers meet the diverse learning needs of general education teachers. This initial phase is an important step in the development of our tool because it establishes a rationale that is also substantiated in current research.
+
+After identifying the rationale and problem of practice, conceptual development and brainstorming was the next step in development. In this phase, Suzanne reviewed data from a current survey she disseminated as a means to better understand how teachers currently offer universally designed instruction in general education classrooms. In this survey, Middle and High School general education teachers answered questions about ways they offer a variety or formats, assistive supports, and components within texts and materials to support diverse learning needs in general education classrooms. Survey questions also asked about barriers that limited teachers’ ability to offer universally designed instruction in their classrooms. In reviewing survey data, several themes emerged on ways teachers implemented instruction. Common limitations or barriers were also identified. Based on this survey data, offering electronic texts as well as graphic organizers were the most common ways teachers modified instruction to support learners. Teachers reported limited resources, training, and money as common barriers for implementation.
+
+Reviewing literature substantiated a need to support teachers with UDL instruction in classroom settings. Results from survey data further identified several parameters and specifications to consider when developing a tool. Developing a tool that offers accessible, comprehensive support at low or no costs could mitigate some of the challenges and barriers that limit teachers’ ability to strengthen and improve UDL instructional design. Based on teacher reports, a tool that shares a variety of options on presenting UDL text and material may also encourage teachers to expand their skill-set and teacher practices.
+
+Phase one served to substantiate the development of a tool to support general education classroom teachers with UDL. It also served to identify what parameters or specific features should be included in this tool.
+
+The final step in this phase was to determine how to engineer or design a tool based on the conceptual framework and specifications. For this phase, Adrian Rodriguez agreed to partner in this project in order to contribute his wide expertise in computer engineering and website design.
+
+#### Theoretical Framework: Engineering and Design
+
+In this phase, Adrian and Suzanne met to brainstorm ways to engineer and design this tool. Adrian served as the lead for this phase and offered a variety of ways he could design the tool to also meet specific parameters. One of Adrian’s areas of expertise is to engineer and design dynamic, interactive web interfaces that enhance user experiences.
+
+Adrian guided the technical development of this tool by asking many questions. Interestingly, but not surprisingly, many of the answers to Adrian’s technical questions were answered by considering the theoretical framework we established in phase one of the project. For example, since promoting Universal Design is the overarching purpose for this tool, Adrian promoted the engineering and developing this tool should also consider fundamental principles of UDL. By applying UDL principles to the design of this tool, the tool will offer content and material to support UDL instruction while simultaneously serving as an example on how UDL enhances learning and user experience. Essentially, Adrian’s suggestion to prioritize UDL principles in the design of the tool amplified the value and potential that this tool can realize its potential.
+
+### Phase 2
+
+#### Technical Development
+
+After our initial meeting, Adrian and Suzanne took steps to turn the design ideas into reality. Adrian was responsible for the engineering and development of the project. Suzanne developed the information and content that would be uploaded into the tool. While most of this work was differentiated based on our skill sets, we consistently communicated with each other in order to align our development while also holding true to our original design principles and conceptual framing. A number of decisions about the technical design as well as the content and material were made by dialoguing and partnering. Deciding on user interface options is one example of our partnership. In line with UDL, it was important to offer diverse options to access the content in our tool. According to universal design, representing material in multiple ways is one way to support universal access. Some users may prefer to access material in audio format. Other users may prefer to read text descriptions. A key feature of our tool was to prioritize this feature. This shaped the underlying framework to engineer this tool. This also came to play on a more surface level as well. When prompting users to select a preferred modality for accessing content and information in this tool, Adrian and I partnered to determine what this should look like. Adrian offered a variety of examples such as a verbal prompt, a toggle, or having the user select “buttons†or visual representations of different modalities. When choosing interface “aesthetics†for this tool, we referred to the theoretical underpinnings of Universal Design and jointly decided on ways to engage users.
+
+#### What were your metrics for success, and how did you validate?
+
+After the initial design phase, Adrian and Suzanne spent considerable effort designing the tool and creating the content. Communication and collaboration were important ways Suzanne and Adrian successfully executed the work and established metrics for success. Logistical metrics were important to consider given the time constraints and product deadlines. To meet goals and objectives, Adrian and Suzanne verbalized and agreed on specific “achievement†goals and deadlines to create content or develop a prototype of the tool.
+Adrian and Suzanne also established metrics to measure the performance and operation of this tool. Checkpoint 1 served as one metric. We presented our design plan to CSE 513 and asked for feedback or suggestions. Jen offered high level feedback on areas we could focus on with this tool. As an expert in the ways humans interface with computers as well as UDL, Jen’s feedback served as a metric to validate the rationale and relevance for developing our tool.
+Following Checkpoint 1, Adrian and Suzanne integrated additional metrics to evaluate progress, performance, and usability of our tool. After developing content, Adrian reviewed material and offered feedback on quality and clarity. He also used the UDL theoretical framework to evaluate the content. This served as a valuable metric by enhancing the integrity as well as quality of the content and material.
+On the engineering side, metrics were employed throughout the development phase. Adrian tested and validated many components that contributed to the overall design of the tool. (Images, font, layout, web design). Additionally, Suzanne and Adrian used Click Depth, the number of actions a user needs to perform to reach a given piece of functionality, to continuously evaluate the website’s “interaction cost.†Specifically, Suzanne and Adrian committed to a maximum Click Depth of two mouse clicks and four keyboard commands to reach all content on the site.
+
+## Positive Disability Principles
+
+### Is it Ableist?
+
+What parts of the work are accessible and what are not (for example, are both design tools, and their outputs accessible?
+Our work aims to support users with diverse backgrounds and abilities. To this end, we began by ensuring that every aspect of our website functions with a screen reader. This work included deliberate grouping and labeling of elements to ensure both Comprehensibility and Operability. As a screen reader user himself, Adrian appreciates that traversing web content via “source order†(i.e. the order in which elements appear in HTML code) does not always relate a website’s key features; listening to a series of introductory paragraphs, a common document structure, does not convey whether a web page hinges on a key element halfway down the page. To preserve and relate hierarchy, Suzanne & Adrian employed stringent containerization patterns and utilized WCAG-ARIA to create deliberate “landmarks†for all key content areas of their tool, including media control panels. This effort allows screen reader users to index directly into all key points of interest. Moreover, Suzanne & Adrian implemented motor-friendly arrow-based keyboard controls for advancing content, and they used an aria-live region to notify blind users of changes to the tool's Document Object Model (DOM). Hence the authors implemented best practices to ensure that their tool supports users with diverse sensory needs. Given that Blind and Visually Impaired (BVI) people comprise a relative minority among target users, prioritizing this especially “confounded†group aligns with Sin’s Invalid’s Second Principe, Leadership of the Most Impacted. The authors also resisted Ableism by accounting for uses with complex identities.
+
+### Disability is Intersectional and Heterogeneous:
+
+_The following two subsections are written in Plain Language for fulfillment of the Plain Language Competency by Adrian Rodriguez_
+
+#### What Makes You, You?
+
+What makes us who we are? Is it our age? Is it the color of our skin? Or is it the memories we have made? People who study race and sex believe that all of these things make us who we are. We call people who study things like race, sex, and power Social Scientists. Social Scientists believe all . More importantly, they believe that, when Let’s go over an example.
+Adrian is a Hispanic man who qualifies as “legally blind.†Being “legally blind†means he cannot read small text no matter how close he gets to it. Adrian also can’t read large text unless he puts his face a few inches away from it. This experience made Adrian’s childhood very different from his older brother’s childhood. Hector, Adrian’s older brother, faced many challenges as a Hispanic kid growing up in America, and Adrian faced many challenges as a Blind kid. But the challenges that Adrian faced as blind Hispanic kid are totally different from the challenges his brother faced. They are also different from the challenges that the White blind kids Adrian knew faced. For example, kids who are just blind often receive special classes to help them use their hearing. And Hispanic kids often receive extra English classes to help them learn the language. But, because Adrian needed help with English and his vision, his school district classified him as having deep learning problems, even though Adrian has always been good at learning. The lesson is that we are made of multiple things about us– not just one thing. And the experience of people who don’t fit in for multiple reasons is unique– and sometimes much worse– than people who don’t fit in for just one reason. That’s why we designed a website that includes computer-generated “learning buddies†that act like people with multiple kinds of life experiences.
+
+#### We Understand the Things We Know
+
+Imagine you are talking to your mother, father, or a close family member. You and this family member probably have a lot in common. Because you have so much in common, it is easier to speak with this person. They can explain things to you by talking about things you already know. You two are already in sync. Now think about your teacher. At first, you might not have been able to understand them so easily. And, if you and your teacher come from a different place, it might always be a bit difficult to understand them. What if your favorite family member, or your best friend, could teach you?
+We believe that learning from people that understand us in a deep way can make school easier. For this reason, we created a website where you can have a computer-generated tutor rewrite books for you in a way that is easier to understand. For example, if you are a totally blind African American female, you might want to learn certain things from someone who is also a totally blind African American female. Of course, the computer-generated assistants on our site are not real people, but they are very good at explaining things as if they were.
+
+### Nothing About Us Without Us
+
+#### Are people with disabilities engaged in guiding this work? At what stages?
+
+One positive disability principle asserts that people with disabilities must always be present when there is any effort, decision, or discussion that involves a person with a disability. In future phases, it will be important to seek counsel from people or experts with disabilities in order to validate or improve the degree that our tool promotes universal access. Cross validation from individuals with disabilities can also serve to improve, modify, or validate the content that we present in our tool. We aim to offer a wide range of options that teachers can use to promote UDL in their classrooms. Input from people with a range of access needs will be a crucial step to make sure our tool comprehensively addresses ways to support learners.
+
+Along with the need to check membership and gather input, the positionality of the authors do substantiate and positively reflect this disability principle. Suzanne identifies as a person with a ‘hidden disability’ who benefits from multimodal input to support her learning needs. Her lived experience contributes and supports the disability principle that people with lived experience with a disability are experts when it comes to knowing what is most supportive. Adrian, on the other hand, is a person of color with visible sensory disability. His positionality enabled him to appreciate the value of screen reader support. Moreover, his experiences as an English as a Second Language Learner motivated him to promote cultural pluralism through the language options the website offers.
+
+### Disability Agency, Independence and Autonomy:
+
+#### Is it being used to give control and improve agency for people with disabilities
+
+Efforts to promote agency, independence and autonomy for people with disabilities is a positive disability principle that is integral to our work in this project. The United States has a tragic and devastating history of systemically oppressing, excluding and disenfranchising people with disabilities. The legacy and historical underpinnings of exclusion traces back to the early European colonization efforts that ceded land from indigenous people across the North American continent. At the earliest stages, heteronormative, ableistic, sexist, racist, monolingual norms have served to exclude, oppress, or silence people. For this reason, this positive disability principle aims to prioritize agency, independence and autonomy for people with disabilities. Apart from the historical context, assuming competence and fostering agency, independence, and autonomy serves to empower people with disabilities and instills opportunities to thrive, self-actualize and make their own decisions. This disability principle is an underlying framework for our project. The tool aims to help teachers UDL instruction for diverse learners. In this way, UDL instruction promotes students’ ability, agency, and autonomy to successfully engage and learn.
+The technical design of our tool also aligns with this positive disability principle. To encourage teachers to use this tool, we acknowledged the heterogeneity of teachers. By integrating UDL into the design elements of this tool, we aim to promote user agency, independence, autonomy that supports their interests and learning needs.
+
+## Related Work
+
+Developing a universally designed tool that supports UDL instruction is significant and relevant at this point in time. On April 8, 2024 the Federal Review posted an official ruling requiring the accessibility of web or electronic content from all state and local government entities, including public schools. This ruling is specifically referring to the need for schools to ensure electronic content such as websites, curriculum, documents, and other interfaces be accessible to all learners, regardless of skill or dis/ability. The tool we developed adheres to accessibility standards identified in this legislation and serves as a model or exemplar of accessible web content. In a recent study on web accessibility throughout universities, key accessibility features such as alternative text, parsing, and link purpose were missing up to 85 percent of the time (MacakoÄŸlu, 2023). Beyond academia, inaccessible web content or technology prevails throughout privately or publicly developed websites. In an effort to counterbalance the overwhelming abundance of web or technology inaccessibility, our tool serves as an exemplar or model of fully accessible web content.
+
+## Disability Model Analysis
+
+### UDL
+
+Universal Design (UDL) is one framework that helps teachers design or implement multidimensional instruction to support a range of learners. The UDL framework centers on three key instructional principles: material representation, student engagement, and opportunities to demonstrate thinking and learning. This framework is foundational to all phases of developing in our work. Integrating principles of UDL played a role in reviewing research, identifying problems of practice, brainstorming tool development, content and material development, engineering and design, as well as user interface.
+
+### DisCrit
+
+According to DisCrit theory (Annamma et. al, 2013), intersectional identity markers all play a role in inclusion and access. The DisCrit framework acknowledges that identity markers such as ability, race, class, and language intertwine and impact one's access to resources, education, and employment. The DisCrit theoretical framework played an important role in the design process of this tool. In designing our tool, our goal was to offer teachers the opportunity to learn about UDL dynamic, interactive format. With UDL in mind, we designed a tool with options to read or listen to the text. We also offered content in full text or abridged versions. Screen reader compatibility was also a feature in our design. To enhance accessibility and universal access, we designed this tool with intersectionality in mind. If users choose to access the material via “audio,†they have the option to hear content presented by three different personas. The personas range in identity markers in terms of skin color, hair, features, and voice dialect. Our effort to include diverse personas in this tool supports intersectionality in two ways. In one way, our tool promotes representation of pluralistic identities across the teaching force. At least 80% of the teaching workforce identifies as White/European descent. Incorporating voices and personas that represent teachers who may be multilingual or identify as BIPOC serves to elevate and acknowledge these perspectives and voices. Along with this, a body of work acknowledges that affinity groups where people share identity markers offer affirming and validating experiences. Including opportunities for users to hear content from a person that aligns with their own identity markers may enhance and improve user experiences. Finally, our decision to represent intersectional identities serves as a means to prioritize and elevate pluralistic, intersectional voices and identities. This is one small effort to promote inclusive content that is both anti ableist as well as antiracist.
+
+### Feminist Disability Theory
+
+The feminist dis/ability framework (Garland-Thompson, 2005) is another helpful framework to evaluate or analyze our work. An important component of the feminist dis/ability framework addresses the relationship between identity markers, power, and access. Under the feminist dis/ability framework, it is important to consider how power and identity may interplay in terms of access and inclusion. Elements of the feminist disability framework integrate with several aspects in our work. In the initial phases of this work, survey data suggested that access to resources and financial constraints were barriers that limited teachers’ ability to learn or implement UDL instruction. With this in mind, we designed a tool that would eliminate these barriers. Our tool is free, accessible, and multidimensional. Our tool presents comprehensive aspects of UDL: It defines UDL, explains why it supports learners, and offers specific strategies or steps teachers can take to implement UDL in their own classrooms. Our effort to provide a free, accessible, and comprehensive tool is a way we empower teachers to gain knowledge and improve their practice. School systems commonly include bureaucracy and power structures that limit teachers’ agency or access to resources. Our tool breaks down barriers and democratizes UDL professional development for any teacher who would benefit from our resource.
+
+### Learnings and Future Work
+
+Overall, we came to an important conclusion that presenting simple, generic questions are robust, inclusive, and comprehensive ways to promote universal access. For example, presenting toggles for audio, full text, or multimodal presentation effectively supports universal access for a wide range of users. When designing instruction to meet diverse learning needs, teachers frequently need to consider the intersectional and multimodal learning needs for a number of students. Doing so takes time, effort, and dedication. However, a key principle that came up in designing this project revealed that universal design does not have to be complicated. Asking simple questions provides opportunities for a wide range of users to successfully access content. Presenting content via audio may support users who are in transit, have diverse visual capabilities, and/or are multitasking, such as caretaking or cooking.
+Launching this tool has been rewarding, informative, and satisfying. Collaboration by Suzanne and Adrian reinforces the power of collaboration and interdisciplinary partnerships. With effort, communication, and dedication, Suzanne and Adrian realized a sophisticated and dynamic tool may positively impact teachers as well as students. Future work may include efforts to refine and improve the user experience. Adding content is another way the tool may continue to develop. Before modifying or revising our tool, it will be important to pilot our tool to see how diverse users experience and interact with it. This work could take place in the form of a pilot study that could include qualitative interviews, focus groups or collecting survey data. These sessions will provide valuable input and will serve as an additional validity metric.Farther down the line, “implementation†research could take place in order to learn how this tool supports teachers in UDL instruction.
+
+## Competencies
+
+### Adrian
+
+- Plain Language Writing
+- Accessible Presentation
+
+### Suzanne
+
+- Accessible Presenting
+- Accessible Document Creation
+- Application of Positive Disability Principals
+- Disability Model Analysis
+- Finding First Person Accounts
+- Familiarity with a Range of Accessibility Technologies
+
+## References
+
+Annamma, S. A., Connor, D., & Ferri, B. (2013). Dis/ability critical race studies (DisCrit): Theorizing at the intersections of race and dis/ability. _Race Ethnicity and Education, 16_(1), 1-31.
+
+Berne, P., Morales, A. L., Langstaff, D., & Invalid, S. (2018). Ten principles of disability justice. _WSQ: Women's Studies Quarterly, 46_(1), 227-230.
+
+Elavsky, F., Mankoff, J., & Satyanarayan, A. (2022). Increasing Data Equity Through Accessibility.
+
+Garland-Thomson, R. (2005). Feminist disability studies. _Signs: Journal of Women in Culture and Society, 30_(2), 1557-1587.
+
+Heumann, J., & Joiner, K. (2020). _Being Heumann: An unrepentant memoir of a disability rights activist_. Beacon Press.
+
+Irwin, V., De La Rosa, J., Wang, K., Hein, S., Zhang, J., Burr, R., ... & Parker, S. (2022). Report on the Condition of Education 2022. NCES 2022-144. National Center for Education Statistics.
+
+Meo, G. (2008). Curriculum planning for all learners: Applying universal design for learning (UDL) to a high school reading comprehension program. _Preventing School Failure: Alternative Education for Children and Youth, 52_(2), 21-30.
+
+Rao, K., Gravel, J., Rose, D., & Tucker-Smith, N. (2023). Universal Design for Learning in its 3rd decade: A focus on equity, inclusion, and design. _International Encyclopedia of Education, 6_, 712-720.
+
+Shakespeare, T. (2006). The social model of disability. _The Disability Studies Reader, 2_(3), 197-204.
diff --git a/schedule-quals.md b/schedule-quals.md
new file mode 100644
index 0000000000000000000000000000000000000000..493c5bdd1f6886eae886e1f1790f9ff01504010b
--- /dev/null
+++ b/schedule-quals.md
@@ -0,0 +1,216 @@
+---
+layout: default
+title: Schedule
+description: Class schedule and links to lectures, readings and assignments
+warning: draft
+---
+* TOC
+{:toc}
+
+ {: .week}
+# Week 1: Introduction to Disability & Accessibility & Accessible Documents
+
+{: .topic}
+
+{: .topic}
+## **Wednesday** {% include slide.html title="Introduction to Course" loc="introduction.html" %}
+ - Learning Goals
+ - What is Accessibility? Disability?
+ - Some Disability History
+ - What is competency based grading and how does it work?
+ - Skill Goal: Learn how accommodations can make a meeting more inclusive (see slides for In class Exercise and post on our [Discussion Board]({{site.discussion}}))
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> [At Around US](assignments/finding-accessibility.html)
+
+{: .topic}
+## **Friday**: {% include slide.html title="Presenting Accessibly" loc="presenting-accessibly.html" %}
+ - Learning Goals:
+ - How to create accessible documents
+ - How to present accessibly
+ - Skill Goal: Describe a person (see slides for in class exercise)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Preparation & Reading
+ - Bring a visual representation of yourself to class
+ - Read about [Creating Accessible Figures and Tables (DIS)](https://dis.acm.org/2023/creating-accessible-figures-and-tables/) and try out the [Image ALT Text Tutorial](https://webaim.org/techniques/alttext/)
+ - Read ["It's Complicated" (Bennett et al)](https://dl.acm.org/doi/10.1145/3411764.3445498)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Optional: ["Living Disability Theory: Reflections on Access, Research, and Design." (Hofmann, et al)](https://make4all.org/wp-content/uploads/3373625.3416996.pdf)
+
+{: .week}
+# Week 2: AT Around Us Presentations & Plain Language
+
+{: .topic}
+## **Wednesday** AT Around Us and {% include slide.html title="Plain Language" loc="plain-language.html" %}
+ - 60 minutes of AT Around Us presentations
+ - Learning Goals:
+ - Introduction to how to use plain language
+ - Discussion of best practices in returning research to the disability community, such as member checking, workshops, and creation of prestige opportunities for community members
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Prep:
+ - [Plain language writing](https://www.forbes.com/sites/andrewpulrang/2020/10/22/plain-language-writing---an-essential-part-of-accessibility/)
+ - [Plain language](https://pudding.cool/2022/02/plain/)
+ - [Disability Dongles](https://blog.castac.org/2022/04/disability-dongle/) by Liz Jackson, Alex Haagaard, Rua Williams
+ - Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4659767)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Optional: [Design, Disability and Knowing the 'Other'](https://dl.acm.org/doi/fullHtml/10.1145/3290605.3300528)
+
+{: .topic}
+## **Friday** {% include slide.html title="Disability Design Models" loc="designing.html" %}
+- Learning Goals
+ - Understand models for disability-centered design
+ - Pitfalls and Tropes in Disability Work
+ - Introduction of Disability Justice and Disability Dongles
+ - 10 minutes: Discussion of
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> [Research Paper Analysis](assignments/disabilityjustice.html) and
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> [Plain Language](assignments/plain-language.html) & sign ups
+
+{: .week}
+# Week 3: Disability Design (cont) & Building Accessible Interfaces
+
+{: .topic}
+## **Wednesday** Reading Discussion
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Prep
+ - Read this [Twitter Thread](https://twitter.com/FrankElavsky/status/1643627602882486276) by Frank Elavsky and [the authors' response](https://adildsw.github.io/#/projects/fingerrover/).
+ - Read [the original Finger Over paper](https://adildsw.github.io/docs/chi23_fingerrover_authorscopy.pdf)
+ - Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4709326)
+
+{: .topic}
+## **Friday** {% include slide.html title="How to build for accessibility" loc="best-practices.html" %}
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Read: [An epidemiology-inspired, large-scale analysis of mobile app accessibility](https://dl.acm.org/doi/10.1145/3348797)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Homework: [Improve accessibility of a thing](assignments/technology-implementation.html)
+
+{: .week}
+# Week 4: Building & Remediating Accessible Interfaces
+
+{: .topic}
+## **Wednesday** More discussion of accessible design and standards {% include slide.html title="How to build for accessibility 2" loc="best-practices2.html" %}
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation
+ Read any of the following papers about how to describe non photographs (pick one that is of interest to you) and find an example of the thing that paper mentions (e.g. an example GUI, meme, diagram, etc)
+ - [Decorative and branding](https://dl.acm.org/doi/fullHtml/10.1145/3308558.3313605)
+ - [Diagrams](https://ieeexplore.ieee.org/stamp/stamp.jsp?arnumber=9028522&casa_token=zZw_rYBgu1AAAAAA:eozpbJ-vvMZjQNt8p6WU91X4uFumPs-yVuMn4PTPRjyMhtsVrprdIEe1JfYOCUdv8SFP_TGd9s965Q&tag=1)
+ - [Visualizations](https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=9555469)
+ - [Memes](https://dl.acm.org/doi/10.1145/3308561.3353792)
+ - [GUIS](https://dl.acm.org/doi/fullHtml/10.1145/3411764.3445040)
+ - AR/VR ([Accessibility, Disabilities, and VR](https://educatorsinvr.com/2019/05/31/accessibility-disabilities-and-virtual-reality-solutions/))
+ - [Rich Interaction Components](https://dl.acm.org/doi/pdf/10.1145/2851613.2851680?casa_token=dOz4huS0TUkAAAAA:zv0PjZk3-T8Bb4X2SfNpdZFuqO2u9v1jpWn5fq0hKZ0se6t5g0oMKLfrAmhlyufcw_3AuJ-ABZ2yWQ)
+ - [CAPTCHAs](https://dl.acm.org/doi/10.1145/1518701.1518983)
+ - Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4752400)
+
+{: .topic}
+## **Friday** Discussion of barriers to accessible design
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation
+ - Read: [Accessibility in Software Practice: A Practitioner’s Perspective](https://dl.acm.org/doi/abs/10.1145/3503508)
+
+{: .week}
+# Week 5: Fabrication
+
+{: .topic}
+## **Wednesday** (in CSE 2 G15) {% include slide.html title="Fabrication and Accessibility" loc="3dprinting.html" %}
+ - Introduction to laser cutting, 3d printing & machine knitting
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Preparation (Everyone)
+ - [Lasercutting with Tinkercad](https://www.tinkercad.com/blog/laser-cutting-with-Tinkercad) and join our [Tinkercard Classroom](https://www.tinkercad.com/joinclass/IEPJ5JFZ3) and complete the tutorial in our [Laser Cut Accessibility Aid](https://www.tinkercad.com/classrooms/ggOBiyjeTmk/activities/gyj2wAxjib7) activity.
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Reading Assignment:
+ - [Empowering individuals with do-it-yourself assistive technology](https://drive.google.com/open?id=17M_-NY35P0wnXTD1kacD33Tt43lqwMsu&usp=drive_fs)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Optional: [Consumer-Grade Fabrication and Its Potential to Revolutionize Accessibility](https://cacm.acm.org/research/consumer-grade-fabrication-and-its-potential-to-revolutionize-accessibility/), CACM 2019.
+
+{: .homework}
+
+{: .topic}
+## **Friday** (in CSE 2 G15) Working on Lasercutting Project
+ - Fabrication lab: Making an accessible thing using a laser cutter
+
+{: .homework}
+
+{: .week}
+
+# Week 6: Formative work and AI x Accessibility
+
+{: .topic}
+## **Wednesday** {% include slide.html title="Formative Accessibility Work" loc="formative.html" %}
+- Learning Goals
+ - Formative studies methods for inclusive design
+ - Accessible studies for disabled participants and researchers
+- Read [Anticipate and Adjust](https://dl.acm.org/doi/fullHtml/10.1145/3491102.3501882) CHI 2022
+- Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4861589)
+
+{: .topic}
+## **Friday** AIxAccessibility
+- Learning Goals
+ - What are some of the risks and opportunities in using AI for accessibility
+ - Skill Goal: Develop Benchmark Tasks, with a focus on ableism in generative AI (in class exercise)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> AI Readings and Preparation
+ - Read Risks and Opportunities in AI-based Applications for People with Disabilities ([On Canvas](https://canvas.uw.edu/courses/1718621/files/folder/readings?preview=118276521); CACM, To Appear)
+ - Read [GenAssist: Making Image Generation Accessible](https://dl.acm.org/doi/fullHtml/10.1145/3586183.3606735) UIST 2023
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Optional: [Data Representation in Accessibility Data Sets: A Meta-analysis](https://dl.acm.org/doi/fullHtml/10.1145/3517428.3544826)
+
+
+{: .week}
+# Week 7: Project Milestone Presentations
+
+{: .homework}
+## <i class="fa-solid fa-house-laptop" aria-hidden="true"/> [Project milestone presentations](assignments/project-checkpoint.html) (written & presented)
+
+{: .week}
+# Week 8: Data Visualization & XR
+## **Wednesday** Accessible Data Visualizations
+ - Learning Goals
+ - What are the commonly-used techniques to make data visualizations accessible?
+ - What are the pros and cons of these techniques?
+ - What are some of the nuances in making data visualizations accessible?
+ - In-class work on an accessible visualization
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation
+ - [Beyond Vision Impairments: Redefining the Scope of Accessible Data Representations](https://ieeexplore.ieee.org/abstract/document/10411059?casa_token=S322L-0vUCsAAAAA:7B94PN3INQVxZmHRP8IvahtS2MG4eKMa5q6M84mFLjdMTkCjuXcWKVs5niMRFXDlXyrDQEmhAy_58g)
+ - [Increasing Data Equity in Accessibility](https://arxiv.org/abs/2210.01902)
+ - <i class="fa-solid fa-house-laptop" aria-hidden="true"/>**Optional**: [VoxLens: Making Online Data Visualizations Accessible With an Interactive JavaScript Plug-In](https://dl.acm.org/doi/fullHtml/10.1145/3491102.3517431)
+ - Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4953187)
+
+## **Friday** XR/AR/VR
+
+- <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation
+ - [A systematic literature review of handheld augmented reality solutions for people with disabilities](https://www.mdpi.com/1424-8220/22/20/7719);
+ - Available now: [OverTHERE](https://apps.apple.com/us/app/overthere/id1126056833); [Honor Everywhere](https://www.oculus.com/experiences/go/1634724596608007/); [Accessibility, Disabilities, and Virtual Reality Solutions](https://educatorsinvr.com/2019/05/31/accessibility-disabilities-and-virtual-reality-solutions/)
+ - Optional:
+ - [SeeingVR: A set of tools to make virtual reality more accessible to people with low vision](https://dl.acm.org/doi/fullHtml/10.1145/3290605.3300341);
+ - [AR4VI: AR as an accessibility tool for people with visual impairments](https://ieeexplore.ieee.org/abstract/document/8088507?casa_token=1ljGqVmunOsAAAAA:AmtEC4AL2x5t0A8p51rBPTpBrw8Utxub6qUX5OE1L6AHg08iDlgGXkLuXOWl0Oo4XktQRNICFNBXbg).
+ - Post your response to [reading questions for these readings on Ed](https://edstem.org/us/courses/56844/discussion/4861589)
+
+
+{: .week}
+# Week 9: Intersectionality & Sustainability
+
+- <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation (Intersectionality)
+ - Harrington: [Working at the Intersection of Race, Disability and Accessibility](https://dl.acm.org/doi/fullHtml/10.1145/3597638.3608389)
+ - Listen/watch to one of the following first person accounts
+ - [Stop Doing That!](https://www.youtube.com/watch?v=hMr831Ro2-k&feature=youtu.be) With Nyle DiMarco | January 30, 2019 Act 3 | Full Frontal on TBS, Samanth Bee and Nyle DiMarco explain what harms often occur when police encounter Deaf people
+ - [Chicas talk disability](https://www.manhattantimesnews.com/they-thought-i-was-a-criminalpensaron-que-yo-era-una-delincuente/) Police Interactions with People With Disabilities
+ - AAC User Perspectives on Racism and Disability. From time 42:25 [Podcast Website](https://talkingwithtech.podbean.com/e/kevin-williams-lateef-mcleod-black-aac-user-perspectives-on-racism-and-disability/) | [YouTube at Timestamp](https://youtu.be/iTSAK4yRf5A) | [Transcription](https://courses.cs.washington.edu/courses/cse590w/20au/uwnetid/TranscriptBlackAACUserPerspectivesonRacismandDisability_Trim.docx)
+ - Optional: Anything from the [20au CREATE seminar](https://courses.cs.washington.edu/courses/cse590w/20au/)
+
+- <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation ( {% include slide.html title="Sustainability" loc="sustainability.html" %}
+ - Kelley-Costello: [A just transition for disabled people](https://www.disabilitydebrief.org/debrief/messy-climate-transitions/)
+ - Hamidi and Karachiwalla: ["I'm ok because I'm alive": understanding socio-cultural accessibility barriers for refugees with disabilities in the US](https://dl.acm.org/doi/10.1145/3493612.3520446)
+ - Optional: Anything from the [24w CREATE seminar](https://courses.cs.washington.edu/courses/cse590w/24wi/); [Earth at risk: An urgent call to end the age of destruction and forge a just and sustainable future](https://academic.oup.com/pnasnexus/article/3/4/pgae106/7638480?login=false)
+
+{: .week}
+# Week 10: Project Milestone 2
+
+{: .homework}
+## <i class="fa-solid fa-house-laptop" aria-hidden="true"/> [Project milestone presentations](assignments/project-checkpoint.html) (written & presented)
+
+- 4 presentations on Wednesday
+- 2 presentations on Friday
+
+- <i class="fa-solid fa-house-laptop" aria-hidden="true"/> Readings and Preparation
+- Accessibility and Grading [Ungrading for access and equity](https://www.insidehighered.com/news/student-success/academic-life/2023/04/11/ungrading-form-access-equality-classroom)
+- Accessibility and Course design: [Creating an accessible cours](https://sds.cornell.edu/resources/faculty-staff/universal-design-instruction)
+- Accessibility Curriculum: [Teach Access on Fundamentals](https://teachaccess.org/wp-content/uploads/2018/03/Teaching-Accessibility-Fundamental-Skills-and-Concepts.pdf)
+
+Optional/perhaps of interest
+- [RIT research project on teaching accessibility](https://cair.rit.edu/teaching-accessibility/{
+- [Teaching Accessible Computing Book](https://bookish.press/tac)
+
+{: .week}
+
+
+# Week 11:
+
+# Finals week: Final presentations
+
+June 6, 2024, 230-420 pm, LOW 101
+
+
diff --git a/schedule.md b/schedule-ugrad.md
similarity index 73%
rename from schedule.md
rename to schedule-ugrad.md
index 6abf090cefdba71cfc188bb6d9489179387d91fe..bea32a316a0686c54a704d4e4c8b55ee574f003c 100644
--- a/schedule.md
+++ b/schedule-ugrad.md
@@ -154,8 +154,7 @@ Maybe a hands on exercise. Also discuss Aria
**Thursday Section** Group work on Report
-**Friday Slides** {% include slide.html title="Comparing Automated Testing and Manual Testing" loc="comparing-approaches.html" %}
-
+jw
## Homework
{: .homework} Required Reading and Reflection (for Wednesday)
:
@@ -258,7 +257,6 @@ Finish making laser cuttable designs and print
- Read [Empowering individuals with do-it-yourself assistive technology](https://drive.google.com/open?id=17M_-NY35P0wnXTD1kacD33Tt43lqwMsu&usp=drive_fs) and respond to the reading question on [**Respond**]({{site.discussion}}/3756682)
- **If you want to go deeper**
- [Consumer-Grade Fabrication and Its Potential to Revolutionize Accessibility](https://dl.acm.org/doi/10.1145/3339824), CACM 2019
- - [Fairness issues in AI Systems that augment sensory abilities](https://arxiv.org/pdf/1908.07333.pdf)
{: .homework} **Assigned:** [Accessibility Implementation](assignments/technology-implementation.html)
:
@@ -271,6 +269,10 @@ Finish making laser cuttable designs and print
## Learning Goals
- Sources of Bias in AI based systems
- Applications of AI for Accessibility
+- How do you make sure your *accessibility technology is valued* by people with disabilities
+ - What are potential data sources for assessing value
+ - Collaboration Versus Paternalism
+ - Overly narrow views of disability: Multiple disabled people & multiply disabled people
## Lecture Plan
@@ -279,12 +281,19 @@ Finish making laser cuttable designs and print
{: .homework} Required Reading and Reflection (for Wednesday)
:
- **Required: Respond to the Reading Questions and Preparation Requirements.**
- - [Areas of Strategic Visibility: Disability Bias in Biometrics](https://arxiv.org/abs/2208.04712 - [Explaining Explanations: An Approach to Evaluating Interpretability of Machine Learning](https://www.cs.purdue.edu/homes/bb/nit/Lalana-Explainations%20of%20IAS.pdf)
- - [Increasing Data Equity in Accessibility](https://arxiv.org/abs/2210.01902)
+ - Please read Risks and Opportunities in AI-based applications for people with disabilities. Please also use ChatGPT or github copilot to generate
+
+ - A web element such as a link, button, or a small toy webpage. Try to assess the accessibility of this button either using an accessibility technology or an automatic checker. Respond to [this]({{site.discussion}}/3805451) post answering the following questions.
+
+ 1. Can you think of one algorithmic decision making system that you came across in your day-to-day experiences? How could this system possibly cause harm to people with disabilities?
+
+ 2. Describe your experience of generating the HTML code snippet. What did you try to generate? How accessible was it? Is generativeAI ready to help us write code that generates accessible outputs?
+
- **If you want to go deeper**
- - [The Future of Urban Accessibility for People with Disabilities: Data Collection, Analytic, Policy, and Tools](https://dl.acm.org/doi/fullHtml/10.1145/3517428.3550402)
+ - [Difficulty Vs Accessibility](https://www.youtube.com/watch?v=sPehhHZvKE8&list=PLVEo4bPIUOskja9pfpqceY8qDrykFdubf&index=18)
+ - [Fairness issues in AI Systems that augment sensory abilities](https://arxiv.org/pdf/1908.07333.pdf)
-**Wednesday Slides** {% include slide.html title="Designing for and with people with disabilities" loc="designing.html" %}
+**Wednesday Slides** {% include slide.html title="Designing for and with people with disabilities" loc="designing.html" %}; also Discussion of Final Project
{: .homework} [Final Project Proposal](assignments/project-proposals.html) Assigned: Prepare your final project proposal (individual)
:
@@ -296,154 +305,149 @@ Finish making laser cuttable designs and print
{: .holiday}
-
-{: .week}
-
-
{% enddetails %}
+{: .module}
# Module 3: Everything Everywhere All at Once
-{: .draft}
-# Everything after this is draft
-
-{% details draft content %}
-
{: .week}
-# Week 7 (11/6 - 11/10): Accessible Visualizations & AR/VR
-{% details Learning Goals and Class Plan %}
-
-Bias in Machine Learning
- - What is Machine Learning (ML)?
- - What are the components of ML?
- - How do we collect data? Who do we collect the data from?
- - Is the data "good"?
- - How do we minimize disability bias?
+# Week 8 (11/13-11/17): Sustainability & Games
+{% details Learning Goals & Plan %}
+## Learning Goals
+- How do you make sure your *accessibility technology is valued* by people with disabilities
+ - What are potential data sources for assessing value
+ - Collaboration Versus Paternalism
+ - Overly narrow views of disability: Multiple disabled people & multiply disabled people
+- Accessibility and Sustainaibility
+ - Disaster response and Access
+ - Governmentalitiy and Access
+ - Information Economy and Access
+- Accessibility in Games: Why inclusion in eSports matters and how to get there
-Accessible Data Visualizations
- - What are the commonly-used techniques to make data visualizations accessible?
- - What are the pros and cons of these techniques?
- - What are some of the nuances in making data visualizations accessible?
+## Lecture Plan
-Learn about how to make AR/VR interfaces and games accessible
+**Monday**: Group Formation & Feedback Opportunities
+In class exercise to form final project groups
-**Monday Slides** {% include slide.html title="Data Equity" loc="bias-in-machine-learning.html" %}
+**Wednesday** {% include slide.html title="Sustainability" loc="sustainability.html" %}
{: .homework} Required Reading and Reflection (for Wednesday)
:
+**Required: [Please post your response in this Ed thread]({{site.discussion}}/3851117)**
+- Watch [Difficulty Vs Accessibility](https://www.youtube.com/watch?v=sPehhHZvKE8&list=PLVEo4bPIUOskja9pfpqceY8qDrykFdubf&index=19) and respond to the following prompt:
+Think of a part of a game you’ve played that is both a source of Difficulty AND an accessibility barrier— how might you redesign it to be accessible while still keeping the satisfying game difficulty?
+- Watch [Detecting and Defending Against Seizure-Inducing GIFs in Social Media](https://www.youtube.com/watch?v=rD1p_2EHq3Y) and respond to the following prompt:
+Can you think of a potentially problematic effect in a game that you played? Why is it problematic? Is there an option to disable it?
-- **Required: Respond to the Reading Questions and Preparation Requirements.**
- - [Areas of Strategic Visibility: Disability Bias in Biometrics](https://arxiv.org/abs/2208.04712 - [Explaining Explanations: An Approach to Evaluating Interpretability of Machine Learning](https://www.cs.purdue.edu/homes/bb/nit/Lalana-Explainations%20of%20IAS.pdf)
- - [Increasing Data Equity in Accessibility](https://arxiv.org/abs/2210.01902)
-- **If you want to go deeper**
- - [A systematic literature review of handheld augmented reality solutions for people with disabilities](https://www.mdpi.com/1424-8220/22/20/7719)
- - [Understanding Screen-Reader Users’ Experiences with Online Data Visualizations](https://athersharif.me/documents/assets-2021-understanding-sru-experiences-online-data-viz.pdf) [**Respond**](TBD)
- - [Data Representation in Accessibility Data Sets: A Meta-analysis](https://arxiv.org/abs/2207.08037) [**Respond**](TBD)
- - [The Future of Urban Accessibility for People with Disabilities: Data Collection, Analytic, Policy, and Tools](https://dl.acm.org/doi/fullHtml/10.1145/3517428.3550402)
- - [Rich Screen Reader Experiences for Accessible Data Visualization](https://arxiv.org/pdf/2205.04917.pdf)
- - [VoxLens: Making Online Data Visualizations Accessible With an Interactive JavaScript Plug-In](https://athersharif.me/documents/chi-2022-voxlens.pdf)
-
-{% enddetails %}
+**If you want to dig deeper**
+- Read [Climate Crisis makes us recognize our limits: Disability culture can show us how](https://truthout.org/articles/climate-crisis-makes-us-recognize-our-limits-disability-culture-can-show-us-how/?utm_campaign=Truthout+Share+Buttons)
+- Read [The principal of collective access](https://anticapitalistresistance.org/the-principle-of-collective-access/)
+- Watch [The Right to be Rescued](https://rootedinrights.org/documentaries/the-right-to-be-rescued/)
-{% details Wednesday 11/1: AR/VR Accessibility %}
-
-**Slides** {% include slide.html title="AR/VR Accessibility" loc="arvr.html" %}
-
-**Friday Slides** {% include slide.html title="Designing for and with people with disabilities" loc="designing.html" %}
+{: .homework} [Group Project Checkpoint](assignments/project-checkpoint.html) Assigned: Group Project Checkpoint
+:
+**Thursday**: Section
+Work in groups on final projects
-{: .homework} [Technology Review](assignments/technology-implementation.html) Assigned: Make something (post-gui) more accessible
-:
+**Friday**: [Games](https://docs.google.com/presentation/d/1Ng0xbbPOTZKGJR6EqrWHmZwZKI0DAKnQs828ASuI1XQ/edit?usp=sharing)
-{% enddetails %}
-
-{% details Thursday: Section %}
-Practice with making data accessible
{% enddetails %}
-## Friday 11/10: HOLIDAY
-{: .holiday}
-
{: .week}
+# Week 9 (11/20-11/24): Group Checkpoints (Full Group Required)
-# Module 3: Everything Everywhere All at Once
+{% details Group Checkin Plan %}
+Attend a meeting slot *with your whole group* (slots will overlap class but also extend beyond class hours)
+
+## Thursday 11/23 and Friday 11/24: HOLIDAY
+{: .holiday}
+{% enddetails %}
{: .week}
+# Week 10 (11/27--12/1): Intersectionality & XR/AR
-{: .homework} [Final Project Proposal](assignments/project-proposals.html) Assigned: Prepare your final project proposal (individual)
-:
+{% details Learning Goals & Plan %}
-# Week 8 (11/13-11/17): Chronic Illness & Sustainability
-{% details Learning Goals %}
-- How to assess whether a technology is accessible; and whether an accessibility technology is useful and usable, in an inclusive fashion.
-- How do you make sure your *product is accessible* to people with disabilities
- 1. Data Equity and implicit bias
- 2. Beyond automated assessment: Accessible Summative Studies
- 3. Importance of Intersectionality
-- How do you make sure your *accessibility technology is valued* by people with disabilities
- - What are potential data sources for assessing value
- - Collaboration Versus Paternalism
- - Overly narrow views of disability: Multiple disabled people & multiply disabled people
-{% enddetails %}
+## Learning Goals
+- Intersectionality
+ - Exposure to research
+ - Example of what intersectional work might look like
+ - Discussion of intersections of LGBTQIA+ and disability
+- Accessible Data Visualizations
+ - What are the commonly-used techniques to make data visualizations accessible?
+ - What are the pros and cons of these techniques?
+ - What are some of the nuances in making data visualizations accessible?
+## Schedule
-{% details Monday 11/13: Group Formation %}
+**Monday** Guest lecture by [Kirk Crawford](https://kirkcrawford.notion.site/kirkcrawford/Kirk-s-Research-Hub-3c69cc0c43944a76b1492dc80fc64a58): Complex Dynamics: What LGBTQIA+ Community Centers Reveal About Disability and Assistive Tech
-In class exercise to form final project groups
+**Wednesday** AR/VR & Accessibility
+
+**Thursday** (lab) && **Friday** Project Group Checkins (Full group attendance Required, details TBD)
{: .homework} Required Reading and Reflection (for Wednesday)
:
-- **Required: Respond to the Reading Questions and Preparation Requirements on Ed**. There is only one Ed post you need to make this week in response to either or both assigned readings. [Please post your response in this Ed thread]({site.discussion}/2649283)
- - [Difficulty Vs Accessibility](https://www.youtube.com/watch?v=sPehhHZvKE8&list=PLVEo4bPIUOskja9pfpqceY8qDrykFdubf&index=18)
- - [My Disability Is Dynamic](https://medium.com/age-of-awareness/my-disability-is-dynamic-bc2a619fcc1)
-- **If you want to dig deeper**
- - [Considerations for HCI accessibility practices with chronically ill people](https://dl.acm.org/doi/abs/10.1145/3517428.3544803)
-{% enddetails %}
+Watch the following ASSETS 2023 videos and answer questions on Ed.
-{% details Wednesday 11/15: Chronic Illness and Accessibility %}
+<iframe width="560" height="315" src="https://www.youtube.com/embed/cZEJBhmq8Jw?si=s0qjRoodI2-Emy0k" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
-**Slides** TBD
+<iframe width="560" height="315" src="https://www.youtube.com/embed/PuXECFp1m-c?si=BOuCmT38T9d3h3tU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
-{: .homework} [Group Project Checkpoint](assignments/project-checkpoint.html) Assigned: Group Project Checkpoint
-:
+<iframe width="560" height="315" src="https://www.youtube.com/embed/qRMYjdSTnZs?si=HGRM6XIEwSiWbtqI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
-{: .homework} [Final Project Handin](assignments/project-final.html)
-:
+**Optional** (we watched this during the ASSETS watch party)
-{% enddetails %}
-
-{% details Thursday: Section %}
-Work in groups on final projects
+<iframe width="560" height="315" src="https://www.youtube.com/embed/zI2A477vhCs?si=iRfAr1PJzVLdW6C0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+
+[VR ALT Text](https://www.alexandria.unisg.ch/269289/1/camera_readyCHI23_Workshop_Alt_Text_2_0.pdf)
{% enddetails %}
-{% details Friday 11/17: Sustainability %}
+{: .week}
+# Week 11 (12/4--12/8): Innovation & Visualization
+{% details Learning Goals & Plan %}
-**Slides** {% include slide.html title="Sustainability" loc="sustainability.html" %}
+## Learning Goals
+- Disability Innovation
+ - Examples of disability innovation
+ - How disability innovation drives other forms of innovation
+- remainder: Still TBD
-{% enddetails %}
+## Schedule
-{: .week}
-# Week 9 (11/20-11/24): Group Checkpoints (Full Group Required)
+{: .homework} Posters are due before you go to sleep Thursday.
+: No readings
-Sign up for a meeting slot *with your whole group* (details to be announced; slots will overlap class but also extend beyond class hours)
+**Monday** possible guest lecture from Richard Ladner
-## Thursday 11/23 and Friday 11/24: HOLIDAY
-{: .holiday}
-{: .week}
-# Week 10 (12/4--12/8): 1:1 Project Meetings / TBD
-{% details Learning Goals: STILL TBD %}
-TBD
-{% enddetails %}
+{: .homework} Required Reading and Reflection (for Wednesday)
+:
+- **Required: Respond to the Reading Questions and Preparation Requirements.**
+ - [Read the chartability workbook](https://chartability.github.io/POUR-CAF/)
+ 1. Read the content until the beginning of the heading "the tests".
+ 2. Find a data visualization on the internet (e.g. COVID visualisations or climate change statistics) or in an app (e.g. your phone’s stock app, other health tracking apps).
+ - Find one violation of the chart-ability guidelines and explain it in your response [here](https://edstem.org/us/courses/41400/discussion/3967944)
+ - If you found an accessible visualisation, great! Tell us what makes it accessible.
+- **If you want to go deeper**
+ - [Understanding Screen-Reader Users’ Experiences with Online Data Visualizations](https://athersharif.me/documents/assets-2021-understanding-sru-experiences-online-data-viz.pdf) [**Respond**](TBD)
+ - [Data Representation in Accessibility Data Sets: A Meta-analysis](https://arxiv.org/abs/2207.08037) [**Respond**](TBD)
+ - [Rich Screen Reader Experiences for Accessible Data Visualization](https://arxiv.org/pdf/2205.04917.pdf)
+ - [VoxLens: Making Online Data Visualizations Accessible With an Interactive JavaScript Plug-In](https://athersharif.me/documents/chi-2022-voxlens.pdf)
+
+**Wednesday** [Accessible Visualization](https://docs.google.com/presentation/d/1-3e-OUBWyrbC4nZYcvyOIecoKilULVPI/edit?usp=sharing&ouid=104436138497356311568&rtpof=true&sd=true)
+**Thursday** Finalize your posters.
+
+**Friday** AMA/TBD
-{% details Monday: Richard Ladner guest lecture %}
{% enddetails %}
{: .week}
@@ -452,9 +456,8 @@ TBD
{: .lecture} Final project presentations
:
-
-
-# Unused Reading and Ideas
+{: .week}
+{% details Unused Reading and Ideas %}
{% details some additional readings and slides to possibly use %}
- Physical computing slides
- [Crippin' Jim Crow](https://drive.google.com/file/d/1QaRu4T3aax6jg73quHKgpfwJe3nQ4PEv/view?usp=share_link)
@@ -466,22 +469,32 @@ TBD
- [Disability Studies as a source of critical inquiry...](https://make4all.org/wp-content/uploads/2019/10/MankoffAssets2010.pdf)
- [Vital coronavirus is failing the blind and visually impaired](https://www.vice.com/en/article/4ag9wb/vital-coronavirus-information-is-failing-the-blind-and-visually-impaired)
- [Blurring the Boundaries Between Assistive Tech and Companionship](https://www.forbes.com/sites/gusalexiou/2021/01/26/amazon-alexa---blurring-the-boundaries-between-assistive-tech-and-companionship/?sh=2821499375e7) (a little too salesy)
+ - [The Future of Urban Accessibility for People with Disabilities: Data Collection, Analytic, Policy, and Tools](https://dl.acm.org/doi/fullHtml/10.1145/3517428.3550402)
+ - [My Disability Is Dynamic](https://medium.com/age-of-awareness/my-disability-is-dynamic-bc2a619fcc1)
+ - [Considerations for HCI accessibility practices with chronically ill people](https://dl.acm.org/doi/abs/10.1145/3517428.3544803)
+ - [Areas of Strategic Visibility: Disability Bias in Biometrics](https://arxiv.org/abs/2208.04712) - [Explaining Explanations: An Approach to Evaluating Interpretability of Machine Learning](https://www.cs.purdue.edu/homes/bb/nit/Lalana-Explainations%20of%20IAS.pdf)
+ - [A systematic literature review of handheld augmented reality solutions for people with disabilities](https://www.mdpi.com/1424-8220/22/20/7719)
+ - [The Future of Urban Accessibility for People with Disabilities: Data Collection, Analytic, Policy, and Tools](https://dl.acm.org/doi/fullHtml/10.1145/3517428.3550402)
+- Batt (2019). How Android Accessibility Services Can Be Used to Hack Your Phone. Available at: https://www.makeuseof.com/tag/android-accessibility-services-can-used-hack-phone/ Accessed in August 1, 2023.
+- Andrew, S., Watson, S., Oh, T., & Tigwell, G. W. (2020). A Review of Literature on Accessibility and Authentication Techniques. The 22nd International ACM SIGACCESS Conference on Computers and Accessibility, 1–4. https://doi.org/10.1145/3373625.3418005
+- Vivian Motti (2023). Accessible Security and Privacy. Open Access. (In preparation).
{% enddetails %}
{% details slides not in use %}
-**Slides** {% include slide.html title="Assessing Accessibility" loc="physical-computing.html" %}
+**Slides** {% include slide.html title="Physical Computing" loc="physical-computing.html" %}
{% enddetails %}
-
{% details topics not covered %}
+- AR/VR
- Video conferencing
- Large gatherings (virtual or hybrid)
- Online text based support groups
- Social networks such as twitter or facebook
-- Crowdsourcing )
+- Crowdsourcing
+- Chronic Illness
{% enddetails %}
+{% enddetails %}
-{% enddetails %}
diff --git a/slides/3dprinting.html b/slides/3dprinting.html
index 07ddfcf5c3d3d31e2d5efb59b3596ed46fade8fa..42503f47b23f6d80515c33944a15b0739a35f137 100644
--- a/slides/3dprinting.html
+++ b/slides/3dprinting.html
@@ -25,6 +25,14 @@ class:
## Make sure zoom is running and recording!!!
## Make sure captioning is turned on
+---
+exclude: true
+
+# Exclude after planning is done
+
+- Bring scissors
+- Have a demo of building something from flat to 3D ready to show (including the wood with the punched out pieces so they understand how to layout SVGs in Tinkercad)
+
---
layout:false
@@ -129,7 +137,6 @@ dating back to the 1890s, it's the work of a German seamstress who had been cons
---
# Modern crafting technology
-<BR>
.left-column50[
- New ways to ideate and create
- Faster, easier, sometimes better
@@ -186,7 +193,7 @@ Combination of materials
Try to think of some everyday objects that could be made more accessible (customized through DIY making)
-Post on [Ed]({{site.discussion}}/3750264)
+Pair & share; Post on [Ed](https://edstem.org/us/courses/56844/discussion/4829724)
---
[//]: # (Outline Slide)
@@ -282,27 +289,6 @@ Domain Experts
--
This is a focus of a lot of my group's work
----
-# Announcements (1/2)
-
-- Reminder: This is fabrication week, please come to class prepared to make things :)
-- This is also the start of "Module 2", post-GUI accessibility. Please fill out our end-of-module survey to give feedback on module 1 (we will post it on Ed this week)
-- Was everyone able to find their comments in the gradebook?
-- Office hours at 3:30 on Tuesday; online at 11:30 on Wednesday instead of in person
-- Section is in **.red[CSE022]**
-
----
-# Announcements (2/2)
-
-- Reminder: accessibility goes both ways in this class.
- - You can expect it of us (and correct us if we make a mistake)
- - We also expect it of you (it is a requirement for us to assess you)
-
-- Things that we expect you to do going forward in order to assess you on *other* competencies and give you full credit for participation
- - alt text for images
- - accessible documents
- - accessible presentations
-
---
# Traditional Manufacturing
@@ -411,19 +397,13 @@ class E green
</div>
---
-# Additive Vs Subtractive (e.g. CNC) Printing
+# Additive Vs Subtractive
-.left-column50[
- Additive printing puts down material, building up the object layer by layer
- Some are done with extruded plastic or other material
- Others are done with powders that are sealed together (powder printers)
- Subtractive removes materials from around the object
-]
-.right-column50[
-
-
-]
---
# Example: CNC Spoon
@@ -677,7 +657,7 @@ Probably made with [boxes.py](https://www.instructables.com/Lasercut-Little-Wood
- Now it's time to think about what you might want to make
- Talk to your neighbor
-- Post on [Ed]({{site.discussion}}/3750270)!
+ - Post on [Ed]({{site.discussion}}/4829755)!
---
@@ -704,262 +684,8 @@ Probably made with [boxes.py](https://www.instructables.com/Lasercut-Little-Wood
]
---
-# The End!
-
----
-
----
-# old slides...
-
----
-# Printing to enhance a mobile phone
-
-.right-column60[
-[Etch a Sketch!](https://www.thingiverse.com/thing:3251892)
-
-![:youtube Mobile phone case to use the phone like an etch a sketch, dcaErURbyIA]
-]
-
---
-count: false
-.left-column40[
-New ways of interacting!
-- Works by combining conductive plastic with custom interactor
-- Looks like touch input to the software
-- Gears control motion options mechanically
-]
----
-# Mechanically to enhance a mobile phone
-
-.right-column60[
-[Phone trigger buttons](https://www.thingiverse.com/thing:2960274)
-![:youtube Game playing hardware --trigger buttons--,X_C1Qxjg2WI]
-]
-.left-column40[
-New ways of interacting!
-- Similar approach, also conductive
-]
-
----
-# Printing to enhance a mobile phone
-.right-column60[
-
-Acoustruments
-![:youtube Printed objects whose use can be sensed, C2d1pB1qlvA]
-]
-
-.left-column40[
-New ways of interacting!
-- Leverages the phone's microphone
-- Uses flexible plastic with holes
-- Requires machine learning
-]
-
----
-# Use your phone to control general hardware
-
-.left-column40[
-[IOIO](https://learn.sparkfun.com/tutorials/ioio-otg-hookup-guide) /
-[IOIO wiki](https://github.com/ytai/ioio/wiki)
-
-[[Arduino](https://www.arduino.cc/)
-]
-
-.right-column60[
-
-]
-
----
-# Printing to enhance a mobile phone
-
-.right-column50[
-[Phone for potentiostatic
-control](https://ieeexplore.ieee.org/abstract/document/6916991)
-
-
- ]
-.left-column50[
-New ways of interacting
-
-Phone as embedded computer
-
-New ways of sensing
-- exploits ability to play sounds
-- serves basic functions of a potentiostat in controlling an applied
- potential to oxidise ECL-active molecules
-- resultant photonic signal is monitored using the camera in video
- mode.
-- combined with paper microfluidic sensors
-
-]
-???
-
-The audio jack supplies the potential to the paper microfluidic
-sensor, while the resultant emission is detected by the camera in
-video mode. Both the excitation and detection processes are controlled
-by a software application which can also transmit the results via
-e-mail. The black plastic sleeve surrounding the top of the phone
-holds the sensor adjacent to the camera and blocks ambient light.
-
----
-# Moon House Video
-
-![:youtube Video of a robot 3d printing a round house, 8zt_3Gs1ksg]
-
----
-# Prepare for Printing
-
-- Create a model using any one of a number of 3D modeling packages such as Sketchup, Open SCAD,
-Rhino 3d, Meshmixer, Blender, OnShape, Minecraft, SolidWorks
- - Some packages represent 3D objects as solids, others as shells and boundaries.
-- Or you can find lots of stuff in repositories, like [Thingiverse](http://www.thingiverse.com/)
-
-
-.left-column50[
-__Solids__ (image from [Wikipedia](https://en.wikipedia.org/wiki/Constructive_solid_geometry ))
-
-
-]
-
-.right-column50[
-__Shells/Boundaries__
-
-
-
-]
-
----
-# Example: .stl File (Additive)
-
-Almost every software package can save the files as a `.stl` file (stereolithography)
-
-.left-column50[
-
-
-
-
-]
-.right-column50[
-```
-solid OBJECT
- facet normal 0 -1 0
- outer loop
- vertex 10 -10 0
- vertex 0 -10 10
- vertex 0 -10 0
- endloop
- endfacet
- facet normal 0 -1 0
- outer loop
- vertex 0 -10 10
- vertex 10 -10 20
- vertex 8 -10 20
- endloop
- endfacet
-```
-]
-
----
-# Printer Controller
-
-The printer controller converts the `.stl` file into GCode, commands read by the printer
-
-
-.left-column50[
-```
-solid OBJECT
- facet normal 0 -1 0
- outer loop
- vertex 10 -10 0
- vertex 0 -10 10
- vertex 0 -10 0
- endloop
- endfacet
- facet normal 0 -1 0
- outer loop
- vertex 0 -10 10
- vertex 10 -10 20
- vertex 8 -10 20
- endloop
- endfacet
-```
-]
-
---
-.right-column50[
-
-
-
-]
----
-# Printer Controller
-
-The printer controller converts the `.stl` file into GCode, commands read by the printer
-
-
-.left-column50[
-```
-solid OBJECT
- facet normal 0 -1 0
- outer loop
- vertex 10 -10 0
- vertex 0 -10 10
- vertex 0 -10 0
- endloop
- endfacet
- facet normal 0 -1 0
- outer loop
- vertex 0 -10 10
- vertex 10 -10 20
- vertex 8 -10 20
- endloop
- endfacet
-```
-]
-
-.right-column50[
-```
-G1 X-5.87 Y-12.69 Z0.47 F3360.0
-G1 F1200.0
-G1 E1.0
-G1 F3360.0
-M101
-G1 X-5.87 Y12.69 Z0.47 F381.198 E5.799
-G1 X-2.93 Y12.69 Z0.47 F381.198 E6.354
-G1 X-2.93 Y-12.69 Z0.47 F381.198 E11.152
-G1 X0.0 Y-12.69 Z0.47 F381.198 E11.707
-G1 X0.0 Y12.69 Z0.47 F381.198 E16.506
-G1 X2.93 Y12.69 Z0.47 F381.198 E17.06
-G1 X2.93 Y-12.69 Z0.47 F381.198 E21.859
-G1 X5.87 Y-12.69 Z0.47 F381.198 E22.414
-G1 X5.87 Y12.69 Z0.47 F381.198 E27.213
-G1 X8.8 Y12.69 Z0.47 F381.198 E27.768
-```
-]
-
----
-# Results
-
-
-
----
-# What not to print
-
-- Food handling articles (unless on a special printer)
-- Safety critical strong things
-- High heat tolerance things
-- Things for chemically harsh environments
+# Extra stuff after thise
+[if interested -- not for today]
---
# Other Materials
diff --git a/slides/accessibility-activities.html b/slides/accessibility-activities.html
deleted file mode 100644
index 5ec3aac62d529d2ddef4e3085ad85cfce4631fb5..0000000000000000000000000000000000000000
--- a/slides/accessibility-activities.html
+++ /dev/null
@@ -1,366 +0,0 @@
----
-layout: presentation
-title: Accessibility Activities --Week 1--
-description: In Class Activities relating to Understanding Accessibility and Disability
-class: middle, center, inverse
----
-background-image: url(img/people.png)
-
-.left-column50[
-# Week 1: Accessibility: In Class Activities
-
-
-{{site.classnum}}, {{site.quarter}}
-]
----
-name: normal
-layout: true
-class:
-
----
-# Important Reminder
-
-## This is an important reminder
-## Make sure zoom is running and recording!!!
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- What is Accessibility? Disability? Models of disability?
-- History of disability rights
-- **Understand terms about and models for disability-centered design**
-- What is Disability Justice
-
----
-# Some terms used in Accessibility
-
-.left-column50[
-Accommodation
-- Co-producing access for all participants in a space or event
-- Legally mandated, but also so much more
-
-]
-.right-column50[
-An important goal of this class is to put the things that we are learning in lecture directly into practice. We will start with the concept of accommodation, co-producing access for all participants in a space or event
-]
-
-
----
-<iframe src="https://embed.polleverywhere.com/discourses/MzMr3m6Fga0F0eCrzSgDv?controls=none&short_poll=true" width="800px" height="600px"></iframe>
-
----
-# How would you implement this in a work setting?
-
-Small group discussion; Summarize your discussion on [Ed]({{site.discussion}}2347303)
-
----
-# Some terms used in Accessibility
-
-.left-column50[
-Accommodation
-- Co-producing access for all participants in a space or event
-- Legally mandated, but also so much more
-
-Universal Design (why is this problematic?)
-- One design works for everybody
-- Typical example: curb cuts
-]
---
-.right-column50[
-Ability-Based Design - Jacob Wobbrock
-- Technology that adapts to the abilities of the user in their current context
-]
-
---
-.right-column50[
-Disability Rights Based Design
-- Design informed by disability studies
-]
-
----
-# Centering Disability Rights in Design
-
-The **central philosophy** in this class
-
-.left-column50[
-Design Process principles
-- Making space for disabled voices
-- Not wasting disabled time
-- Informed by [Disability Justice](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf) and [Disability Theory](https://dl.acm.org/doi/10.1145/3373625.3416996)
-]
-.right-column50[
-Design outcome principles
-- Centering Agency and Control; Interdependence and Independence
-- Addressing intersectionality within disability (multiply disabled people & multiple disabled people)
-- Addressing intersectionality with other identities
-- No segregation
-]
-
-???
-Finding first person accounts
-Considering things like disclosure and invisibility
-We'll talk about this in various ways a lot in the next month
-
----
-background-image: url(img/accessibility/old-phones.jpg)
-
-.left-column[
-## .white[Case Study: The iPhone]
-
-.white[
-MacWorld Keynote '07
-]]
-
-???
-Originally neither universal design nor ability-based design
-
-
----
-background-image: url(img/accessibility/jobs-iphone.jpg)
-
-.bottom[
-.white[The phone Jobs is holding is small, flat, and without any tangible information accessible to a blind person]
-]
-
-???
-Originally neither universal design nor ability-based design
-
----
-.left-column[
-## Sliderule:
-
-The first mobile screen reader]
-
-.right-column[
-
-]
----
-## Sliderule:
-
-The first mobile screen reader
-
-![:youtube Sliderule Video, 496IAx6_xys]
-
----
-# Translation to iPhone
-
-.column[
-.centerh[
-
-]
-]
-
-.column[
-.centerh[
-
-]
-]
-
-.column[
-.centerh[
-
-]
-]
-
----
-background-image: url(img/accessibility/iphone-now.png)
-
-# Accessibility in the iPhone
-
-
-.left-column60[
-Many pages of accessibility settings
-- VoiceOver – reads what is on screen
-- Speech recognition for controlling device
-- Zoom – screen magnifier – 3 finger tap
-- Closed captions on videos
-- AssistiveTouch – so don’t need multiple fingers, don’t need to press Home
-button, etc.
-- Switch Control (IOS7 and later):
- - Optional connection to external switch or [head movement with built in camera](https://www.youtube.com/watch?v=RXF2ThtYXzM)
-]
-
----
-# Analyzing the iPhone from an disability rights perspective
-
-- Does it center agency and control?
-- Does it consider disclosure and visibility handled?
-- Does it account for multiple disabled people & multiply disabled people?
-- Does it address intersections with other identities?
-- Does it segregate disabled people
-
-Small group discussion; Summarize your discussion on [Ed]({{site.discussion}}2342976)
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- What is Accessibility? Disability? Models of disability?
-- History of disability rights
-- Understand terms about and models for disability-centered design
-- **What is Disability Justice**
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY(*) "we are many things, and they all impact us."
-
-
-[Sins Invalid](https://www.sinsinvalid.org/) disability based performance project defines [10 principles of disability justice](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf) which are:
-
-
-(*) Feminist theorist Kimberlé Crenshaw coined intersectionality in
-1989 to describe the experiences of Black women, who experience both
-racism and sexism.
-
-???
-“We do not live single issue lives†–Audre Lorde.
-
-Ableism, coupled with white supremacy, supported by capitalism, underscored by heteropatriarchy, has rendered the vast majority of the world “invalid.â€
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY "we are many things, and they all impact us."
-2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
-
-???
-“We are led by those who most know these systems.†–Aurora Levins Morales
-
-lifting up, listening to, reading, following, and highlighting the perspectives of those who are most impacted by the systems we fight against."
-by centering the
-
-leadership of those most impacted, we keep ourselves grounded in real-world
-problems and find creative strategies for resistance. "
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY "we are many things, and they all impact us."
-2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
-3. ANTI-CAPITALIST POLITICS "we resist conforming to 'normative' levels
-of productivity in a capitalist culture"
-
-???
-In an economy that sees land and humans as components of profit, we are anti-capitalist by the nature of having non-conforming body/minds.
-
-Capitalism depends on wealth accumulation for some (the white ruling class), at the expense of others... Our worth is not dependent on what and how much we can produce.
-
----
-# Disability Justice Principles
-
-4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
-
-???
-disability justice lends itself to politics of alliance.
-
-Align with racial justice, reproductive justice, queer and trans liberation, prison abolition, environmental justice, anti-police terror, Deaf activism, fat liberation, and more... challenging white disability communities around racism and challenging other movements to confront ableism.
-
---
-5) RECOGNIZING WHOLENESS "Disabled people are whole people."
-
-???
-People have inherent worth outside of commodity relations and capitalist notions of productivity. Each person is full of history and life experience.
-
-Each person is full of history and life experience. Each person has an internal
-experience composed of our own thoughts, sensations, emotions, sexual fantasies,
-perceptions, and quirks.
-
---
-6) SUSTAINABILITY "pace ourselves, individually and collectively"
-
-???
-We pace ourselves, individually and collectively, to be sustained long term. Our embodied experiences guide us toward ongoing justice and liberation.
-
-to be sustained long-term, value the teachings of our bodies and experiences, and use them as a critical guide and reference point to help us move away from urgency and into a deep, slow, transformative, unstoppable wave of justice and liberation.
-
-
---
-7) COMMITMENT TO CROSS-DISABILITY SOLIDARITY "isolation undermines collective liberation"
-
-???
-even and especially those who are most often left out of political conversations. Break down the isolation between people with physical
-impairments, people who are sick or chronically ill, psych survivors and people
-with mental health disabilities, neurodiverse people, people with intellectual or
-developmental disabilities, Deaf people, Blind people, people with environmental
-injuries and chemical sensitivities, and all others who experience ableism and
-isolation that undermines our collective liberation.
-
----
-# Disability Justice Principles
-
-8) INTERDEPENDENCE "We work to meet each other's needs" rather than depending on state solutions
-
-???
- the liberation of all living systems and the land as integral to the liberation of our own communities, as we all share one planet. We work to meet each other’s needs as we build toward liberation, knowing that state solutions inevitably extend into further control over lives.
-
---
-9) COLLECTIVE ACCESS "We can share responsibility for our access needs ... balance autonomy while being in community"
-
-???
-AS brown, black and queer-bodied disabled people we bring flexibility and creative nuance that go beyond able-bodied/minded normativity, to be in community with each other.
-
-... Access needs aren’t shameful — we all function differently depending on context and environment. Access needs can be articulated and met privately, through a collective, or in community, depending upon an individual’s needs, desires, and the capacity of the group. We can share responsibility for our access needs, we can ask that our needs be met without compromising our integrity, we can balance autonomy while being in community, we can be unafraid of our vulnerabilities, knowing our strengths are respected.
-
---
-10) COLLECTIVE LIBERATION No body or mind can be left behind – only moving together can we accomplish the revolution we require.
-
-???
-We move together as people with mixed abilities, multiracial, multi-gendered, mixed class, across the sexual spectrum, with a vision that leaves no bodymind behind.
-
----
-Case study: One-way Masking
-
-Disability Perspective [FastCompany Article](https://www.fastcompany.com/90790893/im-a-chronically-ill-student-and-one-way-masking-isnt-enough)
-
-.quote[I challenge people who are not at high risk for COVID-19 complications to think about what it must be like trying to attend university (or go into work every day) while also trying to avoid getting COVID-19.]
-
-.quote[Why wouldn’t people wear a mask to protect “vulnerable†members of our community, who are statistically part of every college campus? Why is it always the disabled or chronically ill student or professor who has to ask people to wear masks? Why can’t people just show solidarity? I ask myself these questions daily.]
-
-- A chronically ill Berkeley student
-
----
-# Case study: One-way Masking
-
-.quote[We know masks are effective in laboratory studies, and we know they are effective as part of personal protective equipment for health care workers. But that effect appears diminished in community usage. ]
-
-.left-column50[
-- [Masks hide facial expressions & exacerbate racial bias](https://theconversation.com/face-masks-hide-our-facial-expressions-and-can-exacerbate-racial-bias-155250)
-- Masks make lipreading harder
-- Individual risk of severe COVID is [lower for vaccinated people with no risk factors](https://www.cdc.gov/coronavirus/2019-ncov/vaccines/vaccine-benefits.html#:~:text=COVID%2D19%20vaccination%20helps%20protect,associated%20with%20COVID%2D19%20infection.)
-- Political [resistance](https://theconversation.com/mask-wearing-wasnt-disputed-in-previous-crises-so-why-is-it-so-hotly-contested-today-171536) and [beliefs](https://theconversation.com/face-masks-cut-disease-spread-in-the-lab-but-have-less-impact-in-the-community-we-need-to-know-why-147912)
-- Questions about the [science of masking](https://theconversation.com/face-masks-cut-disease-spread-in-the-lab-but-have-less-impact-in-the-community-we-need-to-know-why-147912)
-]
-.right-column50[
-
-]
-
----
-# Your goal: Analyze 1-way masking from a Disability Justice Perspective: [Ed Post](https://edstem.org/us/courses/31170/discussion/2345037)
-
-.left-column50[
-1) Intersectionality
-
-2) Leadership of those most impacted
-
-3) Anti-capitalist politics
-
-4) Cross-movement solidarity
-
-5) Recognize wholeness]
-.right-column50[
-6) Sustainability
-
-7) Commitment to cross-disability solidarity
-
-8) Interdependence
-
-9) Collective access
-
-10) Collective liberation
-]
-
-???
-Break into small groups and discuss
-
diff --git a/slides/accessibility.html b/slides/accessibility.html
deleted file mode 100644
index d468940a7f2f7e6385698a7481c6a6d9f4ae2805..0000000000000000000000000000000000000000
--- a/slides/accessibility.html
+++ /dev/null
@@ -1,425 +0,0 @@
----
-layout: presentation
-title: Accessibility --Week 1, Monday--
-description: Accessibility
-class: middle, center, inverse
----
-background-image: url(img/people.png)
-
-.left-column50[
-# Week 1: Accessibility
-
-{{site.classnum}}, {{site.quarter}}
-]
-
----
-name: normal
-layout: true
-class:
-
----
-# Important Reminder
-
-## This is an important reminder
-## Make sure zoom is running and recording!!!
-## Make sure captioning is turned on
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- **Introduction to First Assignment: [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)**
-- What is Accessibility?
-- Example of Accessibility Technologies
-
----
-
-# First Assignment: [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
-
-.left-column50[
-- Find one computer access technology
-
-- Find one about "the world"
-
-- Find a description of it *by a disabled person who uses it* (first-person experience)
-
-]
---
-.right-column50[
-- Try not to pick the same things as your classmates
-- Should include a *first person video*
-- Should try at least one out yourself
-- At least one should involve computers
-- No disability dongles!
-- Nothing too common (like glasses)
-]
-
----
-# Example 1: AAC (who uses AAC?)
-
-.left-column60[
-
-![:youtube A first person account of how Kit Autie uses AAC to communicate with a few different types of AAC, Tp6YqFz-Ylo]
-]
-
-.right-column40[
-Shows the variety of options available over specific strengths
-
-Kit Autie also [describes why they use AAC and ableist reactions they get when using it](https://www.youtube.com/watch?v=z3YQ9F4SFAQ)
-]
-Limitations: "*Languaging*" is a multi-person activity in which people can co-create access (or create ableism around access)
-
-Costs have come way down!! (free with in-app purchases)
-
----
-# Not a first person account (1)
-
-![:youtube A mom describes how she is teaching her child to communicate using AAC at mealtimes, 9FzbX1z-JAM]
-
-Why is this not a first person account?
-- The person using the AAC never addresses the audience
-- The person using the AAC never comments on the experience of using it
-
-
----
-# Not a first person account (2)
-![:youtube An advertisement for the Tobii Dynavox, tYgMfL-CnGo]
-
-Why is this not a first person account?
-- It is highly scripted
-- It doesn't really review the device at hand
-
----
-# Example 2: Audible Crosswalks
-
-.left-column60[
-![:youtube A first person account of reasons and factors using audible crosswalks, xPlsYhU1HBU?si=jiklQmTbCUQHRcNI&start=126]
-]
-
-.right-column40[
-City-produced video with first person account (see 2:10)
-- “They provide an equal access to informationâ€
-- “It gives me so much peace of mindâ€
-- “It makes me feel saferâ€
-
-]
-Limitations: Not universally available; Does not support DeafBlind
-
-Designed for people with visual impairments to cross the street
-
----
-# Competencies for [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
-
-- Accessible presentation creation
-- Finding first person accounts by and for people with disabilities
-- Presenting accessibly to an audience with mixed disabilities
-- Familiarity with a range of accessibility technologies (requires being present and engaged with student presentations)
-- Your participation grade, as a percentage of completeness (are all the required parts present)
-
----
-
-# Handin requirements (due Tuesday)
-.left-column40[
-Handin:
-- One accessible slide per AT (see [Ed]({{site.discussion}}/3515497) for slide deck)
-- Present one of them next week (accessibly) in 3-4 minutes
-]
-.right-column60[
-Slide includes:
-- A summary of the AT you researched
-- Information about its audience
-- A picture of the AT
-- A link to the first person account you found
-- Something you learned from the video and/or by trying it about its strengths and weaknesses
-
-]
-
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- Introduction to First Assignment: [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
-- **What is Accessibility?**
-- Example of Accessibility Technologies
-
----
-# Accessibility
-
-.row[
-.column[**Disability** is a mismatched interaction between someone and their context]
-.column[**Accessibility** is a broad term for tools that help people navigate mismatched interactions and provides options for people of all ability]
-.column[**Inclusive design** is a framework that helps us design more accessible products]
-]
-.row[
-
-]
-
----
-.left-column50[
-# Accessibility technology
-
-.quote[[anything] ... used to increase, maintain, or improve functional capabilities of individuals with disabilities] (Wikipedia)
-
-What model is this arguing for? [talk to your neighbor & [Vote](https://PollEv.com/multiple_choice_polls/dRULOhUivOZgMtAFQeMeP/respond)]
-]
-.right-column50[
-
-
-]
-
----
-# Accessibility technology: Voting Results
-
-<iframe src="https://embed.polleverywhere.com/multiple_choice_polls/8Fwfv8OtM0rAybOFFiMEE?controls=none&short_poll=true" width="800px" height="600px"></iframe>
-
----
-.left-column50[
-# Accessibility technology
-How people with disabilities *may* navigate computers (and the world)
-
-Used to be called "assistive technology" but that language is ableist
-
-One solution, not parallel solutions
-]
-
-???
-
-Not a *medical* device
-
-A broader view than Wikipedia
-
---
-
-.right-column50[
-.left-column[
-]
-.right-column90[
-.font-medium[Screen Readers] <BR>
-.font-mediumsmall[Narrator, VoiceOver, JAWS, Window Eyes, NVDA, TalkBack]
-
-.font-medium[Screen adjustment]<BR>
-.font-mediumsmall[ZoomText, Magnifier, Zoom, High Contrast<BR>]
-
-.font-medium[Speech input]<BR>
-.font-mediumsmall[Dragon Naturally Speaking, Dictation, Speech Recognition]
-
-.font-medium[Keyboarding]<BR>
-.font-mediumsmall[Sticky Keys, Mouse Keys, Filter Keys, Keyboard Shortcuts]
-
-.font-medium[Many more]<BR>
-]
-]
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- Introduction to First Assignment: [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
-- What is Accessibility?
-- **Example of Accessibility Technologies**
-
----
-# Lots of software for this
-
-.left-column50[
-- Magnifier – make whole screen or a portion bigger
- - Can also just use larger fonts, lower resolution
- - Change colors and contrast
-- Free Screen Reader – read the words on the screen
-- On-Screen keyboard
- - Can be scanned
-- Built-in speech recognition
-]
-.right-column50[
-Most Operating Systems (laptops and smartphones) have a whole collection of adaptations
-
-]
-
-???
-lots of software for this
-
-Adaptations for mouse
-- Make mouse easier to see
-- Move mouse with the keyboard
-
-Adaptations for keyboard
-- Sticky Keys – so no need for chords
-- Work like on Smartphones
----
-# Example: Single Switch Access
-
-.left-column50[
-Can point to on-screen keyboards with various mechanisms, or use scanning keyboards
-- e.g. sip and puff to select
-
-On Screen Keyboard
-- Usually add auto-complete and *auto-predict* .footnote[Auto-predict: Predict next word based on previous words with no letters typed]
-
-
-]
-.right-column50[
-![:youtube Video of person using switch input to make a video using a drone,YoM0Gua3UO4]
-]
-
-???
-Other options: [youtube Video](https://www.youtube.com/watch?v=2BhHwk9qSvI&t=148s)
-
----
-# Lots of exciting advances still happening
-.left-column[
-- Vizwiz (Bigham)
-]
-.right-column[
-
-]
----
-# Lots of exciting advances happening
-.left-column[
-- Vizwiz
-- Thingiverse (Hurst)
-]
-.right-column[
-
-]
----
-# Lots of exciting advances happening
-.left-column[
-- Vizwiz
-- Thingiverse
-- Facade (Guo)
-]
-.right-column[
-
-]
-
----
-# Lots of exciting advances happening
-.left-column[
-- Vizwiz
-- Thingiverse
-- Facade
-- [Voice Assistants](https://voicebot.ai/2019/09/11/amazon-alexa-ad-shows-how-voice-assistants-help-visually-impaired-people/) (Findlater)
-]
-
----
-# Lots of exciting advances happening
-.left-column[
-- Vizwiz
-- Thingiverse
-- Facade
-- [Voice Assistants](https://voicebot.ai/2019/09/11/amazon-alexa-ad-shows-how-voice-assistants-help-visually-impaired-people/) (Findlater)
-- Generative AI ([ChatGPT can now hear, see and speak](https://openai.com/blog/chatgpt-can-now-see-hear-and-speak))
-]
-.right-column[
-
-
-]
-
----
-# Practical Basis for Accessibility
-
-.column[
-.centerh[
-
-]
-In 1808, Pellegrino Turri built the first typewriter, so that his blind lover, could write letters more legibly. ​
-]
-
-.column[
-.centerh[
-
-]
-Speech recognition, text to speech, and word-prediction technologies were all initially developed for people with disabilities.
-]
-.column[
-.centerh[
-
-]
-In 1937, Joseph Friedman created the first bendy straw to help his young daughter drink from a cup on a counter that was too high for her.
-]
-
----
-# Tropes & ways things can go wrong (1/3)
-
-.left-column50[
-Hero complex (I can save you with this new technology)
-]
-
----
-# Tropes & ways things can go wrong (2/3)
-
-.left-column50[
-Hero complex
-
-Disability Dongle
-]
-
----
-# Disability Dongle
-
-.quote[Disability Dongle: A well intended elegant, yet useless solution to a problem we never knew we had. Disability Dongles are most often conceived of and created in design schools and at IDEO.] [Liz Jackson](https://twitter.com/elizejackson/status/1110629818234818570)
-
-
----
-# Disability Dongle
-
-- Often speculative
-- Sometimes "they enact normative or curative harm upon disabled users"
-- Emphasize quick fix over structural change
-
-???
-explain the jargon
-
----
-# Who is Behind Disability Dongles?
-
-- Award bait
-- “Thank you for your feedback” and what it signals
-- Whose idea and whose credit
-
-???
-Thank you for your feedback is a signal that we have no control over how our knowledge will be used; by reframing disabled expertise and critique as “feedback,†this phrase, like IKEA’s ThisAbles campaign, relegates disabled people to the role of user and subordinates disabled knowledge to the (professional) designerly imagination. It’s a disingenuous phrase, in which “thank you†is uttered to remind us that it is actually us who should be grateful.
-
-
----
-# Tropes & ways things can go wrong (3/3)
-
-.left-column50[
-Hero complex
-
-Disability Dongle
-
-Disability inspiration [stop at 4:29]
-]
-
-.right-column50[![:youtube Ted Talk Stella Young is a comedian and journalist who happens to go about her day in a wheelchair — a fact that doesn't; she'd like to make clear; automatically turn her into a noble inspiration to all humanity. In this very funny talk; Young breaks down society's habit of turning disabled people into "inspiration porn.",8K9Gg164Bsw] ]
-
----
-# A note on language
-
-.left-column[
-
-
-
-]
-
-.right-column[
-Identity-first language (“disabled peopleâ€) vs. people-first (“people with disabilitiesâ€). Preferences change depending on region, cultural context, community
-
-Avoid “stricken withâ€, “suffers from†or victimization language
-
-Avoid “able-bodied†or “normal†as differentiating terms
-
-**You will offend people because this is ableist** (and lose points on your assignments)
-
-]
-
----
-# Watch and Analyze
-
-![:youtube At Apple; we believe accessibility is a human right. Innovative features like Door Detection; Sound Recognition; Voice Control; and more are designed to let you use your devices in ways that work best for you, KpBGZ5wSjOg]
-
-hero complex? disability inspiration? language issues? all good?
-
-Small group discussion; Summarize your discussion on [Ed]({{site.discussion}}2342965)
diff --git a/slides/accessible-data-viz.html b/slides/accessible-data-viz.html
deleted file mode 100644
index b97b0b644a39dd2afadccb11aa553fe136e54f09..0000000000000000000000000000000000000000
--- a/slides/accessible-data-viz.html
+++ /dev/null
@@ -1,317 +0,0 @@
----
-layout: presentation
-title: Accessible Data Visualizations --Week 6--
-description: Comparison of Assessment Approaches
-class: middle, center, inverse
----
-background-image: url(img/people.png)
-
-.left-column50[
-# Week 6: Accessible Data Visualizations
-
-{{site.classnum}}, {{site.quarter}}
-]
----
-name: normal
-layout: true
-class:
-
----
-# Important Reminder
-
-## This is an important reminder
-## Make sure zoom is running and recording!!!
-## Make sure captioning is turned on
-
-
----
-# Different Types of Images
-
-Explain how to do something other than images that is new to the students
-<iframe src="https://embed.polleverywhere.com/free_text_polls/AP4v3Tt0aTSduMm2p2V9L?controls=none&short_poll=true" width="800px" height="600px"></iframe>
-
----
-# COVID-19 Visualizations
-
-
-
----
-[//]: # (Outline Slide)
-
-# Some questions to consider about information access
-
-Who can access visualizations that other people have created?
-
-Who can create accessible information?
-
-How do we support the full data science lifecycle?
-
----
-# Who can Access Visualizations?
-
-Due to the inaccessibility of online data visualizations, screen-reader users answered questions **62%** less accurately and spent **211%** more time than non-screen-reader users *(Sharif, 2021)*.
-
-
-
----
-# How Can We Make These Visualization Accessible?
-
-- What strategies and techniques **do** you use to make these visualizations accessible to screen-reader users?
-
-- What strategies and techniques **could** you use to make these visualizations accessible to screen-reader users?
-
----
-# Commonly-Used Techniques
-
-Summary ("Alt-Text")
-
-Sonification (Audio Graphs)
-
-Tables
-
-Braille Prinouts/3-D Printing
-
----
-# Summary ("Alt-Text")
-
-Alt-text is an HTML attribute that can provide a summary of the visualization and the information it contains.
-
-**Benefits**
-- Most commonly-used strategy
-
-- Easy to integrate into web elements
-
----
-# Sonification (Audio Graphs)
-Sonification (or audio graphs) enable listeners to interpret data trends by mapping data to a musical scale.
-
-
-.left-column40[
-
-**Benefits**
-- Can help users to understand overall trends
-
-- Already integrated into commerical products (e.g., Apple)
-]
-.right-column60[
-![:youtube Video of a graph being sonified, gssjuSnMR60]
-]
-
----
-# Tables
-
-Tables are HTML elements that can be used to convey data to users.
-
-**Benefits**
-- Provide users access to raw data
-
-- Already integrated into Google Charts
-
----
-# Tactile Graphics/3-D Printing
-
-Tactile graphics and 3-D printed graphs are raised surfaces that enable blind and low vision individuals to interpret data by feeling the graphs.
-
-**Benefits**
-- Can assist users in developing a mental model of the visualization
-
-- Enables users to interact with the visualization without using a screen reader
-
----
-# Holistic vs. Drilled-Down Exploration
-
-Screen-reader users perform a holistic exploration first and then drill-down into the data *(Sharif, 2021)*.
-
-.left-column50[
-- Summary ("Alt-Text")
-- Sonification (Audio Graphs)
-- Tables
-- Braille Prinouts/3-D Printing
-]
-.right-column50[
-
-- Which of these techniques enable **holistic** exploration?
-- Which of these techniques enable **drilled-down** exploration?
-]
-
----
-# Supporting Interaction
-
-Highly relevant even when just *using* a visulazation
-- When interacting with static visualizations, sighted people intuitively construct complex visual queries [Ware, 2019].
-- Interactive charts afford selection, filtering & more [Yi, IEEE TOVCG, ’07]
-
-Supporting this requires going past verbal descriptions and tactile graphics
-
----
-# [VoxLens](https://github.com/athersharif/voxlens).
-
-[VoxLens](https://github.com/athersharif/voxlens) is an open-source JavaScript plug-in that improves the accessibility of online data visualizations for screen-reader users using a multi-modal approach, requiring only a single line of code for integration into online data visualizations.
-
-VoxLens offers three modes:
-
-- **Question-and-Answer mode**
-- **Summary mode**
-- **Sonification mode**
-
-.center[https://github.com/athersharif/voxlens]
-
----
-# VoxLens
-
-
-
----
-# Evaluation of VoxLens
-
-VoxLens improved the accuracy of screen-reader users by **122%** and interaction times of screen-reader users by **36%**.
-
-
-
----
-[//]: # (Outline Slide)
-
-# Some questions to consider about information access
-
-Who can access visualizations that other people have created?
-
-**Who can create accessible information?**
-
-How do we support the full data science lifecycle?
-
----
-# *Who* Can Creating Accessible Visualizations
-
-Can BLV people create new information
-- Are they included in the employment opportunities and learnings associated with data science?
-- Can they access information when someone didn’t already decide it needs to be accessible
- - Maps and other individualized needs
- - Live data exploration
-
----
-# Non Programmers
-
-.left-column40[
-## Maptimizer
-
-
-(Hofmann, CHI 2022)
-]
-
-.right-column60[
-## Generative Design
-*Generative design* is a common approach to support end users (used a lot for fabrication)
-
-Lets each user specify their information priorities and preferred representations in familiar terms through a simple GUI
-
-]
-
----
-# What About Direct Authoring?
-
-We should also support more advanced creation
-- In Kim et al.’s survey of 56 accessible visualization papers published between 1999 and 2020 only two papers supported interactive authoring of charts by BVI users [Kim, CGF ‘21]
-
-Equivalent experiences is an important access goal
-- Same information conveyed
-- Same *interactive experience*
-
----
-# PSST
-
-Based on RxJS: everything is a stream
-
-.left-column40[
-<div class="mermaid">
-
-graph TD
- LS[Sensor] --> DS[DataSink]
- OE[OutputEngine] --> DS
- DS -->|Sensor values| NH[Handler]
- NH -->|converts sensor values to appropriate format| O[Output]
-
-</div>
-]
-
----
-# PSST Example
-
-Sonifying a light sensor
-.left-column40[
-<div class="mermaid">
-
-graph TD
- LS[Light Sensor] --> DS[DataSink]
- OE[OutputEngine] --> DS
- DS -->|Light sensor values| NH[NoteHandler]
- NH -->|converted light sensor values to audible range| O[NoteOutput]
-
-</div>
-]
-.right-column60[
-![:youtube A sound can be heard with the pitch rising and lowering as a light moves closer and further from the circuit board, aSe-QkSl12c]
-]
-
-<!-- --- -->
-<!-- # PSST -->
-
-<!-- PSST allows BVI developers to make their own data visualizations -->
-
-<!-- <div class="mermaid"> -->
-<!-- sequenceDiagram -->
-<!-- Lightsensor->>+DataSink: New Value as Datum -->
-<!-- OutputEngine->>+DataSink: Status is "Playing" -->
-<!-- DataSink-\->>+NoteHandler: Status, Datum -->
-<!-- NoteHandler->>+NoteOutput: Status, Datum adjusted using Mel Scale -->
-<!-- NoteOutput->>+User: Plays note if status is "Playing" -->
-<!-- </div> -->
-
----
-# Code or GUI Configuration
-
-.column[
-GUI automatically created from spec
-
-User can select, parameterize and attach outputs to streaming data
-]
-.column[
-![:youtube A user configuring a sonification using the accessible PSST GUI while a screenreader plays a description, xl70zqfW2H0]
-
-]
-
---
-.column[
-.quote[I’ve seen these sonifications for decades . . . but I’ve never seen anything nice in a dashboard like this that lets you add and remove multiple ones and tweak the parameters of each.]
-]
-
----
-[//]: # (Outline Slide)
-
-# Some questions to consider about information access
-
-Who can access visualizations that other people have created?
-
-Who can create accessible information?
-
-**How do we support the full data science lifecycle?**
-- Data collection
-- Data cleaning
-- Modeling and Analysis
-- Representation
-
----
-# Data Science Accessibility
-
-Very much still a wide open area, at least for BLV people
-
-- Data collection -- not particularly supported (even coding tools very inaccessible)
-- Data cleaning -- not studied to my knowledge
-- Modeling and Analysis -- Common tools like Jupyter Notebooks wholly inaccessible. Venkatesh (first author of PSST) is starting to work on this
-- Representation -- Accessible visualization & Data physicalization are the big opportunities
-
----
-# One last PSST Video
-... and then on to our guest!
-
-![:youtube A user turns a handle on a music box. A laser cut strip containing data moves through producing notes, EKaaP0TKQog]
-
diff --git a/slides/best-practices.html b/slides/best-practices.html
index 30edd7e5c48aed604d121c42b5b4501a0ce5de8f..4e9ed573006c82448d6faec6103d6855c885e2e8 100644
--- a/slides/best-practices.html
+++ b/slides/best-practices.html
@@ -23,130 +23,165 @@ class:
## Make sure zoom is running and recording!!!
---
-# Announcements
+# Announcements (1/2)
-My office hours on Tuesday will be at 4pm instead of 3pm
+1. Your implementation assignment grades will be slightly delayed because Aashaka is traveling, we hope to still get them back to you next week
+- videos must be on youtube if you choose that route
+- showing in office hours requires signing up; this is not considered a presentation opportunity
+- all repeat competencies. Any additions, check with us
---
-[//]: # (Outline Slide)
-# Learning Goals for Today
+# Announcements (2/2)
+
+2. Project proposals due on Friday the 26th 3pm instead of Wednesday because of the ASSETS deadline, we hope to provide feedback by Monday
+3. To facilitate project team formation, please post your preliminary ideas and reactions on Ed today, on Wednesday we'll reserve class time for groups to talk for 10 minutes.
-**Who Is Responsible for Accessibility?**
+Also: no office hours for Jen next Wednesday
-How Screen Readers Work
+---
+# Most WWW and Apps not Accessible
-Building for Accessibility
-- Structure impacts navigation order
-- Need to announce things that change
+- Over 60% of Android apps missing at least one label on a clickable element (out of 5721 apps tested) ([Ross, 2020](https://dl.acm.org/doi/pdf/10.1145/3348797))
+- Over 80% of fortune 500 websites not accessible ([Loiacono, 2009](https://dl.acm.org/doi/pdf/10.1145/1562164.1562197))
+- University websites are also partly to mostly inaccessible ([Campoverde-Molina, 2021](https://link.springer.com/content/pdf/10.1007/s10209-021-00825-z.pdf))
+- Less than 1% of Twitter images had ALT text in 2019 ([Gleason, 2019](https://dl.acm.org/doi/pdf/10.1145/3308558.3313605))
+- Only about 50% of universities in the US teach accessibility at all ([Shinohara, 2018](https://dl.acm.org/doi/pdf/10.1145/3159450.3159484)).
-<!-- [//]: # TODO expand this slide deck? IT's short and could cover more. Also discuss how this should impact the report -->
+???
+
+More study is needed, but overall, progress here is slow.
+
+This last point relates to our discussion of software engineers and accessibility in a week -- we are simply not training people to do this (or AI!)
---
+# What is the goal?
+All users interact with the *same* website or app as anyone else
-# Why isn't the World Already Accessible?
+Users may use browser features or a specialized accessibility tool to customize their experience
-Designing for accessibility is hard
+--
+**This is Key**
-Implementing accessibility is hard
+Website or app designer provides the right structure and information to support this
-Testing accessibility is also hard!
---
-# Who Creates Accessibility?
+# Testing For Accessibility?
-**Organizations impact accessibility**
+Automated Tools
-
----
-# Who Creates Accessibility?
+Design Guidelines (i.e. know them and apply them heuristically)
+
+Simulation (Try it yourself using accessibility technologies or simulators such as [aDesigner](https://www.eclipse.org/actf/downloads/tools/aDesigner/))
-Organizations impact accessibility
+User Testing
-**Designs have a big role in what is accessible**
+---
+[//]: # (Outline Slide)
+# Learning Goals for Today
+
+- **Manual Accessibility Testing**
+ - We will focus on screen readers
+ - And understanding structure in interactive apps
+ - And how this impacts user agents (such as screen readers)
+- Building for Accessibility
+- Assignment
+- [if time] Get comfortable using existing freely available accessibility technology to manually support assessment
+<!-- [//]: # TODO expand this slide deck? IT's short and could cover more. Also discuss how this should impact the report -->
---
-# How might UX Designers address Accessibility
+# Manual Assessment Warning
-Include it in design requirements
+Simulation tends to cause people to underestimate what is possible
-Provide ALT text for images and buttons
+Helps to learn *how* to use things but never assume you are proficient
-Provide guidance for both nonvisual and visual structure (e.g. proper linear order)
+We'll touch on screen readers, magnifiers & so on today
+<!-- .right-column[ -->
+<!-- ![:youtube One thumb to rule them all: video of gaming with switch control,2BhHwk9qSvI] -->
+]
----
-# Who Creates Accessibility?
+???
+Remind them about drone video
-Organizations impact accessibility
+Don't fall into the trap of assuming that your ineptitude is the standard disability experience]
-Designs have a big role in what is accessible
+---
+# Switch Control
-**Developers also of course very important**
-- Need to understand the expectations of APIs and accessibility technologies
-- Need to understand screen readers
+![:youtube Explanation of how to set up switch control, GQKEE9nI1lk]
+???
+- Switch users, turn this on, on your phone
---
-# How do practitioners enact accessibility in practice?
-[Accessibility in Software Practice](https://dl.acm.org/doi/pdf/10.1145/3503508)
+# Magnification
-- data from 15 interviews and 365 survey respondents from 26 countries across five continents --> 120+ unique codes
-- followed up with a survey --> 44 statements grouped into eight topics on accessibility from practitioners’ viewpoints and different software development stages.
+![:youtube How to magnify your windows desktop, PMihdIZUh7Y?feature=shared&t=81]
+???
+- Magnification users, turn this on, on your phone
---
-# Organizational & People Challenges
-.quote[Before making any decisions about “Accessibilityâ€: stakeholders (e.g., designers, architects, developers, testers, and clients) in a project should
-reach a consensus on accessibility development and design]
+# Browser Settings
+
+- Change font size
+- Change color contrast
+- Change from light to dark mode
+
-| Challenge | Recommendation |
-|----------------------------------------|----------------------------------------------------|
-| Lack of resources | Long-term organizational buy-in and budget |
-| Culture | Cooperative Culture |
-| Size (too small) | Work with customers & teams to prioritize access |
-| Inadequate expertise & education | Include accessibility expertise among team members |
-| Lack of QA to go with developer effort | Include accessibility on testing team |
+???
---
-# Process Challenges (technical)
+# Screen Readers
+
+.left-column-half[
+Different types of screen readers.
+- JAWS for Windows
+- Nonvisual Desktop Access
+- VoiceOver
+- TalkBack
+- ChromeVox
-Notice details of WCAG guidelines low on this list!
+]
+.right-column-half[
+ 
-| Challenge | Recommendation |
-|-------------------------------------------|------------------------------------------------------|
-| Unclear requirements & planning | Include accessibility at all stages |
-| Unclear scope & architecture requirements | Engage with relevant end users |
-| Difficulty testing | Use appropriate testing suites & integration testing |
-| Lack of complete access practices | Rigorous refactoring |
-| Inappropriate tools | Well-designed documentation & training |
-| Domain-dependent issues | Appropriate end user engagement and testing |
+*Where can you find one?*
+Different devices used to interact with screen readers.
+]
---
-# Who Creates Accessibility?
-
-Organizations impact accessibility
+# Screen Readers: Typical Bugs
-Designs have a big role in what is accessible
+.left-column40[
+
+]
-Developers also of course very important
+.right-column60[
+![:youtube Banking failure, b-R5r_aKmKo]
+]
-**These days, a lot of it is created by end users**
-- This means that you have to think about *indirect* impacts on content creation too (i.e. what do you expose to end users in authoring tools)?
+???
+- Reads the words on the screen
+- Keystroke to move to next area
+- Screen reader users, turn this on on your phone
---
[//]: # (Outline Slide)
# Learning Goals for Today
-Who Is Responsible for Accessibility?
-
-**How Screen Readers Work**
-
-Building for Accessibility
-- Structure impacts navigation order
-- Need to announce things that change
+- Manual Accessibility Testing
+- **Building for Accessibility**
+ - We will focus on screen readers
+ - And understanding structure in interactive apps
+ - And how this impacts user agents (such as screen readers)
+- Assignment
+- [if time] Get comfortable using existing freely available accessibility technology to manually support assessment
---
# (On-desktop) screen reader interaction
@@ -173,38 +208,262 @@ Three core interaction patterns:
Discuss similarities and differences from desktop
---
-# Screen Readers
+# Structure of a Web Page
-.left-column-half[
-Different types of screen readers.
-- JAWS for Windows
-- Nonvisual Desktop Access
-- VoiceOver
-- TalkBack
-- ChromeVox
+| Content | Structure | Style | Behavior |
+| :--: | :--: | :--: | :--: |
+||
+| Words and Images | HTML | CSS | JavaScript |
+
+---
+# Structure of a Web Page
+
+| Content | Structure | Style | Behavior |
+| :--: | :--: | :--: | :--: |
+|||
+| Words and Images | HTML | CSS | JavaScript |
+
+---
+# Structure of a Web Page
+
+| Content | Structure | Style | Behavior |
+| :--: | :--: | :--: | :--: |
+||||
+| Words and Images | HTML | CSS | JavaScript |
+
+
+---
+# Structure of a Web Page
+
+| Content | Structure | Style | Behavior |
+| :--: | :--: | :--: | :--: |
+|||||
+| Words and Images | HTML | CSS | JavaScript |
+---
+# Lifecycle of a browser loading a page
+
+.left-column40[
+1. Fetch the page
+2. Parse the page
+3. Build up an internal representation of the web page [structure]
+4. Display the page [style]
+5. Handle interaction [behavior]
+]
+.right-column60[
+
]
-.right-column-half[
- 
-*Where can you find one?*
-Different devices used to interact with screen readers.
+---
+# Parse and Display the Page
+
+.left-column[
+
+
+]
+
+.right-column[
+1. First line: <!DOCTYPE html>
+ - Ok: need to build an internal representation of the page
+2. Line-by-line, go through the HTML
+ - If one of the tags links to a cascading style sheet (CSS) file, load and parse it
+ - If one of the tags links to JavaScript (JS) for behavior, load and parse it
+3. FINALLY display the page…
]
+
---
-# Building for screen readers (1 of 2)
+# Understanding content
-Screen readers get underlying information about controls from operating systems.
-- This information must be provided by the developer (and in some cases, parts of the info provided by toolkit library)
-- Accessibility APIs provide the information to a screen reader.
-- Screen readers provide this information visually, through audio or in Braille to users.
+- There are 100s of possible HTML tags! See [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)!
+- Some simple tags
+ - Title `<title></title>` (which nests inside your `<head></head>`)
+ - Headings `<h1></h1>` .. `<h6></h6>`
+ - Paragraphs `<p>`
+ - Ordered or unordered lists: `<ol></ol>`, `<ul></ul>`, with list elements `<li></li>`
+ - Horizontal rules `<hr />`
+ - Strong `<strong></strong>` which defaults to a bold style and emphasis `<em></em>` which defaults to italicized in most browsers.
+
+---
+# Adding content
+
+- There are 100s of tags! See [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)!
+- Some simple tags
+- Some tags add semantic context
+ - `<header></header>`: The header or banner that displays the title of the page
+ - `<main></main>`: The bulk of the content of the page
+ - `<footer></footer>`: The footer is optional but you can put contact info and copyright date in there.
+
+---
+# Adding content
+
+- There are 100s of tags! See [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)!
+- Some simple tags
+- Some tags add semantic context
+- Some tags need additional information, added to a tag with attributes
+ - Links to other pages `<a href="filename"></a>`
+ - Links to images `<img src="img.jpg" alt="Description!"/>`
+
+---
+# Adding content
+- There are 100s of tags! See [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)!
+- Some simple tags
+- Some tags add semantic context
+- Some tags need additional information, added to a tag with attributes
+- Some tags (comments) are important for documentation `<!-- -->`
+
+
+---
+# Cascading Style Sheets (CSS)
+
+- Allows us to change the look and feel of the content on the page
+- Style is separated into a .css file
+ - Makes styling multiple pages easier
+ - Allows changing multiple pages easier
+- Style sheets must be linked to an html page in the <head> for the styles to work
+ `<link href=“style.css†rel=“stylesheet†/>`
+- Great example is [CSS Zen Garden](http://www.csszengarden.com/)
+
+---
+# Document Object Model (DOM) (1/3)
+
+.left-column[
+
+]
+
+.right-column[
+- We must build up a hierarchy of document elements (the **Document Object Model**)
+- The structure of this depends on our HTML (or the toolkit that generates your HTML or App)
+- The structure of this influences layout
+
+]
+
+---
+# Document Object Model (DOM) (2/3)
+
+.left-column[
+
+]
+
+.right-column[
+What does this hierarchy look like?
+
+]
+
+---
+# Document Object Model (DOM) (3/3)
+
+.left-column[
+
+]
+
+.right-column[
+<div class="mermaid">
+flowchart TD
+ A(Main Window)
+ B(Vertical Layout)
+ C("Spot the Heron" Label)
+ D(Picture of a heron in water with some reeds)
+ E(Horizontal Layout: Controls)
+ F(Left arrow)
+ G(Play)
+ H(Right arrow)
+ A --> B
+ B --> C
+ B --> D
+ B --> E
+ E --> F
+ E --> G
+ E --> H
+
+classDef default fill:#009688,stroke:#333,stroke-width:2px, color:white;
+classDef reflect fill:#4CAF50,stroke:#333,stroke-width:2px, color:white;
+class A,B,C default
+class A,B,C,D,E reflect
+linkStyle default stroke: black,stroke-width:8px
+
+
+</div>
+
+]
+
+---
+# Let's compare that to an app
+
+.left-column50[
+Components: *library elements* (e.g. buttons and labels) combined according to *toolkit rules*
+
+
+
+]
+.right-column50[
+- What are the "components" in this image?
+- What does the "interactor hierarchy" look like for this image
+
+]
+
+???
+discuss with your neighbor
+- what to draw; where to draw it
---
-# Building for screen readers (2 of 2)
+# Let's compare that to an app (Answer)
+
+.left-column50[
+Components: *library elements* (e.g. buttons and labels) combined according to *toolkit rules*
+
+
+]
+.right-column50[
+<div class="mermaid">
+graph TD
+W(Window) --> H[Horizontal layout]
+ H --> I1[fa:fa-bell Bell ]
+ H --> V[Vertical Layout]
+ V --> I2[Title: Google Calendar reminder]
+ V --> I3[Text: Christian and Anind --Jen Mankoff-- is
+ starting at 12:30pm. - Video call]
+classDef default fill:#009688,stroke:#333,stroke-width:2px, color:white;
+classDef reflect fill:#4CAF50,stroke:#333,stroke-width:2px, color:white;
+class H,V default
+class I1,I2,I3 reflect
+linkStyle default stroke: black,stroke-width:8px
+</div>
+
+]
+
+---
+# How do we make it more interactive?
+
+
+How about we add a button?
+--
+count: false
+
+
+Wait? When you hear the word "button" in the context of a graphical user
+interface (GUI), what do you think of?
+
+---
+# What should it do?
+
+What do we tell the toolkit about the button?
+- Where to place it
+- How it should react to user input (from which device?)
+
+---
+# Screen Reader Information Flow (1/2)
+What happens when the user is exploring/navigating?
<DIV class="mermaid">
graph LR
-SR[fa:fa-volume-up <BR> Screenreader<BR>]:::bluelarge -->|Asks for next object| API(fa:fa-codepen<BR> Accessibility API<BR>):::bluelarge
+SR[fa:fa-volume-up <BR> Screenreader<BR>]:::bluelarge -->|Asks for next object in DOM| API(fa:fa-codepen<BR> Accessibility API<BR>):::bluelarge
API -->|Passes along request| ATK[<BR> Toolkit<BR>]:::bluelarge
ATK -->|Checks Details| App[fa:fa-mobile <BR>App<BR>]:::bluelarge
App -->|Name: Foo| ATK
@@ -214,21 +473,11 @@ Speak(fa:fa-volume-up Button, Foo ):::bluelarge
</div>
--
-... (repeat for each swipe)
-<DIV class="mermaid">
-graph LR
-SR[fa:fa-volume-up <BR> Screenreader<BR>]:::bluelarge -->|Asks for next object| API(fa:fa-codepen<BR> Accessibility API<BR>):::bluelarge
-API -->|Passes along request| ATK[<BR> Toolkit<BR>/Browser]:::bluelarge
-ATK -->|Checks Details| App[fa:fa-mobile <BR>App<BR>]:::bluelarge
-App -->|Name: Bar| ATK
-ATK -->|Name, Role: Button| API
-API -->|Name, Role| SR
-Speak(fa:fa-volume-up Button, Bar ):::bluelarge
-
-</div>
+... (repeat for each swipe / component)
---
-# What happens when user double taps to invoke?
+# Screen Reader Information Flow (2/2)
+What happens when the user double taps to invoke?
<DIV class="mermaid">
graph LR
@@ -243,36 +492,63 @@ Speak(fa:fa-volume-up Deleted Text ):::bluelarge
</div>
---
-# API specific issues Impact Access
+# Different types of interfaces are similar
-You always must to understand your accessibility API in depth to make an app accessible
+| Does What? | Android | Web |
+|--- | --- | --- |
+| Content| Java | HTML/CSS/JS |
+| Style | Layout | CSS |
+| Structure | Interactor Hierarchy | Document Object Model (DOM) |
+| Content | Components | DIVS |
+| Style | Paint objects on a canvas | CSS |
+| Behavior | Event Handling | Event Handling/JS |
-For example, when [Ross et al, 2017](https://dl.acm.org/doi/10.1145/3132525.3132547) studied 1000s of android apps, some common errors came up which aren't in guidelines because they are either tool specific or straight up UX errors:
+---
+# Which of these Impacts Accessibility?
-| | Description|
-|--|
-|<i class="darklight fa fa-strikethrough fa-2x"></i> | TextView has a content description. This might interfere with a screen reader’s ability to read the content of the text field |
-| <i class="darklight fa fa-angle-double-right fa-2x"></i> | Overlapping clickable items |
-|<i class="darklight fa fa-link fa-2x"></i> | URL in link may be invalid |
+| Does What? | Android | Web | Accessibility (Examples) |
+|-- |--------------------------------|---------------------------------------------------|--------------------------------------|
+| Content | Java | HTML/CSS/JS | Does the toolkit support access? |
+|Style | Layouts | CSS | Comprehension/Magnification |
+| Structure | Interactor Hierarchy | Document Object Model (DOM) | Navigation |
+| Content | Components | DIVS | Alternative text (toolkit dependent) |
+| Style | Paint objects on a canvas | CSS | Color choices |
+| Behavior | Event Handling ` | Event Handling/JS | Proper Interaction with access API? |
---
-[//]: # (Outline Slide)
-# Learning Goals for Today
+# Building for Accessibility
+<DIV class="mermaid">
+graph LR
+SR[fa:fa-volume-up <BR> Screenreader<BR>]:::bluelarge -->|Asks for next object in DOM| API(fa:fa-codepen<BR> Accessibility API<BR>):::bluelarge
+API -->|Passes along request| ATK[<BR> Toolkit<BR>]:::bluelarge
+ATK -->|Checks Details| App[fa:fa-mobile <BR>App<BR>]:::bluelarge
+App -->|Name: Foo| ATK
+ATK -->|Name, Role: Button| API
+API -->|Name, Role| SR
+</div>
-Who Is Responsible for Accessibility?
+- This information must be provided by the developer (and in some cases, parts of the info provided by toolkit library)
+- Accessibility APIs provide the information to a screen reader.
+- Screen readers provide this information visually, through audio or in Braille to users.
-How Screen Readers Work
+???
+As an example, we'll focus on screen readers
-Building for Accessibility
-- **Structure impacts navigation order**
-- Need to announce things that change
+Screen readers get underlying information about controls from operating systems.
+---
+# Example: Accessible Button (1/4)
+
+Minimum needed for screen reader access
+- **Location** (for Navigation)
+
+???
+Naturally exists in the interactor hierarchy/DOM, but is it in an intuitive place for navigation?
---
# Key Navigation Concept
-Reaching times
-- How long does it take to get somewhere
+Reaching times: How long does it take to get somewhere
Information you need to collect to assess this:
- You need to know the linear order of a webpage or app.
@@ -280,24 +556,85 @@ Information you need to collect to assess this:
No way to automatically assess this! Hard to assess well without knowing best tricks for navigation that disabled people use.
+
+---
+# A page with layout
+
+.left-column60[
+(table but imagine it was CSS)
+<style type="text/css">
+.tg {border-collapse:collapse;border-spacing:0;}
+.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg .tg-w747{background-color:#dae8fc;text-align:left;vertical-align:top}
+.tg .tg-kftd{background-color:#efefef;text-align:left;vertical-align:top}
+.tg .tg-ltxa{background-color:#ffccc9;text-align:left;vertical-align:top}
+.tg .tg-0lax{text-align:left;vertical-align:top}
+</style>
+<table class="tg">
+<thead>
+ <tr>
+ <th class="tg-kftd" colspan="3"><span style="color:#333;background-color:#FFF">Title spanning whole width of table</span></th>
+ </tr>
+</thead>
+<tbody>
+ <tr>
+ <td class="tg-w747" rowspan="3">Navigation 1<br>Navigation 2<br>Navigation 3<br>Navigation 4</td>
+ <td class="tg-ltxa">Banner Ad</td>
+ <td class="tg-w747" rowspan="3">Right Nav 1<br>Right Nav 2<br>Right Nav 3</td>
+ </tr>
+ <tr>
+ <td class="tg-0lax" rowspan="2">Main content area with lots of text and stories <br>filling the center part of the window</td>
+ </tr>
+ <tr>
+ </tr>
+</tbody>
+</table>
+]
+.right-column40[
+What focus order makes sense for the Facebook newsfeed?
+
+Does this match the actual focus order?
+
+When might you need to skip things?
+]
---
-# What did this page look like?
+# Linear Order with no CSS
+
+Depends on how the page was designed. One possibility
-- This is a title cell
+- Title
+- Right Nav 1
+- Right Nav 2
+- Right Nav 3
- Navigation 1
- Navigation 2
- Navigation 3
- Navigation 4
- Banner ad
-- Right Nav 1
-- Right Nav 2
-- Right Nav 3
-- Main content area with lots of text and stories filling the center part of the window.
+- Main content area
---
-# Original layout of page
-(done with tables but imagine it was CSS)
+# Swipe order? (bad)
+
+.left-column60[
+| Cell | Nefarious order |
+|--------------|-----------------|
+| Title | 1 |
+| Right Nav 1 | 8 |
+| Right Nav 2 | 9 |
+| Right Nav 3 | 10 |
+| Banner ad | 3 |
+| Navigation 1 | 4 |
+| Navigation 2 | 5 |
+| Navigation 3 | 6 |
+| Navigation 4 | 7 |
+| Content | 11 |
+]
+.right-column40[
<style type="text/css">
.tg {border-collapse:collapse;border-spacing:0;}
.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
@@ -317,72 +654,181 @@ No way to automatically assess this! Hard to assess well without knowing best tr
</thead>
<tbody>
<tr>
- <td class="tg-w747" rowspan="3">Navigation 1<br>Navigation 2<br>Navigation 3<br>Navigation 4</td>
+ <td class="tg-w747" rowspan="3">Nav 1<br>Nav 2<br>Nav 3<br>Nav 4</td>
<td class="tg-ltxa">Banner Ad</td>
<td class="tg-w747" rowspan="3">Right Nav 1<br>Right Nav 2<br>Right Nav 3</td>
</tr>
<tr>
- <td class="tg-0lax" rowspan="2">Main content area with lots of text and stories <br>filling the center part of the window</td>
+ <td class="tg-0lax" rowspan="2">Main content area with lots of text and stories filling the center part of the window</td>
</tr>
<tr>
</tr>
</tbody>
</table>
+]
---
-# Example: Swipe Order
-.left-column40[
-
-]
-.right-column60[
-What focus order makes sense for the Facebook newsfeed?
+# Swipe order? (better)
-Does this match the actual focus order?
+.left-column60[
+| Cell | Well designed order |
+|--------------|---------------------|
+| Title | 1 |
+| [skip cell] | 2 |
+| Right Nav 1 | 3a |
+| Right Nav 2 | 3b |
+| Right Nav 3 | 3c |
+| Banner ad | 3e |
+| Navigation 1 | 3a |
+| Navigation 2 | 3b |
+| Navigation 3 | 3c |
+| Navigation 4 | 3d |
+| Content | 3 |
+
+]
+.right-column40[
+<style type="text/css">
+.tg {border-collapse:collapse;border-spacing:0;}
+.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg .tg-w747{background-color:#dae8fc;text-align:left;vertical-align:top}
+.tg .tg-kftd{background-color:#efefef;text-align:left;vertical-align:top}
+.tg .tg-ltxa{background-color:#ffccc9;text-align:left;vertical-align:top}
+.tg .tg-0lax{text-align:left;vertical-align:top}
+</style>
+<table class="tg">
+<thead>
+ <tr>
+ <th class="tg-kftd" colspan="3"><span style="color:#333;background-color:#FFF">Title spanning whole width of table</span></th>
+ </tr>
+</thead>
+<tbody>
+ <tr>
+ <td class="tg-w747" rowspan="3">Nav 1<br>Nav 2<br>Nav 3<br>Nav 4</td>
+ <td class="tg-ltxa">Banner Ad</td>
+ <td class="tg-w747" rowspan="3">Right Nav 1<br>Right Nav 2<br>Right Nav 3</td>
+ </tr>
+ <tr>
+ <td class="tg-0lax" rowspan="2">Main content area with lots of text and stories filling the center part of the window</td>
+ </tr>
+ <tr>
+ </tr>
+</tbody>
+</table>
+Hidden skip Link to get to main content
-When might you need to *skip* things?
]
---
-## What order do you think will be used (1 of 2)
+# Swipe order? (best)
+
+.left-column60[
+| Cell | Chunked order |
+|-------------|---------------------|
+| Title | 1 |
+| [skip cell] | 2 |
+| Nav Area | 3 |
+| Right Nav | 3a |
+| Right Nav 1 | 3a.1 |
+| Right Nav 2 | 3a.2 |
+| Right Nav 3 | 3a.3 |
+| Left Nav | 3b |
+| Navigation 1 | 3b.1 |
+| ... | |
+| Banner ad | 3c |
+| Content | 4 |
-.left-column40[
-
]
-.right-column60[
+.right-column40[
+<style type="text/css">
+.tg {border-collapse:collapse;border-spacing:0;}
+.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
+ font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
+.tg .tg-w747{background-color:#dae8fc;text-align:left;vertical-align:top}
+.tg .tg-kftd{background-color:#efefef;text-align:left;vertical-align:top}
+.tg .tg-ltxa{background-color:#ffccc9;text-align:left;vertical-align:top}
+.tg .tg-0lax{text-align:left;vertical-align:top}
+</style>
+<table class="tg">
+<thead>
+ <tr>
+ <th class="tg-kftd" colspan="3"><span style="color:#333;background-color:#FFF">Title spanning whole width of table</span></th>
+ </tr>
+</thead>
+<tbody>
+ <tr>
+ <td class="tg-w747" rowspan="3">Nav 1<br>Nav 2<br>Nav 3<br>Nav 4</td>
+ <td class="tg-ltxa">Banner Ad</td>
+ <td class="tg-w747" rowspan="3">Right Nav 1<br>Right Nav 2<br>Right Nav 3</td>
+ </tr>
+ <tr>
+ <td class="tg-0lax" rowspan="2">Main content area with lots of text and stories filling the center part of the window</td>
+ </tr>
+ <tr>
+ </tr>
+</tbody>
+</table>
Use chunks to group meaningful info and reduce number of navigation steps.
-- User can double tap to drill down into chunk (e.g. navigate to the “like†button by drilling down into an individual post).
+
]
???
-ink over!
----
-## What order do you think will be used (2 of 2)
-.left-column40[
-
-]
-.right-column40[
-
-]
+- User can double tap to drill down into chunk (e.g. navigate to the “like†button by drilling down into an individual post).
---
# More Navigation Concepts
Forms and inputs have issues with *order* and *labels*. This is fixed different ways on different platforms, but all major UI dev tools have APIs for accessibility. Make sure you use them *and* testing.
-- Web [advice](http://webaim.org/techniques/forms/controls) and [advanced advice](http://webaim.org/techniques/forms/advanced) on this. Look for similar documentation for android/ios.
+- Web [advice](http://webaim.org/techniques/forms/controls) and [advanced advice](http://webaim.org/techniques/forms/advanced) on this. Look for similar documentation for android/iOS.
Tables are not ideal, but *best* when headers are labeled. Again, check the API for your interface dev platform.
---
-[//]: # (Outline Slide)
-# Learning Goals for Today
+# Example: Accessible Button (2/4)
+
+Minimum needed for screen reader access
+- Location (for Navigation)
+- **Does it have proper labeling/ALT text?**
+- Did you use a library element or ensure that events are properly announced
+ - State changes
+ - Invocation
+- Can it be triggered through the keyboard or API?
+
+???
+
+---
+# Interactive Component ALT text
+
+- What is a good name for a "Like" Button?
+
+- Enable the user to understand the name of the control they have navigated to, what type of control it is, what value it has, what state it has.
+
+---
+# Proper ALT text
+
+Screen reader will read out name, role, and state. Don't repeat these.
-Who Is Responsible for Accessibility?
+Good alt text: Name ("Like")
-How Screen Readers Work
+API knows: Role ("Button")
-Building for Accessibility
-- Structure impacts navigation order
-- **Need to announce things that change**
+API knows: State ("Not selected")
+
+---
+# Example: Accessible Button (2/4)
+
+Minimum needed for screen reader access
+- Location (for Navigation)
+- Does it have proper labeling/ALT text?
+- Did you use a library element or ensure that **events are properly announced**
+ - State changes
+ - Invocation
+
+???
---
.column[
@@ -411,6 +857,36 @@ Success notifications
Errors
]
+---
+# Example: Accessible Button (2/4)
+
+Minimum needed for screen reader access
+- Location (for Navigation)
+- Does it have proper labeling/ALT text?
+- Did you use a library element or ensure that events are properly announced
+ - State changes
+ - Invocation
+- **Can it be triggered through the keyboard or API?**
+
+???
+
+---
+# Other API specific issues Impact Access
+
+You always must to understand your accessibility API in depth to make an app accessible
+
+For example, when [Ross et al, 2017](https://dl.acm.org/doi/10.1145/3132525.3132547) studied 1000s of android apps. Some common errors came up which aren't in guidelines because they are either tool specific or straight up UX errors: [next slide]
+
+---
+# Errors that require manual inspection
+
+| | Description|
+|--|
+|<i class="darklight fa fa-strikethrough fa-2x"></i> | TextView has a content description. This might interfere with a screen reader’s ability to read the content of the text field |
+| <i class="darklight fa fa-angle-double-right fa-2x"></i> | Overlapping clickable items |
+|<i class="darklight fa fa-link fa-2x"></i> | URL in link may be invalid |
+
+
---
# Summary of Common Problems
@@ -445,14 +921,65 @@ IF you take one thing away from this whole discussion, it should be:
---
[//]: # (Outline Slide)
-# Learning Goals for Today
+# Learning Goals for Today
+
+- Manual Accessibility Testing
+ - We will focus on screen readers
+ - And understanding structure in interactive apps
+ - And how this impacts user agents (such as screen readers)
+- Building for Accessibility
+- **Assignment**
+- [if time] Get comfortable using existing freely available accessibility technology to manually support assessment
+
+<!-- [//]: # TODO expand this slide deck? IT's short and could cover more. Also discuss how this should impact the report -->
+
+---
+# This week's assignment
+The goal of this homework is to make something more accessible (e.g. website, visualization, user interface, AR/VR, etc) that you’ve already made.
+
+Required learning goals:
+- Accessible Document Creation
+- Familiarity with a Range of Accessibility Technologies
+- Image Description
+
+???
+If you don't have an interface, come speak with us!
+
+---
+[//]: # (Outline Slide)
+# Learning Goals for Today
+
+- Manual Accessibility Testing
+ - We will focus on screen readers
+ - And understanding structure in interactive apps
+ - And how this impacts user agents (such as screen readers)
+- Building for Accessibility
+- Assignment
+- [if time] **Get comfortable using existing freely available accessibility technology** to manually support assessment
+
+<!-- [//]: # TODO expand this slide deck? IT's short and could cover more. Also discuss how this should impact the report -->
+
+---
+# Break up into groups
+
+Decide who will
+- use switch control
+- use magnification
+- browser settings
+
+Open your phone's web browser and load [seattleschools.org](https://www.seattleschools.org/)
+
+Share on the [class discussion]({{site.discussion}}/4677684)
+
+---
+
+# In your groups
-Who Is Responsible for Accessibility?
+Visit or [UW Libraries](https://www.lib.washington.edu/). Evaluate
-How Screen Readers Work
+1. Whether a student can easily learn about Seattle Public Schools or UW Libraries
+2. Whether a student can "Report a Concern" about how accessible the website is.
-Building for Accessibility
-- Structure impacts navigation order
-- Need to announce things that change
+What are some problems you found? Try to separate out what is difficult for you as a beginner from what is a flaw in the website itself.
diff --git a/slides/best-practices2.html b/slides/best-practices2.html
new file mode 100644
index 0000000000000000000000000000000000000000..e7ddf9d1125ab4cc55dd3547a5debbb7bb171c10
--- /dev/null
+++ b/slides/best-practices2.html
@@ -0,0 +1,1141 @@
+---
+layout: presentation
+title: More Best Practices
+description: Accessibility
+class: middle, center, inverse
+---
+background-image: url(img/people.png)
+
+.left-column50[
+# More Best Practices
+
+{{site.classnum}}, {{site.quarter}}
+]
+---
+name: normal
+layout: true
+class:
+
+---
+# Important Reminder
+
+## This is an important reminder
+## Make sure zoom is running and recording!!!
+## Make sure captioning is turned on
+
+---
+[//]: # (Outline Slide)
+# Learning Goals for Today
+
+- **Get comfortable using existing freely available accessibility technology to manually support assessment**
+- How do we use automated tools?
+
+---
+# Introduction to Accessibility Standards
+Most comprehensive and up to date: Web Accessibility Initiative ([WAI](http://www.w3.org/wai/)), a service of the World Wide Web Consortium (W3C)
+- Makes recommendations for Web authors, browsers and servers: **Web Content Accessibility Guidelines (WCAG)**
+- WCAG is an ongoing project
+- There is no *official* equivalent for non-web programming, <BR> but WCAG can easily be applied to apps as well
+- Lots of ways to learn WCAG <BR> (e.g. this [certificate program](https://de.torontomu.ca/wa/); this [textbook](https://pressbooks.library.torontomu.ca/pwaa/); and [WebAIM](https://webaim.org))
+
+???
+We could spend a whole quarter on this... but we're going to limit it to one or two weeks
+
+"live" (regularly being worked on and updated, with input from the disability community).
+
+
+---
+# The [POUR](https://webaim.org/articles/pour/) standard
+
+- Perceivable: Web content is made available to the senses - sight, hearing, and/or touch
+- Operable: Interface forms, controls, and navigation are operable
+- Understandable: Information and the operation of user interface must be understandable.
+- Robust: Content must be robust enough that it can be interpreted by a wide variety of user agents, including assistive technologies
+
+
+.footnote[Note: There is a 5th thing, Conformance, which we are not covering]
+
+???
+This is appropriate for *all* disabilities -- don't think access is only an issue for blind and low vision (BLV) people
+
+Obviously there is some overlap between these, and they build on each other
+
+---
+# Three levels of compliance
+
+*Some* users with disabilities can access and use web content (A)
+
+*Removal of significant barriers* overall to accessing content (AA)
+
+*Enhancements to web accessibility* for more users with disabilities (AAA)
+
+Most apps and websites today only meet *part* of (A) level compliance!
+
+---
+# Testing Accessibility? Automated tools
+
+- [Review of many options](https://medium.com/@OPTASY.com/what-are-some-of-the-best-web-accessibility-testing-tools-to-evaluate-your-website-with-69def25a386)
+- Web: WebAIM's [WAVE](https://wave.webaim.org/);
+- Browser Extensions ([Comparison Article](https://medium.com/@OPTASY.com/what-are-some-of-the-best-web-accessibility-testing-tools-to-evaluate-your-website-with-69def25a386)): [WAVE](https://chrome.google.com/webstore/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh?hl=en-US); [Axe](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US); [Lighthouse](https://developer.chrome.com/docs/lighthouse/overview/); [Siteimprove](https://chrome.google.com/webstore/detail/siteimprove-accessibility/efcfolpjihicnikpmhnmphjhhpiclljc/related); & other browser extensions
+ - Phone apps: [Google Accessibility Scanner](https://support.google.com/accessibility/android/answer/6376570?hl=en&ref_topic=6376582) and [iOS.](https://developer.apple.com/library/archive/documentation/Accessibility/Conceptual/AccessibilityMacOSX/OSXAXTestingApps.html)
+
+---
+# POUR: Perceivable: Guidelines 1.1-1.4
+
+## Guideline 1.1
+Text Alternatives: Provide *electronic text* alternatives for any non-text content
+
+- Why non text?
+ - Can be rendered visually, auditorially, tactilely, or by any combination.
+ - Can also be easily enlarged
+
+---
+# Small Group Activity: 1.1 Violations?
+
+
+[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration) .quote[We want to embark on updating our website, but leadership isn't 100% convinced yet that this is necessary. This assessment would help to further make our case that an update is essential to improving accessibility of our services.]
+
+???
+We have recently received feedback from the Arc of Snohomish County that many voters with disabilities do not know about the options available to them for voting. We would like to be able to direct more people to our website, but have heard that there are barriers to navigating and accessing needed information.
+
+Look for a violation of guideline 1.1 (i.e. missing alt text)
+
+---
+# Different Types of Non-Text Content
+
+Read up on some of these links when you are faced with specific description needs
+.left-column50[
+- [Decorative and branding](https://dl.acm.org/doi/fullHtml/10.1145/3308558.3313605)
+- Formatting and text styling
+- Images as links
+- [Diagrams](https://ieeexplore.ieee.org/stamp/stamp.jsp?arnumber=9028522&casa_token=zZw_rYBgu1AAAAAA:eozpbJ-vvMZjQNt8p6WU91X4uFumPs-yVuMn4PTPRjyMhtsVrprdIEe1JfYOCUdv8SFP_TGd9s965Q&tag=1)
+- [Visualizations](https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=9555469)
+- [Memes](https://dl.acm.org/doi/10.1145/3308561.3353792)
+- [GUIS](https://dl.acm.org/doi/fullHtml/10.1145/3411764.3445040)
+]
+.right-column50[
+- Animations/Videos
+- AR/VR ([Accessibility, Disabilities, and VR](https://educatorsinvr.com/2019/05/31/accessibility-disabilities-and-virtual-reality-solutions/))
+- [Comparison of IoS and Android Rich Interactions](https://dl.acm.org/doi/pdf/10.1145/2851613.2851680?casa_token=dOz4huS0TUkAAAAA:zv0PjZk3-T8Bb4X2SfNpdZFuqO2u9v1jpWn5fq0hKZ0se6t5g0oMKLfrAmhlyufcw_3AuJ-ABZ2yWQ)
+- [CAPTCHAS]([CAPTCHAs](https://dl.acm.org/doi/10.1145/1518701.1518983)
+]
+
+???
+
+All of these require different strategies to describe them well.
+
+Read up on some of these links when you are faced with specific description needs
+
+
+---
+exclude: true
+# My description of the leftmost GUI
+
+
+
+???
+- App has two tabs at top center: Delivery and Pickup.
+- Below is a seach bar with address and time menu and an advertisement for The Burger Joint (25% of screen) with a details button
+- Next is a scrolling set of tabs for Pickup; Grocery; Prescription; Top Sites; the rest is not visible off screen
+- The bottom 30% of the screen shows the title Hidden Gems (Up and coming spots you'd like) with a list of restaurants. Each row in the list shows an image, restaurant name, rating, and more. The list requires 2D scrolling to see everything. The top two are visible: Tsuki Ramen and Chocolate Co.
+
+---
+exclude: true
+# My description of the leftmost GUI
+
+- App has two tabs at top center: Delivery and Pickup.
+- Below is a seach bar with address and time menu and an advertisement for The Burger Joint (25% of screen) with a details button
+- Next is a scrolling set of tabs for Pickup; Grocery; Prescription; Top Sites; the rest is not visible off screen
+- The bottom 30% of the screen shows the title Hidden Gems (Up and coming spots you'd like) with a list of restaurants. Each row in the list shows an image, restaurant name, rating, and more. The list requires 2D scrolling to see everything. The top two are visible: Tsuki Ramen and Chocolate Co.
+
+???
+
+This is very hard to describe without knowing what is accessible; and whether the user is more interested in content or layout.
+
+
+---
+exclude: true
+# Describing GUIs is rarely necessary
+
+GUI description best supported dynamically through exploration. Critical needs for this
+- Accessibility information available for interface
+- Touch screen phone interaction techniques
+
+When possible, don't describe GUIs, explore them.
+
+---
+# My Take (1/2)
+.left-column40[
+
+]
+.right-column60[
+When direct exploration isn't possible, consider descriptions that are *language based*
+
+I don't think any publications discuss markdown but I believe it is powerful
+]
+---
+# My Take (2/2)
+.left-column40[
+
+]
+.right-column60[
+<BR>
+<tt>
+stateDiagram-v2 <BR>
+ [*] --> Still<BR>
+ Still --> [*]<BR>
+ Still --> Moving<BR>
+ Moving --> Still<BR>
+ Moving --> Crash<BR>
+ Crash --> [*]<BR>
+</tt>
+]
+---
+# Small Group Activity
+
+Break into small groups and show each other the inaccessible diagram, screenshot, or other non-photograph you found. Pick one and work on a description for it. Do more if you have time [post]({{site.discussion}}/4679569)
+
+---
+# MathML standard for accessibility
+
+Math has a hierarchy just like other systems (i.e. fractions, parantheses)
+
+Can support with MathML
+
+Can generate MathML using pandoc; MS Word; etc
+
+Capturing an image of an equation and describing it much worse for screen reader users
+
+---
+# POUR: Perceivable: Guidelines 1.1-1.4
+
+.left-column[
+## Guideline 1.2
+
+Provide perceivable alternatives for time-based media
+]
+.right-column[
+Includes: audio-only; video-only; audio-video; audio and/or video combined with interaction
+
+Best practices vary depending on whether it is recorded or live, and the type of media, and include:
+
+- Video Description
+- Captions / Transcripts
+- ASL interpretation
+]
+???
+Kind of in 1.1 but also complicated so it gets its own guideline.
+
+
+---
+# 1.2 Violations?
+
+Probably best tested manually...
+
+---
+# Video/Animation/Audio Accessibility
+
+Relevant for slides; web; anywhere
+
+Understandable live & recorded video for people who are not able to hear audio
+
+Understandable live & recorded video for people who are not able to see the screen
+
+Other factors such as avoiding seizures & so on
+
+???
+delete avoiding seizures next year
+
+---
+# Captioning Videos
+
+Auto captioning getting better, but still makes many errors
+- Does not easily support multilingual settings
+- Errors for people with accents
+- Errors for proper nouns and names
+
+Best practice is manual captioning and/or ASL live, or pre-recorded
+
+Youtube will get you started with automated captions; can edit them.
+
+???
+Easy to apply and then correct auto captioning with existing tools (e.g. YouTube has an interface)
+- You will be expected to do this if you use video in any homeworks
+
+
+---
+# Audio Describing Videos
+
+May requiring pausing video, but skillful description usually possible without that
+
+More commonly available today than ever
+
+If you want to try it: [YouDescribe](https://youdescribe.org/)
+
+If you want to know more: [describing educational videos](https://dcmp.org/learn/descriptionkey)
+---
+# POUR: Perceivable: Guidelines 1.1-1.4
+
+.left-column[
+## Guideline 1.3
+
+Adaptable
+]
+.right-column[
+Ensure that all information is available in a form that can be perceived by accessibility tools (and thus spoken aloud, simplified, etc) This includes information that is not encoded in text such as
+- page organization and orientation
+- relationships
+- cross-site or cross-app organization
+- other structural information
+
+]
+
+???
+Example: spoken aloud, or presented in a simpler visual
+
+Structure and information should be able to be programmatically determined by assistive technology, so it can be rendered in other formats as needed by the user.
+
+---
+# 1.3 Violations?
+
+.left-column[[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)
+]
+.rigth-column[
+Ensure that all information is available in a form that can be perceived by accessibility tools (and thus spoken aloud, simplified, etc) This includes information that is not encoded in text such as
+- page organization and orientation
+- relationships
+- cross-site or cross-app organization
+- other structural information
+]
+
+---
+# POUR: Perceivable: Guidelines 1.1-1.4
+
+.left-column[
+## Guideline 1.4
+Distinguishable
+]
+.right-column[
+- Make the default presentation as easy to perceive as possible to people with disabilities.
+
+- Example: separate visual foreground information from the background
+ - color contrast
+ - volume contrast
+
+]
+
+
+---
+# POUR: Perceivable: Guidelines 1.1-1.4
+
+.left-column[
+## Guideline 1.4
+Distinguishable
+]
+.right-column[
+- Audio longer than 3s should provide easily found controls; ideally use low or no background audio
+- Support text resizing up to 200% (& therefore don't use images of text). (AAA) supports changing color; justification, etc
+- Support a 1 column view of content (AAA)
+- Avoid tooltips and popups; make sure they are: dismissable; hoverable; and persistent
+- Also mentions some redundant things such as contrast
+]
+
+---
+# 1.4 Violations?
+
+.left-column[
+[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)
+]
+.right-column[
+- Audio longer than 3s should provide easily found controls; ideally use low or no background audio
+- Support text resizing up to 200% (& therefore don't use images of text). (AAA) supports changing color; justification, etc
+- Support a 1 column view of content (AAA)
+- Avoid tooltips and popups; make sure they are: dismissable; hoverable; and persistent
+- Also mentions some redundant things such as contrast
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.1 (1/5)
+Keyboard Accessible
+]
+.right-column[
+
+Keyboards are flexible and universally supported and operable by people with different disabilities, as long as the keyboard input is not time-dependent.
+
+Examples of who benefits
+- screen reader users (e.g. blind users, reading disabilities)
+- speech input users
+- switch input users
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.1 (2/5)
+Keyboard Accessible
+]
+.right-column[
+- Drawing program
+- Drag and Drop
+- Drone control
+- Game play
+- Website navigation
+- ...
+]
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.1 (3/5)
+Keyboard Accessible
+]
+.right-column[
+Some common pitfalls:
+
+- Keyboard Traps. Content should not "trap" keyboard focus within subsections of content on a Web page. This is a common problem when multiple formats are combined within a page and rendered using plug-ins or embedded applications.
+]
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.1 (4/5)
+Keyboard Accessible
+]
+.right-column[
+Some common pitfalls:
+
+- Keyboard Traps.
+- Invisible Content. Some parts of a web page can never be reached
+]
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.1 (5/5)
+Keyboard Accessible
+]
+.right-column[
+Some common pitfalls:
+
+- Keyboard Traps.
+- Invisible Content. Some parts of a web page can never be reached
+- Lack of Control. Users should be able to reconfigure or remove shortcuts
+]
+
+???
+Note: Not in guidelines (that I know of) but a "reverse trap" is whether you can reach text that *doesn't* have links or headers when using switch input. How would you do this?
+
+Character key shortcuts work well for many keyboard users, but are inappropriate and frustrating for speech input users — whose means of input is strings of letters — and for keyboard users who are prone to accidentally hit keys. To rectify this issue, authors need to allow users to turn off or reconfigure shortcuts that are made up of only character keys.
+
+---
+# 2.1 Violations?
+
+Not easy to test with an automated tool-- may be able to address reachability, but best tested other ways..
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.2 (1/2)
+
+Enough Time
+]
+.right-column[
+Many users who have disabilities need more time to complete tasks than the majority of users:
+- may take longer to physically respond
+- may take longer to read things
+- may have low vision and take longer to find things or to read them
+- may be accessing content through an assistive technology that requires more time.
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.2 (2/2)
+
+Enough Time
+]
+.right-column[
+- Timelines are adjustable (e.g. rotating content; timeouts; etc), and minimized when not necessary
+ - If a timeout does necessarily occur, users should be able to resume without loss of data after re-authenticating
+ - If data loss will occur, users are warned about the timeout limits
+- Pause, Stop & Hide all possible for all blinking text, animations and so on
+- Interruptions can be postponed or suppressed by the user, except involving an emergency (AAA)
+]
+
+---
+# 2.2 Violations?
+
+Probably *should* automated, not sure if that is supported
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.3 (1/2)
+
+Seizures and Physical Reactions
+]
+.right-column[
+In 1997, a cartoon on television in Japan sent over 700 children to the hospital, including about 500 who had seizures.
+ - Most people are unaware that they are triggered until it strikes.
+ - Warnings do not work well because they are often missed, especially by children who may in fact not be able to read them.
+]
+
+???
+It is possible to avoid these types of flashes and still create appealing apps/websites
+
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.3 (2/2)
+
+Seizures and Physical Reactions
+]
+.right-column[
+- Web pages do not contain anything that flashes more than three times in any one second period
+- Motion animation triggered by interaction can be disabled, unless the animation is essential to the functionality or the information being conveyed (AAA)
+]
+
+---
+# 2.3 Violations?
+
+Should be supported with automated tools, not sure if it is?
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.4 (1/5)
+
+Navigable
+]
+.right-column[
+- Can users find the content they need / go somewhere they want to go?
+- Can users keep track of their location?
+- Can users orient themselves within a website or app?
+
+Connections: Guideline 1.3 (any structure in the content can be perceived). Headings (1.3.1) are an important example of structure that supports navigation and orientation.
+]
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.4 (2/5)
+
+Navigable
+]
+.right-column[
+- Can jump over uninteresting content
+]
+???
+examples: Navigation (that is the same on every page on a site); Anything that is not the news article (on a news site); Advertisements; etc.
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.4 (3/5)
+
+Navigable
+]
+.right-column[
+- Can jump over uninteresting content
+- Each web page has a descriptive title; Links have link text that is clear about their purpose; Headings and labels describe topic and purpose
+]
+---
+
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.4 (4/5)
+
+Navigable
+]
+.right-column[
+- Can jump over uninteresting content
+- Titles; Links; and Headings are clear and descriptive
+- Focus order makes sense. This can be problematic in any web page, and is requires special support when navigating trees and tables.
+- Focus is visible (A) and perceivable (AA) and not obscured by other content (A)
+]
+---
+
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.4 (4/5)
+
+Navigable
+]
+.right-column[
+- Can jump over uninteresting content
+- Titles; Links; and Headings are clear and descriptive
+- Focus order makes sense and focus is visible and perceivable
+- Users should be able to locate a web page, and orient themselves, within a website
+- Section headings are used to organize the content, styling is handled through CSS, not heading level
+]
+
+---
+# 2.4 Violations?
+
+.left-column[
+- [WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)?)
+]
+.right-column[
+Navigable:
+- Can jump over uninteresting content
+- Titles; Links; and Headings are clear and descriptive
+- Focus order makes sense and focus is visible and perceivable
+- Users should be able to locate a web page, and orient themselves, within a website
+- Section headings are used to organize the content, styling is handled through CSS, not heading level
+]
+
+???
+
+Some can be checked with automated tools (can you find out whether there are skiplinks on the
+
+Some require manual testing
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.5 (1/5)
+
+Pointers, just like Keyboards, should be able to access everything
+]
+.right-column[
+
+- All functionality should be accessible via pointer input devices.
+- People operating pointer input devices may not be able to carry out timed or complex gestures. Examples
+ - drag-and-drop gestures and on touch screens
+ - swiping gestures
+ - split taps
+ - long presses.
+- They may also have trouble selecting small targets, or with precision (i.e. due to tremor)
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.5 (2/5)
+
+Pointers, just like Keyboards, should be able to access everything
+]
+.right-column[
+- Support a variety of input options including a single pointer; offer alternatives to gestures and other physical actions
+ - avoid path based gestures when possible;
+ - offer alternatives to path based gestures or multi-finger gestures
+ - provide programmatic alternatives to shaking or tilting or dragging based interaction
+ - **overall goal**: allow users to use multiple possible types of input (keyboard, pointer, on-screen keyboard, stylus, etc)
+
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.5 (3/5)
+
+Pointers, just like Keyboards, should be able to access everything
+]
+.right-column[
+- Support a variety of input options; a single pointer; offer alternatives to gestures and other physical actions
+- Trigger content only on *up* events (after a complete click)
+]
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.5 (4/5)
+
+Pointers, just like Keyboards, should be able to access everything
+]
+.right-column[
+- Support a variety of input options; a single pointer; offer alternatives to gestures
+- Trigger content only on *up* events
+- Make the *accessible name* and visual name for components match
+ - better supports programmatic access provided by accessibility tools.
+]
+
+---
+# POUR: Operable: Guidelines 2.1-2.5
+
+.left-column[
+## Guideline 2.5 (5/5)
+
+Pointers, just like Keyboards, should be able to access everything
+]
+.right-column[
+- Support a variety of input options; a single pointer; offer alternatives to gestures
+- Trigger content only on *up* events
+- Make the *accessible name* and visual name for components match
+- Targets of: 24x24 CSS Pixels (AA) or 44x44 CSS Pixels (AAA) make selection easier
+]
+
+
+---
+# 2.5 Violations?
+
+Mix of automated and human testing again
+
+---
+# More on Size
+
+.left-column40[
+Especially hard on mobile devices
+
+
+]
+
+.right-column60[
+Even if the user misses the Text Label on the screen, they will still be able to trigger the desired action because the touch target is larger than what appears, resulting in less user error.
+
+White space around targets also helps
+
+Minimum on mobile: 48x48
+]
+???
+Solve for one, extend to many
+Trying to hit a small button with one hand while standing on a moving, crowded bus
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.1 (1/4)
+Readable
+]
+.right-column[
+Readability means supporting people with all sorts of reading disabilities/reading modality preferences
+- Some of this can be automated if tools can access text content & appropriate meta data is provided
+- Some has to do with understandability, use of jargon, etc
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.1 (2/4)
+Readable
+]
+.right-column[
+Provide meta data language
+ - Including parts of a page if the language switches.
+ - Also provide pronunciation information when needed to read aloud properly
+
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.1 (3/4)
+Readable
+]
+.right-column[
+Provide meta data language
+
+Provide a dictionary
+ - easy to find & well organized
+ - include jargon, abbreviations, and other unusual words
+
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.1 (4/4)
+Readable
+]
+.right-column[
+Provide meta data language
+
+Provide a dictionary
+
+Aim for clarity & simplicity (simplified text or summaries)
+
+If possible provide an audio or sign language version of content
+
+]
+
+---
+# 3.1 Violations?
+
+.left-column[
+[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)
+]
+.right-column[
+Readability
+- **Provide meta data language**
+- Provide a dictionary
+- Aim for clarity & simplicity (simplified text or summaries)
+- If possible provide an audio or sign language version of content
+]
+
+???
+Mix again
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.2 (1/4)
+
+Predictable
+]
+.right-column[
+Present content in a predictable order that is consistent across an app or website.
+- Can help screen reader users
+- Can help people with cognitive impairments
+- Can help people who use magnification and can only see part of a layout
+]
+
+
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.2 (2/4)
+
+Predictable
+]
+.right-column[
+- Present content in a predictable and consistent order
+- Focus alone shouldn't trigger events: provide control over content changes
+ - don't submit a form; launch a dialog; change layout, etc on focus
+ - instead provide an "update now" button; "submit" button; etc
+ - same for page elements or inputs.
+ - Describe what will happen before a change to a form control.
+
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.2 (3/4)
+
+Predictable
+]
+.right-column[
+- Present content in a predictable and consistent order
+- Focus alone shouldn't trigger events
+- Locate repeating elements consistently throughout site
+ - navigation menus, search fields, skip to navigation links; help and so on
+ - same 2D position
+ - same logical linear ordering
+
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.2 (4/4)
+
+Predictable
+]
+.right-column[
+- Present content in a predictable and consistent order
+- Focus alone shouldn't trigger events: provide control over content changes
+- Locate repeating elements consistently throughout site
+- Use familiar names and icons for things. As much as possible be consistent with global standards, not just within the app/site.
+]
+
+---
+# 3.2 Violations?
+
+Mix of automated and human testing again
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.3 (1/5)
+
+Input Assistance
+]
+.right-column[
+Some people with disabilities may have trouble with input
+- creating error-free input
+- detecting input errors
+
+Try to reduce the number of serious or irreversible errors that are made
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.3 (2/5)
+
+Input Assistance
+]
+.right-column[
+- Reduce serious or irreversible consequences
+- Support form validation
+ - forms should support error identification with specific and easily found text error descriptions
+ - provide appropriate suggestions for correcting errors
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.3 (3/5)
+
+Input Assistance
+]
+.right-column[
+- Reduce serious or irreversible consequences
+- Support form validation
+- Make forms clear
+ - Provide clear instructions and labels for form inputs
+ - Provide context-sensitive help
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.3 (4/5)
+
+Input Assistance
+]
+.right-column[
+- Reduce serious or irreversible consequences
+- Support form validation
+- Make forms clear
+- Support review
+ - Support review before final purchase or submission of information.
+ - Especially when the consequences may be serious (such as an expensive purchase) or hard to undo
+
+]
+
+---
+# 3.3 Violations?
+
+.left-column[
+[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)
+]
+.right-column[
+Input Assistance
+- Reduce serious or irreversible consequences
+- Support form validation
+- Make forms clear
+- Support review
+]
+
+---
+# POUR: Adaptable: Guidelines 3.1-3.3
+
+.left-column[
+## Guideline 3.3 (5/5)
+
+Input Assistance
+]
+.right-column[
+- Reduce serious or irreversible censquences
+- Support form validation
+- Make forms clear
+- Support review
+- Simplify authentication
+ - Don't require people to re-enter redundant information (automate instead)
+ - Make sure authentication techniques are accessible
+]
+
+---
+exclude: true
+# Aside: CAPTCHA Accessibility
+
+.left-column50[
+
+]
+.right-column50[
+Commonly used security method
+- Designed to be hard for computers and easy for humans
+- Require vision
+
+No good accessible alternatives -- [audio CAPTCHA are easy to crack](https://arstechnica.com/information-technology/2008/12/computer-scientists-find-audio-captchas-easy-to-crack/) and hard to use ([video with more info](https://www.youtube.com/watch?v=raFXfU7_fkg)).
+
+]
+
+???
+Pointer to later 2nd wave accessibility topic: Accessibility and computer security
+
+
+---
+exclude: true
+# Audio CAPTCHA Accessibility
+
+.left-column50[
+
+]
+.right-column50[
+Commonly used security method
+- Designed to be hard for computers and easy for humans
+- Require vision
+
+<audio controls="controls"><source src="img/assessment/captcha.wav" type="audio/x-wav" /></audio>
+
+Answer:
+]
+
+
+
+---
+# POUR: Robust: Guideline 4.1
+
+.left-column[
+## Guideline 4.1 (1/3)
+
+Compatible
+]
+.right-column[
+
+Don't break user accessibility technologies (AT) with things like poorly formed markup
+
+Don't circumvent AT with unconventional markup/code
+
+Expose information in standard ways
+
+Follow conventions and be compatible with APIs as much as possible
+
+]
+
+???
+This was already a running theme but let's make it explicit
+
+
+---
+# POUR: Robust: Guideline 4.1
+
+.left-column[
+## Guideline 4.1 (2/3)
+
+Compatible
+]
+.right-column[
+- Use standard and complete start and end tags on web pages
+- Use standard types of status messages to announce changes in content that are not user initiated (e.g. "18 results returned" from an asynchronous search task)
+- Provide name, role, and value custom controls
+
+]
+---
+# 4.1 Violations?
+
+.left-column[
+[WebAIM for Snohomish County Auditor's Officed](https://wave.webaim.org/report#/https://snohomishcountywa.gov/224/Elections-Voter-Registration)
+]
+.right-column[
+Compatible
+- Use standard and complete start and end tags on web pages
+- Use standard types of status messages to announce changes in content that are not user initiated (e.g. "18 results returned" from an asynchronous search task)
+- Provide name, role, and value custom controls
+]
+
+
+---
+
+# Why isn't the World Already Accessible?
+
+Designing for accessibility is hard
+
+Implementing accessibility is hard
+
+Testing accessibility is also hard!
+
+---
+# Who Creates Accessibility?
+
+**Organizations impact accessibility**
+
+
+---
+# Who Creates Accessibility?
+
+Organizations impact accessibility
+
+**Designs have a big role in what is accessible**
+
+
+---
+# How might UX Designers address Accessibility
+
+Include it in design requirements
+
+Provide ALT text for images and buttons
+
+Provide guidance for both nonvisual and visual structure (e.g. proper linear order)
+
+---
+# Who Creates Accessibility?
+
+Organizations impact accessibility
+
+Designs have a big role in what is accessible
+
+**Developers also of course very important**
+- Need to understand the expectations of APIs and accessibility technologies
+- Need to understand screen readers
+
+
+---
+# How do practitioners enact accessibility in practice?
+
+[Accessibility in Software Practice](https://dl.acm.org/doi/pdf/10.1145/3503508)
+
+- data from 15 interviews and 365 survey respondents from 26 countries across five continents --> 120+ unique codes
+- followed up with a survey --> 44 statements grouped into eight topics on accessibility from practitioners’ viewpoints and different software development stages.
+
+
+---
+# Organizational & People Challenges
+
+.quote[Before making any decisions about “Accessibilityâ€: stakeholders (e.g., designers, architects, developers, testers, and clients) in a project should
+reach a consensus on accessibility development and design]
+
+| Challenge | Recommendation |
+|----------------------------------------|----------------------------------------------------|
+| Lack of resources | Long-term organizational buy-in and budget |
+| Culture | Cooperative Culture |
+| Size (too small) | Work with customers & teams to prioritize access |
+| Inadequate expertise & education | Include accessibility expertise among team members |
+| Lack of QA to go with developer effort | Include accessibility on testing team |
+
+---
+# Process Challenges (technical)
+
+Notice details of WCAG guidelines low on this list!
+
+| Challenge | Recommendation |
+|-------------------------------------------|------------------------------------------------------|
+| Unclear requirements & planning | Include accessibility at all stages |
+| Unclear scope & architecture requirements | Engage with relevant end users |
+| Difficulty testing | Use appropriate testing suites & integration testing |
+| Lack of complete access practices | Rigorous refactoring |
+| Inappropriate tools | Well-designed documentation & training |
+| Domain-dependent issues | Appropriate end user engagement and testing |
+
+---
+# Who Creates Accessibility?
+
+Organizations impact accessibility
+
+Designs have a big role in what is accessible
+
+Developers also of course very important
+
+**These days, a lot of it is created by end users**
+- This means that you have to think about *indirect* impacts on content creation too (i.e. what do you expose to end users in authoring tools)?
+
diff --git a/slides/designing-quals.html b/slides/designing-quals.html
new file mode 100644
index 0000000000000000000000000000000000000000..2f0130f4192a51bd2eb1fb0c79630d4ba81bc3cc
--- /dev/null
+++ b/slides/designing-quals.html
@@ -0,0 +1,609 @@
+---
+layout: presentation
+title: Designing for and With People with Disabilities
+description: Designing for ad With People with Disabilities
+class: middle, center, inverse
+---
+background-image: url(img/people.png)
+
+.left-column50[
+# Designing for and With People with Disabilities
+
+{{site.classnum}}, {{site.quarter}}
+]
+---
+name: normal
+layout: true
+class:
+
+---
+# Important Reminder
+
+## This is an important reminder
+## Make sure zoom is running and recording!!!
+
+
+---
+[//]: # (Outline Slide)
+# Learning Goals for Today
+- What is Accessibility Technology
+- Key Design Principals for Application of Positive Disability Principals to Research
+- Disability Model Analysis of Projects
+
+---
+# Accessibility technology
+
+.quote[[anything] ... used to increase, maintain, or improve functional capabilities of individuals with disabilities] (Wikipedia)
+
+What model is this arguing for? [talk to your neighbor & [Vote](https://PollEv.com/multiple_choice_polls/ZjuDF3XmSYKrFgrI7BOpo/respond)]
+
+---
+# Accessibility technology: Voting Results
+
+<iframe src="https://embed.polleverywhere.com/multiple_choice_polls/LfQHmBqVA559fCfqC5HH3?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+
+---
+
+# Accessibility technology
+How people with disabilities *may* navigate computers (and the world)
+
+Used to be called "assistive technology" but that language is ableist
+
+One solution, not parallel solutions
+
+
+???
+
+Not a *medical* device
+
+A broader view than Wikipedia
+
+---
+# Lots of software for this
+
+.left-column50[
+- Magnifier – make whole screen or a portion bigger
+ - Can also just use larger fonts, lower resolution
+ - Change colors and contrast
+- Free Screen Reader – read the words on the screen
+- On-Screen keyboard
+ - Can be scanned
+- Built-in speech recognition
+]
+.right-column50[
+Most Operating Systems (laptops and smartphones) have a whole collection of adaptations
+
+]
+
+???
+lots of software for this
+
+Adaptations for mouse
+- Make mouse easier to see
+- Move mouse with the keyboard
+
+Adaptations for keyboard
+- Sticky Keys – so no need for chords
+- Work like on Smartphones
+
+---
+# Example: Single Switch Access (1/2)
+
+Can point to on-screen keyboards with various mechanisms, or use scanning keyboards
+- e.g. sip and puff to select
+
+On Screen Keyboard
+- Usually add auto-complete and *auto-predict*: Predict next word based on previous words with no letters typed
+
+---
+# Example: Single Switch Access (1/2)
+
+
+![:youtube Video of person using switch input to make a video using a drone,YoM0Gua3UO4]
+
+???
+Other options: [youtube Video](https://www.youtube.com/watch?v=2BhHwk9qSvI&t=148s)
+
+---
+# Accessibility has always been driven by innovators, mostly disabled (1/3)
+
+ In 1808, Pellegrino Turri built the first typewriter, so that his blind lover, could write letters more legibly. ​
+
+
+---
+# Accessibility has always been driven by innovators, mostly disabled (2/3)
+
+
+
+Speech recognition, text to speech, and word-prediction technologies were all initially developed for people with disabilities.
+
+
+
+---
+# Accessibility has always been driven by innovators, mostly disabled (3/3)
+
+
+
+
+
+In 1937, Joseph Friedman created the first bendy straw to help his young daughter drink from a cup on a counter that was too high for her.
+
+??? and many more
+
+---
+# How can we approach Accessible Design Inclusively and Ethically (1/4)
+
+- Accommodation
+ - Co-producing access for all participants in a space or event
+ - Legally mandated, but also so much more
+
+
+---
+# How can we approach Accessible Design Inclusively and Ethically (2/4)
+
+- Accommodation
+- Universal Design
+ - One design works for everybody
+ - Typical example: curb cuts
+
+--
+
+**why is this problematic?**
+
+
+---
+# How can we approach Accessible Design Inclusively and Ethically (3/4)
+
+- Accommodation
+- Universal Design
+- Ability-Based Design - Jacob Wobbrock
+ - Technology that adapts to the abilities of the user in their current context
+
+
+--
+
+**why is this problematic?**
+
+---
+# How can we approach Accessible Design Inclusively and Ethically (4/4)
+
+- Accommodation
+- Universal Design
+- Ability-Based Design - Jacob Wobbrock
+- [Design for User Empowerment](https://dl.acm.org/doi/fullHtml/10.1145/2723869) -- Richard Ladner
+ - Centers self-determination
+ - Requires user to help implement
+
+
+---
+# Design A11yhood
+- Emphasizes agency and control
+- Provides for flexibility and adaptation
+- Supports creativity and hackery
+- Focuses on problems that disabled people care about
+- Includes diversity
+
+---
+# Tropes & ways things can go wrong (1/5)
+
+- Ableist designs of "mainstream" technology
+ - Leave people out (AI today; iPhone years ago)
+ - Or leave them out of key areas (Canvas TA interface a few years ago)
+
+---
+background-image: url(img/accessibility/old-phones.jpg)
+
+.left-column[
+## .white[Case Study: The iPhone]
+
+.white[
+MacWorld Keynote '07
+]]
+
+???
+Originally neither universal design nor ability-based design
+
+Here is an [interview (4:03-4:32) with Liz Jackson](https://www.youtube.com/watch?v=uvgXeCe6n10): iPhone screens are a product of accessible technology created from the ingenuity of a disabled person.
+
+---
+background-image: url(img/accessibility/jobs-iphone.jpg)
+
+.bottom[
+.white[The phone Jobs is holding is small, flat, and without any tangible information accessible to a blind person]
+]
+
+???
+Originally neither universal design nor ability-based design
+
+---
+.left-column[
+## Sliderule:
+
+The first mobile screen reader]
+
+.right-column[
+
+]
+---
+## Sliderule:
+
+The first mobile screen reader
+
+![:youtube Sliderule Video, 496IAx6_xys]
+
+???
+Describe what happened a little more when presenting it
+
+---
+# Translation to iPhone
+
+.column[
+.centerh[
+
+]
+]
+
+.column[
+.centerh[
+
+]
+]
+
+.column[
+.centerh[
+
+]
+]
+
+---
+background-image: url(img/accessibility/iphone-now.png)
+
+# Accessibility in the iPhone Today
+
+
+.left-column60[
+- VoiceOver – reads what is on screen
+- Speech recognition for controlling device
+- Zoom – screen magnifier – 3 finger tap
+- Closed captions on videos
+- AssistiveTouch – fewer fingers needed, etc.
+- Switch Control (IOS7 and later) [head movement with built in camera](https://www.youtube.com/watch?v=RXF2ThtYXzM) or external switch
+]
+
+???
+
+assistive touch also saves you from pressing the home button
+
+
+---
+# Tropes & ways things can go wrong (2/5)
+
+- Ableist Designs of Mainstream Technology
+- Hero complex (I can save you with this new technology)
+ - Does not emphasize Agency and Control
+ - Not Disability Led
+ - Typically doesn't involve disabled people early, if at all
+
+
+---
+# Tropes & ways things can go wrong (3/5)
+
+- Ableist Designs of Mainstream Technology
+- Hero complex... leads to:
+- Disability Dongle
+
+
+---
+# Disability Dongle (1/2)
+
+.quote[Disability Dongle: A well intended elegant, yet useless solution to a problem we never knew we had. Disability Dongles are most often conceived of and created in design schools and at IDEO.] [Liz Jackson](https://twitter.com/elizejackson/status/1110629818234818570)
+
+
+---
+# Disability Dongle (2/2)
+
+- Often speculative
+- Sometimes "they enact normative or curative harm upon disabled users"
+- Emphasize quick fix over structural change
+
+???
+explain the jargon
+
+---
+# Who is (Typically) Behind Disability Dongles?
+
+.quote[Thank you for your feedback is a signal that we have no control over how our knowledge will be used; by reframing disabled expertise and critique as “feedback,†this phrase, like IKEA’s ThisAbles campaign, relegates disabled people to the role of user and subordinates disabled knowledge to the (professional) designerly imagination. It’s a disingenuous phrase, in which “thank you†is uttered to remind us that it is actually us who should be grateful. [Disability Dongle](https://blog.castac.org/2022/04/disability-dongle/), Liz Jackson]
+
+
+---
+# Tropes & ways things can go wrong (4/5)
+
+.left-column50[
+- Hero complex
+- Disability Dongle
+- Inspiration Porn [stop at 4:29]
+]
+
+.right-column50[![:youtube Ted Talk Stella Young is a comedian and journalist who happens to go about her day in a wheelchair — a fact that doesn't; she'd like to make clear; automatically turn her into a noble inspiration to all humanity. In this very funny talk; Young breaks down society's habit of turning disabled people into "inspiration porn.",8K9Gg164Bsw] ]
+
+---
+# Tropes & ways things can go wrong (5/5)
+
+- Hero complex
+- Disability Dongle
+- Inspiration Porn
+- Whitewashing & related narrow perspectives
+ - 20 years of ASSETS publications never mentioned race
+ - Almost complete lack of accessible femtech
+ - etc.
+
+---
+# A Framework for Intersectional Research
+
+Consider theories drawn from multiple areas of identity
+- Language Justice (relating to multilingual access)
+- Disability Justice (queer people of color
+- ... [you need to do the work to find the relevant theories]
+
+---
+# Example: Disability Justice
+Concept developed by Queer, BIPOC disabled people
+
+Deeply connected to anti-capitalist politics.
+- You may not agree, but you should be able to explain the principals anyway.
+- We are not defining this, we are learning it.
+
+Let's analyze this model in a design context using the Bennett paper
+
+---
+# Disability Justice Principles (1/10)
+
+1. INTERSECTIONALITY(*) "we are many things, and they all impact us."
+
+[Sins Invalid](https://www.sinsinvalid.org/) disability based performance project defines [10 principles of disability justice](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf) which are:
+
+
+(*) Feminist theorist Kimberlé Crenshaw coined intersectionality in
+1989 to describe the experiences of Black women, who experience both
+racism and sexism.
+
+???
+“We do not live single issue lives†–Audre Lorde.
+
+Ableism, coupled with white supremacy, supported by capitalism, underscored by heteropatriarchy, has rendered the vast majority of the world “invalid.â€
+
+
+
+---
+# Intersectionality in Design:
+
+Ensure that the things we build address multiple disabled people, with varied identities, and multiple disabled people
+
+Bennett paper
+
+---
+# Disability Justice Principles (2/10)
+
+1. INTERSECTIONALITY "we are many things, and they all impact us."
+2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
+
+???
+“We are led by those who most know these systems.†–Aurora Levins Morales
+
+lifting up, listening to, reading, following, and highlighting the perspectives of those who are most impacted by the systems we fight against."
+by centering the
+
+leadership of those most impacted, we keep ourselves grounded in real-world
+problems and find creative strategies for resistance. "
+
+---
+# Leadership of those most impacted
+
+Disability led decisions, not disability dongles. When we design for people with disabilities,
+- People with disabilities are part of the design process (or lead it)
+- The needs of those MOST impacted among that subset come FIRST, then the majority follows
+
+
+
+---
+# Disability Justice Principles (3/10)
+
+1. INTERSECTIONALITY "we are many things, and they all impact us."
+2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
+3. ANTI-CAPITALIST POLITICS "we resist conforming to 'normative' levels
+of productivity in a capitalist culture"
+
+???
+In an economy that sees land and humans as components of profit, we are anti-capitalist by the nature of having non-conforming body/minds.
+
+Capitalism depends on wealth accumulation for some (the white ruling class), at the expense of others... Our worth is not dependent on what and how much we can produce.
+
+---
+# Anti-Capitalist Politics in Design
+
+When we create systems, we make them accessible even though it may cost time and money
+- No segregation, even if it is cheaper to implement
+
+Maybe antithetical to ALT text?
+
+???
+Consider things like disclosure and invisibility
+
+---
+# Disability Justice Principles (4/10)
+
+4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
+
+???
+disability justice lends itself to politics of alliance.
+
+Align with racial justice, reproductive justice, queer and trans liberation, prison abolition, environmental justice, anti-police terror, Deaf activism, fat liberation, and more... challenging white disability communities around racism and challenging other movements to confront ableism.
+
+---
+# Cross-Movement Solidarity in Design
+
+Addressing accessibility isn't enough if we aren't inclusive of other identities
+
+How does this differ from intersectionality?
+
+
+---
+# Disability Justice Principles (5/10)
+
+4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
+
+5) RECOGNIZING WHOLENESS "Disabled people are whole people."
+
+???
+People have inherent worth outside of commodity relations and capitalist notions of productivity. Each person is full of history and life experience.
+
+Each person is full of history and life experience. Each person has an internal
+experience composed of our own thoughts, sensations, emotions, sexual fantasies,
+perceptions, and quirks.
+
+---
+# Recognizing Wholeness in Design
+
+We should include accessibility in all the spaces that people interact with technology, because people with disabilities exist in all of the spaces -- as authors and consumers; programmers and users; and in every area of life
+
+What addition to the Bennett paper would fulfill this?
+
+---
+# Disability Justice Principles (6/10)
+
+4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
+
+5) RECOGNIZING WHOLENESS "Disabled people are whole people."
+
+6) SUSTAINABILITY "pace ourselves, individually and collectively"
+
+???
+We pace ourselves, individually and collectively, to be sustained long term. Our embodied experiences guide us toward ongoing justice and liberation.
+
+to be sustained long-term, value the teachings of our bodies and experiences, and use them as a critical guide and reference point to help us move away from urgency and into a deep, slow, transformative, unstoppable wave of justice and liberation.
+
+---
+# Sustainability in Design
+
+We should work at a pace that includes everyone in the work, and not value the rush products to market over access
+
+
+What addition to the Bennett paper would fulfill this?
+
+
+---
+# Disability Justice Principles (7/10)
+
+4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
+
+5) RECOGNIZING WHOLENESS "Disabled people are whole people."
+
+6) SUSTAINABILITY "pace ourselves, individually and collectively"
+
+7) COMMITMENT TO CROSS-DISABILITY SOLIDARITY "isolation undermines collective liberation"
+
+???
+even and especially those who are most often left out of political conversations. Break down the isolation between people with physical
+impairments, people who are sick or chronically ill, psych survivors and people
+with mental health disabilities, neurodiverse people, people with intellectual or
+developmental disabilities, Deaf people, Blind people, people with environmental
+injuries and chemical sensitivities, and all others who experience ableism and
+isolation that undermines our collective liberation.
+
+---
+# Cross-disability Solidarity in Design
+
+Your turn!
+
+---
+# Disability Justice Principles (8/10)
+
+
+8) INTERDEPENDENCE "We work to meet each other's needs" rather than depending on state solutions
+
+???
+ the liberation of all living systems and the land as integral to the liberation of our own communities, as we all share one planet. We work to meet each other’s needs as we build toward liberation, knowing that state solutions inevitably extend into further control over lives.
+
+
+---
+# Disability Justice Principles (9/10)
+
+
+8) INTERDEPENDENCE "We work to meet each other's needs" rather than depending on state solutions
+
+9) COLLECTIVE ACCESS "We can share responsibility for our access needs ... balance autonomy while being in community"
+
+???
+AS brown, black and queer-bodied disabled people we bring flexibility and creative nuance that go beyond able-bodied/minded normativity, to be in community with each other.
+
+... Access needs aren’t shameful — we all function differently depending on context and environment. Access needs can be articulated and met privately, through a collective, or in community, depending upon an individual’s needs, desires, and the capacity of the group. We can share responsibility for our access needs, we can ask that our needs be met without compromising our integrity, we can balance autonomy while being in community, we can be unafraid of our vulnerabilities, knowing our strengths are respected.
+
+
+---
+# Disability Justice Principles (10/10)
+
+
+8) INTERDEPENDENCE "We work to meet each other's needs" rather than depending on state solutions
+
+9) COLLECTIVE ACCESS "We can share responsibility for our access needs ... balance autonomy while being in community"
+
+10) COLLECTIVE LIBERATION No body or mind can be left behind – only moving together can we accomplish the revolution we require.
+
+???
+We move together as people with mixed abilities, multiracial, multi-gendered, mixed class, across the sexual spectrum, with a vision that leaves no bodymind behind.
+
+--
+
+
+Your turn!
+
+
+---
+# A note on ableist language
+
+.left-column[
+
+
+
+- [SIGACCESS GUIDE](https://www.sigaccess.org/welcome-to-sigaccess/resources/accessible-writing-guide/)
+- [Should I say 'disabled people'](https://dl.acm.org/doi/pdf/10.1145/3517428.3544813)
+
+]
+
+.right-column[
+Identity-first language (“disabled peopleâ€) vs. people-first (“people with disabilitiesâ€). Preferences change depending on region, cultural context, community
+
+Avoid “stricken withâ€, “suffers from†or victimization language
+
+Avoid “able-bodied†or “normal†as differentiating terms
+
+]
+
+
+---
+# Application of Positive Disability Principals to Research Competency
+
+- Is it ableist?
+- What parts of it are accessible? (for example, are both design tools, and their outputs accessible?)
+- Are people with disabilities engaged in guiding this work? At what stages?
+- Does it give control and improve agency for people with disabilities
+- Is it addressing the whole community (intersectionality, multiple disabled people, multiply disabled people)
+
+???
+You should be able to summarize and critique accessibility research, including your own, on the following concerns:
+
+You will be assessed on this based on things like paper summaries and based on your writeup of your final project, as well as our assessment of how well your final project embodies these goals.
+
+
+
+---
+# Disability Model Analysis Competency
+
+We want you to demonstrate an ability to argue for how a given technology or research project, including your own, meets or fails to meet appropriate disability principles drawn from
+- disability studies’ models of disability,
+- disability justice’s 10 principles laid out by Sins Invalid,
+- Liz Jackson’s concept of a disability dongle
+- and so on.
+
+---
+# Paper Analysis Assignment
diff --git a/slides/designing.html b/slides/designing-ugrad.html
similarity index 93%
rename from slides/designing.html
rename to slides/designing-ugrad.html
index 6ad6f49dca3a17a5f20c936c6ca6fe81e28b9508..0489fddc33a31d1f7c08818410e989f65053d539 100644
--- a/slides/designing.html
+++ b/slides/designing-ugrad.html
@@ -22,6 +22,17 @@ class:
## This is an important reminder
## Make sure zoom is running and recording!!!
+---
+# Discussion of Final Project
+- Group project from the start
+- Timing
+- Competencies
+
+---
+# Announcements
+- Your participation grade is 10% of your grade. For equity reasons, a big part of that is based on the weekly survey you fill out. We assume you'll forget once, but please try to be consistent
+- At the end of the quarter we will have to turn your competencies into grades. A reminder that anything which is non-competent pushes your grade down significantly, so make sure you are assessed and at least competent on all the competencies
+- Section Upload ....
---
[//]: # (Outline Slide)
diff --git a/slides/disability-justice.html b/slides/disability-justice.html
deleted file mode 100644
index a1a9e2573391e62c08e6904beb6990c92ff2e6d1..0000000000000000000000000000000000000000
--- a/slides/disability-justice.html
+++ /dev/null
@@ -1,373 +0,0 @@
----
-layout: presentation
-title: Disability Justice --Week 2--
-description: Disability Justice
-class: middle, center, inverse
----
-background-image: url(img/people.png)
-
-.left-column50[
-# Week 2: Disability Justice
-
-
-{{site.classnum}}, {{site.quarter}}
-]
----
-name: normal
-layout: true
-class:
-
----
-# Important Reminder
-
-## This is an important reminder
-## Make sure zoom is running and recording!!!
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- What is Disability Justice
-- Understand terms about and models for disability-centered design
-
----
-# What is Disability Justice
-Concept developed by Queer, BIPOC disabled people
-
-Deeply connected to anti-capitalist politics.
-- You may not agree, but you should be able to explain the principals anyway.
-- We are not defining this, we are learning it.
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY(*) "we are many things, and they all impact us."
-
-
-[Sins Invalid](https://www.sinsinvalid.org/) disability based performance project defines [10 principles of disability justice](https://static1.squarespace.com/static/5bed3674f8370ad8c02efd9a/t/5f1f0783916d8a179c46126d/1595869064521/10_Principles_of_DJ-2ndEd.pdf) which are:
-
-
-(*) Feminist theorist Kimberlé Crenshaw coined intersectionality in
-1989 to describe the experiences of Black women, who experience both
-racism and sexism.
-
-???
-“We do not live single issue lives†–Audre Lorde.
-
-Ableism, coupled with white supremacy, supported by capitalism, underscored by hetero-patriarchy, has rendered the vast majority of the world “invalid.â€
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY "we are many things, and they all impact us."
-2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
-
-???
-“We are led by those who most know these systems.†–Aurora Levins Morales
-
-lifting up, listening to, reading, following, and highlighting the perspectives of those who are most impacted by the systems we fight against."
-by centering the
-
-leadership of those most impacted, we keep ourselves grounded in real-world
-problems and find creative strategies for resistance. "
-
----
-# Disability Justice Principles
-
-1. INTERSECTIONALITY "we are many things, and they all impact us."
-2. LEADERSHIP OF THOSE MOST IMPACTED helps us stay grounded by those we serve
-3. ANTI-CAPITALIST POLITICS "we resist conforming to 'normative' levels
-of productivity in a capitalist culture"
-
-???
-In an economy that sees land and humans as components of profit, we are anti-capitalist by the nature of having non-conforming body/minds.
-
-Capitalism depends on wealth accumulation for some (the white ruling class), at the expense of others... Our worth is not dependent on what and how much we can produce.
-
----
-# Disability Justice Principles
-
-4) CROSS-MOVEMENT SOLIDARITY "Through cross-movement solidarity, we create a united front."
-
-???
-disability justice lends itself to politics of alliance.
-
-Align with racial justice, reproductive justice, queer and trans liberation, prison abolition, environmental justice, anti-police terror, Deaf activism, fat liberation, and more... challenging white disability communities around racism and challenging other movements to confront ableism.
-
---
-5) RECOGNIZING WHOLENESS "Disabled people are whole people."
-
-???
-People have inherent worth outside of commodity relations and capitalist notions of productivity. Each person is full of history and life experience.
-
-Each person is full of history and life experience. Each person has an internal
-experience composed of our own thoughts, sensations, emotions, sexual fantasies,
-perceptions, and quirks.
-
---
-6) SUSTAINABILITY "pace ourselves, individually and collectively"
-
-???
-We pace ourselves, individually and collectively, to be sustained long term. Our embodied experiences guide us toward ongoing justice and liberation.
-
-to be sustained long-term, value the teachings of our bodies and experiences, and use them as a critical guide and reference point to help us move away from urgency and into a deep, slow, transformative, unstoppable wave of justice and liberation.
-
-
---
-7) COMMITMENT TO CROSS-DISABILITY SOLIDARITY "isolation undermines collective liberation"
-
-???
-even and especially those who are most often left out of political conversations. Break down the isolation between people with physical
-impairments, people who are sick or chronically ill, psych survivors and people
-with mental health disabilities, neurodiverse people, people with intellectual or
-developmental disabilities, Deaf people, Blind people, people with environmental
-injuries and chemical sensitivities, and all others who experience ableism and
-isolation that undermines our collective liberation.
-
----
-# Disability Justice Principles
-
-8) INTERDEPENDENCE "We work to meet each other's needs" rather than depending on state solutions
-
-???
- the liberation of all living systems and the land as integral to the liberation of our own communities, as we all share one planet. We work to meet each other’s needs as we build toward liberation, knowing that state solutions inevitably extend into further control over lives.
-
---
-9) COLLECTIVE ACCESS "We can share responsibility for our access needs ... balance autonomy while being in community"
-
-???
-AS brown, black and queer-bodied disabled people we bring flexibility and creative nuance that go beyond able-bodied/minded normativity, to be in community with each other.
-
-... Access needs aren’t shameful — we all function differently depending on context and environment. Access needs can be articulated and met privately, through a collective, or in community, depending upon an individual’s needs, desires, and the capacity of the group. We can share responsibility for our access needs, we can ask that our needs be met without compromising our integrity, we can balance autonomy while being in community, we can be unafraid of our vulnerabilities, knowing our strengths are respected.
-
---
-10) COLLECTIVE LIBERATION No body or mind can be left behind – only moving together can we accomplish the revolution we require.
-
-???
-We move together as people with mixed abilities, multiracial, multi-gendered, mixed class, across the sexual spectrum, with a vision that leaves no bodymind behind.
-
----
-# Case study: One-way Masking
-
-First Person Perspective [FastCompany Article](https://www.fastcompany.com/90790893/im-a-chronically-ill-student-and-one-way-masking-isnt-enough) by a chronically ill Berkeley student who was infected by a stranger who sat down next to them without a mask
-
-.quote[I challenge people who are not at high risk for COVID-19 complications to think about what it must be like trying to attend university (or go into work every day) while also trying to avoid getting COVID-19.]
-
-.quote[Why wouldn’t people wear a mask to protect “vulnerable†members of our community, who are statistically part of every college campus? Why is it always the disabled or chronically ill student or professor who has to ask people to wear masks? Why can’t people just show solidarity? I ask myself these questions daily.]
-
-
----
-# Case study: One-way Masking
-
-- [Masks hide facial expressions & exacerbate racial bias](https://theconversation.com/face-masks-hide-our-facial-expressions-and-can-exacerbate-racial-bias-155250)
-- Masks make lipreading harder
-- Individual risk of severe COVID is [lower for vaccinated people with no risk factors](https://www.cdc.gov/coronavirus/2019-ncov/vaccines/vaccine-benefits.html#:~:text=COVID%2D19%20vaccination%20helps%20protect,associated%20with%20COVID%2D19%20infection.)
-- Political [resistance](https://theconversation.com/mask-wearing-wasnt-disputed-in-previous-crises-so-why-is-it-so-hotly-contested-today-171536) and [beliefs](https://theconversation.com/face-masks-cut-disease-spread-in-the-lab-but-have-less-impact-in-the-community-we-need-to-know-why-147912)
-- Masks protect the wearer
-- Masks also protect people around you, if you are sick
-
-Discuss masking from a disability justice perspective and [post on Ed]({{site.discussion}}/3534307)
-
----
-# Announcements (1/2)
-
-Thanks for your feedback on this week's participation survey
-- Outdated links: Please keep posting them in Ed; we also have a TA checking links in slides and on the schedule page; and we're tryin to put assignments for everything on Canvas to help reduce errors
-- Reading question dates: We've added a due date for answering the reading questions starting this week.
-- Anything else unclear, please tell us.
-- I forgot to repeat questions! I will do this in the future (please feel free to remind me!)
-- I've tried to simplify the website navigation
-- Everyone has two late days on EVERY assignment.
-
----
-# Announcements (1/2)
-
-- For Friday, you will be assigned a room to present in and a slide (of yours) to present. Each room will also have a zoom link.
-- Virdi talk -- look for announcement. We have 25 tickets
-- Any other questions?
-
----
-[//]: # (Outline Slide)
-# Learning Goals for today
-
-- What is Disability Justice
-- **Understand terms about and models for disability-centered design**
-
----
-# Some terms used in Accessibility (1/2)
-
-.left-column50[
-Accommodation-- we've already discussed
-- Co-producing access for all participants in a space or event
-- Legally mandated, but also so much more
-
-]
-.right-column50[
-Ability-Based Design - Jacob Wobbrock
-- Technology that adapts to the abilities of the user in their current context
-
-]
-
----
-# Some terms used in Accessibility (2/2)
-
-.left-column50[
-Universal Design (why is this problematic?)
-- One design works for everybody
-- Typical example: curb cuts
-]
-
-.right-column50[
-Disability Justice Informed Design
-- Design informed by disability justice
-- What we practice in this class
-]
-
----
-# Disability Justice Informed Design (1 / 6)
-
-The **central philosophy** in this class
-
-1) **Intersectionality**: Ensure that the things we build address multiple disabled people, with varied identities, and multiple disabled people
-
----
-# Disability Justice Informed Design (2 / 6)
-
-2) **Leadership of those most impacted**: Disability led decisions, not disability dongles. When we design for people with disabilities,
- - Ideally people with disabilities are part of the design process (or lead it)
- - In this class, we emphasize first person accounts to reduce the burden of asking disabled people to teach us while we are still learning
-
----
-# Disability Justice Informed Design (3 / 6)
-
-3) **Anti-Capitalist Politics**. When we create systems, we make them accessible even though it may cost time and money
-- No segregation, even if it is cheaper to implement
-
-???
-Consider things like disclosure and invisibility
-
----
-# Disability Justice Informed Design (4 / 6)
-
-4) **Cross-Movement Solidarity**. Addressing accessibility isn't enough if we aren't inclusive of other identities
-
----
-# Disability Justice Informed Design (5 / 6)
-
-5) **Recognizing Wholeness**. We should include accessibility in all the spaces that people interact with technology, because people with disabilities exist in all of the spaces -- as authors and consumers; programmers and users; and in every area of life
-
---
-6) **Sustainability**. We should work at a pace that includes everyone in the work, and not value the rush products to market over access
-
----
-# Disability Justice Informed Design (6 / 6)
-
-7) **Cross-disability Solidarity**: Again, we should support multiply disabled (and multiple disabled) people...
-
-8) **Interdependence**: ... and create designs that encourage people (with and without disabilities) to work together to achieve access...
-
-9) **Collective access**: ... and in the process our designs balance agency and control with interdependence and independence
-
-10) **Collective liberation**: ... and leave no one behind in the process
-
----
-background-image: url(img/accessibility/old-phones.jpg)
-
-.left-column[
-## .white[Case Study: The iPhone]
-
-.white[
-MacWorld Keynote '07
-]]
-
-???
-Originally neither universal design nor ability-based design
-
-Here is an [interview (4:03-4:32) with Liz Jackson](https://www.youtube.com/watch?v=uvgXeCe6n10): iPhone screens are a product of accessible technology created from the ingenuity of a disabled person.
-
----
-background-image: url(img/accessibility/jobs-iphone.jpg)
-
-.bottom[
-.white[The phone Jobs is holding is small, flat, and without any tangible information accessible to a blind person]
-]
-
-???
-Originally neither universal design nor ability-based design
-
----
-.left-column[
-## Sliderule:
-
-The first mobile screen reader]
-
-.right-column[
-
-]
----
-## Sliderule:
-
-The first mobile screen reader
-
-![:youtube Sliderule Video, 496IAx6_xys]
-
----
-# Translation to iPhone
-
-.column[
-.centerh[
-
-]
-]
-
-.column[
-.centerh[
-
-]
-]
-
-.column[
-.centerh[
-
-]
-]
-
----
-background-image: url(img/accessibility/iphone-now.png)
-
-# Accessibility in the iPhone Today
-
-
-.left-column60[
-Many pages of accessibility settings
-- VoiceOver – reads what is on screen
-- Speech recognition for controlling device
-- Zoom – screen magnifier – 3 finger tap
-- Closed captions on videos
-- AssistiveTouch – fewer fingers needed, etc.
-- Switch Control (IOS7 and later) [head movement with built in camera](https://www.youtube.com/watch?v=RXF2ThtYXzM) or external switch
-]
-
-???
-
-assistive touch also saves you from pressing the home button
----
-# Analyzing the iPhone from a Disability Justice perspective
-
-Which disability justice principals did the original iPhone fail to meet? What about now?
-
-Small group discussion; Summarize your discussion on [Ed]({{site.discussion}}/3534324)
-
----
-# Disability Justice Homework Assignment
-
-0. Pick an article
-1. Write a 250 word abstract
-2. Select, *define* and write about 3 disability justice principals that are positively, or negatively, represented in that article. Also suggest a remedy if relevant.
-3. Rewrite the abstract in plain language and add it to your handin.
-
----
-
-# Disability Justice Competencies
-- Plain language
-- Disability Justice
diff --git a/slides/formative.html b/slides/formative.html
new file mode 100644
index 0000000000000000000000000000000000000000..3243fde9c4ef1d441e38a2b146e6b7f2b502c240
--- /dev/null
+++ b/slides/formative.html
@@ -0,0 +1,296 @@
+---
+layout: presentation
+title: Formative Inclusive Design Principals
+description: Methods for disability inclusive formative design
+class: middle, center, inverse
+---
+background-image: url(img/people.png)
+
+.left-column50[
+# Formative Inclusive Design Principals
+
+{{site.classnum}}, {{site.quarter}}
+]
+---
+name: normal
+layout: true
+class:
+
+---
+# Important Reminder
+
+## This is an important reminder
+## Make sure zoom is running and recording!!!
+
+
+---
+[//]: # (Outline Slide)
+# Learning Goals for Today
+- What is Accessibility Technology
+- Key Design Principals for Application of Positive Disability Principals to Research
+- Disability Model Analysis of Projects
+
+---
+# My approach to disability inclusion
+
+1. Advocate for the inclusion of people with disabilities in higher education ad research
+2. Seek out and support students who have first person experience with disability (and are also excellent students)
+3. Work to be an ally to them so that they can succeed
+4. Engage with the disability community in selecting problems and sharing results
+5. Include disabled community members who contribute strongly to projects
+
+???
+In my own work, I try to do the following. Can any of this translate?
+
+--
+
+How can we translate this into need-finding? [Ed]({{site.discussion}}/4882184)
+
+
+<!-- --- -->
+<!-- # What is the alternative to disability dongles? -->
+
+<!-- .quote[Disability Dongle: A well intended elegant, yet useless solution to a problem we never knew we had. Disability Dongles are most often conceived of and created in design schools and at IDEO.] [Liz Jackson](https://twitter.com/elizejackson/status/1110629818234818570) -->
+
+<!-- (reminder) -->
+
+<!-- Alternative: Ethical need-finding: Complicated, especially in industry settings -->
+
+---
+# Translating to Need-finding (1/4)
+
+Participatory Design/Research: Emanates from design & technology field, has been specifically used in Assistive Technology & HCI research; and applied in education and healthcare settings; children & older adults
+
+---
+# Translating to Need-finding (2/4)
+
+Participatory Design/Research
+
+- Working directly with users (& other stakeholders) in the design of systems
+
+---
+# Translating to Need-finding (3/4)
+
+Participatory Design/Research
+
+- Working directly with users (& other stakeholders) in the design of systems
+
+- Users are actively involved in setting design goals and planning prototypes
+
+ - Contrasts with methods where user input is sought only after initial concepts and prototypes have been produced (i.e. PD is more than user-testing)
+
+---
+# Translating to Need-finding (4/4)
+
+Participatory Design/Research
+
+- Working directly with users (& other stakeholders) in the design of systems
+
+- Users are actively involved in setting design goals and planning prototypes
+
+- Early and continual participation of intended users to produce better technologies that better suit the needs of users
+
+.footnote[Dr Jane Seale-- School of Education, University of Southampton]
+
+---
+# Participatory Methods in A11y (1/3)
+
+- Aims to engage participants in the design, conduct and evaluation of products/research with the construction of non-hierarchical relations
+ - Participants encouraged to own the outcome by setting the goals and sharing in decisions about processes
+ - “Nothing about me, without meâ€
+
+.footnote[Dr Jane Seale-- School of Education, University of Southampton]
+
+---
+
+# Participatory Methods in A11y (2/3)
+
+- Aims to engage participants in the design, conduct and evaluation of products/research with the construction of non-hierarchical relations
+- Ensures research topic is one that people with disabilities consider worthy of investigation
+ - Asking people with disabilities to act as consultants or advisors to projects
+ - Provision of support, training and payment so that people with disabilities can undertake their own research
+
+
+---
+# Participatory Methods in A11y (3/3)
+
+- Aims to engage participants in the design, conduct and evaluation of products/research with the construction of non-hierarchical relations
+- Ensures research topic is one that people with disabilities consider worthy of investigation
+- Other methods
+ - Narrative research: Life history, biography, oral history
+ - Focus groups, interviews
+ - Action Research
+
+
+---
+# *Accessible* Participatory Methods
+
+- Accessibility doesn't come by accident when planning studies
+- All research should be accessible research (regardless of if it is accessibility research)
+- You have to make your system accessible (using inspection techniques) *before* doing this
+- We will discuss accessibility *for evaluators* and *for participants* today
+
+---
+# Accessible Study Planning Workflow
+
+<div class="mermaid">
+%%{init: {'theme':'base', 'themeVariables': { 'primaryColor': '#4CAF50', 'tertiaryColor': '#009688', 'fontSize': '16px', 'textMargin': '0px', 'text-align': 'left' }}%%
+
+flowchart LR
+
+ A(Identify stakeholders)
+ B(Identify tasks)
+
+ A <--> C
+ B <--> C
+ C <--> D
+ D <--> E
+
+ subgraph Assign tasks
+ C(Access needs
+ Effects of familiarity
+ Personal preferences
+ Institutional constraints)
+ end
+
+ subgraph Plan Accomm.
+ D(Communication
+ Materials
+ Time
+ Space)
+ end
+
+ subgraph Reflect
+ E(Access Synergies
+ Access conflicts
+ Power Dynamics)
+ end
+
+
+classDef default fill:#009688,stroke:#333,stroke-width:2px, color:white;
+classDef reflect fill:#4CAF50,stroke:#333,stroke-width:2px, color:white;
+class A,B,C,D default
+class A,B,C,D,E reflect
+linkStyle default stroke: black,stroke-width:8px
+
+</div>
+
+
+---
+# An Example
+
+Supposed you want to co-design a new directional control system for
+ increased independence among paddlers who are blind.
+
+<img src="https://markbaldw.in/images/coop_in_action.jpg" alt="a blind paddler in a solo outrigger canoe trains with the help of a special remote ruder control device visible as a red box on the bcak of the canoe" width=50%/>
+
+---
+# Tasks List from Anticipate and Adjust
+1. Assign Tasks
+2. Train study team
+3. Handle recruitment
+4. Pilot with people with disabilities
+5. Run the Study
+6. Analyze the data
+
+---
+# Assigning tasks: considerations
+- access needs
+- effects of familiarity with the task
+- personal preferences
+- other institutional constraints
+
+---
+# Training: considerations
+- Ensuring that they address access needs and communication support from recruitment onward
+- Providing basic DEIA training as needed so that all those with participant contact know basics.
+ - Don’t be overly sensitive (don’t overcompensate)
+ - Don’t rely on useless cues (audio/visual) to convey encouragement
+ - Monitor participant fatigue carefully
+ - When to help and when to end a task if participants have trouble
+---
+
+# Recruitment: considerations
+As a person already connected to the disability community, the team determines that Jay will be most likely to be trusted, and to identify opportunities to build trust throughout the recruitment process.
+
+Recruitment typically raises a number of access issues
+- Are your recruitment materials accessible
+- How will you find participants (next slide)
+- How will you compensate participants?
+
+---
+
+# Recruitment: More considerations
+
+Finding participants may require careful work. In this case, a lot of those problems are solved by partnering with a particular community organization. Some considerations:
+- How much do you know about the group your are targeting and what to expect from/of them?
+- Will they see you as trustworthy?
+- Are you giving them enough agency in the study process?
+- Maybe start with gatekeepers
+ - Negotiating access often requires working with gatekeepers
+ - Participants may see researchers as “just another professional, conducting professional surveillanceâ€
+
+---
+# Piloting: Considerations
+
+- First, revisit accommodations plan
+- Next, have sufficient prep time
+ - Hire interpreters (at least 2 weeks in advance)
+ - Print out accessible study materials, consent form, etc
+ - Understand (and possibly prepare) the space that the team will work in
+ - Have compensation ready
+
+---
+# Piloting: Considerations
+
+- First, revisit accommodations plan
+- Next, have sufficient prep time
+- Finally, reflect and iterate to address any new concerns
+
+
+---
+# Running the study: Considerations
+
+The team should be well prepared. However, it is still important to monitor both the team's and the participants' needs and adjust as accessibility concerns arise.
+
+Similar to piloting a study
+
+---
+# Analyze the Data: Considerations
+- Data analysis tools may not be accessible
+- Team members may have different needs with respect to written versus audio transcripts
+- **Member Checking**
+
+---
+# Special Considerations
+
+Children -- Assent versus Consent
+
+Nonspeaking individuals
+- Can be a tendency for support workers to speak on behalf of the person with a
+disability
+
+Find ways to support participants with disabilities to become researchers/designers in their own capacity
+
+Address power dynamics
+
+---
+# Other Concerns to Address
+
+- Accountability and ownership
+ - Designer/Researcher is accountable to the funder- who owns the research agenda?
+
+--
+
+- Moving toward Emancipatory design
+ - Emancipatory design: Brings about a change, emancipation
+ - Designer/Researcher is accountable to participants with disabilities. Their skills are at the disposal of the people with disabilities
+ - Under the control of disabled people and pursued in their interests (Mike Oliver)
+
+
+---
+# Revisiting COOP and discussion
+
+<img src="https://markbaldw.in/images/coop_in_action.jpg" alt="a blind paddler in a solo outrigger canoe trains with the help of a special remote ruder control device visible as a red box on the bcak of the canoe" width=50%/>
+
+Post again on [Ed]({{site.discussion}}/4882320)
diff --git a/slides/introduction-quals.html b/slides/introduction-quals.html
new file mode 100644
index 0000000000000000000000000000000000000000..6d120432f392c13c475f4921d7813bf42b9c17e0
--- /dev/null
+++ b/slides/introduction-quals.html
@@ -0,0 +1,502 @@
+---
+layout: presentation
+title: Introduction and Syllabus
+description: Introductory slides about class structure
+class: middle, center, inverse
+---
+background-image: url(img/people.png)
+
+.left-column50[
+# Introduction & Syllabus
+
+{{site.classnum}}, {{site.quarter}}
+]
+
+---
+name: normal
+layout: true
+class:
+
+---
+# Important Reminder
+
+## This is an important reminder
+## Make sure zoom is running and recording!!!
+
+---
+.left-column-half[
+# Jennifer Mankoff
+
+Pronouns: She/her
+
+[Make4All Lab](http://make4all.org)
+
+I use technology to improve inclusion in
+and accessibility of our digital future.
+
+- Accessibility technology
+- Fabrication
+- Improve inclusion and accessibility
+]
+
+.right-column-half[
+
+
+]
+
+---
+.left-column60[
+# Aashaka Desai
+Pronouns: she/her
+
+PhD Student in the Make4All lab. My research explores d/Deaf and hard-of-hearing communication technology, for example:
+- Speechreading Supports
+- Sign Language Dictionaries
+- Multilingual Captioning
+
+I love anything langauge or languaging related!
+]
+
+.right-column40[
+
+
+
+]
+
+---
+
+# Warm up
+
+<iframe src="https://embed.polleverywhere.com/free_text_polls/NTxtnIG1B8z48hRHmfpLy?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+
+---
+# Let's get to know you!
+
+Discuss with at least two neighbors:
+
+- Do you know whether your favorite app is accessible?
+- Why do you want to learn about accessibility
+
+---
+# Course learning goals:
+
+1. Disability Model Analysis
+2. Familiarity with a Range of Accessibility technologies
+3. Finding First-Person Accounts of Accessibility Tech
+4. Application of Positive Disability Principals to Research
+5. Accessible Document Creation
+6. Accessible Presenting
+7. Image Description
+8. Sharing Research Back: Plain Language Writing
+
+---
+# Course learning goals:
+
+How do we account for access in all of today's technologies?
+- Multi person systems
+- Mobile systems
+- Data Equity: Visualization and Machine Learning
+- Making Accessibility: Fabrication and IOT
+- AR/VR
+- ...
+
+---
+
+# Course learning goals:
+
+How does technology impact access in all the spaces where disabled people are present?
+- Intersectionality with Race, Gender & other identities
+- Sustainability
+- Housing, Unhoused, and Incarcerated
+- Healthcare technology & reproductive justice
+- Higher Education
+- ...
+
+---
+[//]: # (Outline Slide)
+# Learning Goals for today
+- What is Disability?
+- Some Disability Law
+- What are some models of disability?
+- What is Accommodation?
+
+---
+
+
+---
+## Disability: A context-dependent .red[mismatch]
+
+.left-column50[
+**1980**
+
+
+**Disability as a personal attribute**
+"restriction or lack of ability ... within the range considered normal for a human being" (medical model: How do we *fix people*)
+
+]
+
+.left-column50[
+**1990s**
+
+
+**Disability as a social/environmental attribute**
+ "the interaction between features of a person's body and features of the society in which they live" (social model: how do we *fix society*)
+]
+
+---
+# Neither is quite right
+
+- Medical Model (how do we *fix people*)
+- Social Model (how do we *fix society*)
+
+Postmodern: Disability doesn't need to be fixed, but celebrated as part of human variation. Disability pride, disability culture, and disabled joy are all things to support and celebrate.
+
+---
+# Worldwide Stats
+
+1 Billion (~15%) of population [WHO'11]; <br>
+19% of USA [Census'12]
+
+
+| Visual | Hearing | Cognitive | Speech | Mobility | NeuroDiverse | Chronic/Progressive |
+|--------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------|---|
+|  |  |  |  |  |  |  |
+| Ray Charles | Marlee Matlin | Temple Grandin | President Biden | Ali Stroker | Catherine Zeta-Jones | Prof. Stephen Hawking |
+| <i>Colorblind<BR>Visually Impaired<BR>Blind </i> | <i>Hearing loss <BR> Deaf </i>| <i>Dyslexia <BR> Seizure <BR> Learning Disabilities <BR> Autism </i> | <i>Stutter </i> | <i>Quadriplegia </i> | <i>Bipolar<BR>Anxiety<BR>PTSD<BR>Depression </i> | <i>Mix of Impairments</i>|
+
+---
+# Worldwide Stats
+
+1 Billion (~15%) of population [WHO]
+19% of USA [Census'12]
+
+Rates of disability are increasing
+- Long COVID (mass disabling event)
+- Aging population
+- Situational Impairment
+- Increasing numbers of people with chronic illness (can span disability segments)
+
+
+---
+.left-column50[
+
+## Accommodation
+
+Accommodation is your right
+- Co-producing access for all participants in a space or event
+- Sometimes helped by software & media, some [free](https://depts.washington.edu/uwdrs/technology/)
+- Legally mandated, but also so much more
+- Mandated by multiple laws (Why UW has a DRS office)
+- Ongoing and constant legal challenges, especially to the [ADA](http://www.webaim.org/coordination/law/us/ada)
+]
+--
+.right-column50[
+## Some US laws
+- **Individuals with Disabilities Education Act** (IDEA, 1975): Free appropriate public education in the least restrictive environment to every child with a disability.
+- Section 503 of the **Rehab Act** (1973): Equal access to government services
+- **Americans with Disabilities Act** (1990): Equal access to all goods/services
+- 147 countries ratified the **UN convention on rights of PD** (2006)
+]
+
+???
+1996 ADA complaint against San José
+Use of PDF inaccessible to city commissioner
+Web sites are a “service†and thus subject to the ADA
+Led to S. J. Web Page Disability Access Standard
+1999 Natn’l Fed. of the Blind against AOL
+Based on the interpretation of the Web as a place of public accommodation (ADA)
+Settled out of court
+2000: AOL agreed to make its browser accessible
+Many others (http://www.webaim.org/coordination/law/us/ada)
+
+---
+# How is this class accessible? (1/3)
+
+Many disabilities benefit from flexibility in how time is spent
+
+--
+
+In our class this means:
+
+- Competency based grading allows for flexibility in learning and timing
+- Up to 2 late days on every assignment without questions asked.
+- Flexibility in how you participate in class
+
+---
+# How is this class accessible? (2/3)
+
+Sometimes students with disabilities, such as chronic illness or mental health concerns (which are both very common disabilities among college students) may need to participate in class remotely.
+
+**Also** some disabled students may be at high risk for COVID, and should not have to worry that attending class could cause them to become ill.
+
+---
+# How is this class accessible? (2/3)
+
+Sometimes students with disabilities, such as chronic illness or mental health concerns (which are both very common disabilities among college students) may need to participate in class remotely.
+
+In our class, this means:
+- We provide for hybrid participation
+- We provide masks and encourage masking in person
+- We attend class remotely if we have cold, flu, or suspected COVID symptoms
+
+---
+# How is this class Hybrid?
+
+**Attendance is expected**, by everyone in the class (you should not *completely miss* more than 2 classes this quarter)
+
+However we count remote, asynchronous participation toward attendance.
+
+**Remote attendance might be helpful** if:
+- You have cold or flu symptoms or suspect you have COVID
+- You have caregiving / family obligations that affect class or your commute to class
+- You have mental health concerns or any accessibility needs that are best met by being remote
+
+**Use your "complete misses" wisely** e.g. You are traveling to CHI
+
+---
+# How do I participate remotely?
+
+0. You find a zoom buddy
+1. You *attend via Zoom* with the help of your zoom buddy
+2. You *contribute a discussion post to every small group discussion* linked to in the [class schedule/slides]({{site.baseurl}}/schedule)
+3. You fill out the *remote participation survey* portion of the [class participation survey](https://canvas.uw.edu/courses/1665828/assignments/8443511)
+
+If you cannot attend live or synchronously by Zoom, participation means watching the recording and doing (2) and (3) above
+
+---
+# How is this class accessible? (3/3)
+
+We commit to mutually working together to make it accessible.
+- DRS approval is required for some accommodations (specifically, those that are not available to the entire class). We can work you you and [DRS](https://depts.washington.edu/uwdrs/), you don't need to navigate this alone.
+- But many accommodations benefit most students. This is a form of *disability justice* because access to disability documentation and comfort with disclosure are both things that are inequitably distributed
+
+--
+
+In our class, this means that where possible, we provide those as a standard part of the class. To that end...
+
+---
+
+<iframe src="https://embed.polleverywhere.com/discourses/C4L35nDT4JXLiKzESi8s2?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+
+---
+# Small Group Discussion
+
+How would you implement this in your lab or workplace? (post on our [Discussion Board]({{site.discussion}}))
+
+---
+# Other Important Facts about this Class
+
+- **Sharing**: Yes, but don't copy
+- **Plagiarism**: No
+- **Accessibility**: This course is designed to be accessible
+- **Inclusivity**: An important value in this class, and in HCI!
+- **Language**: I am Jen (preferred), or Dr. Mankoff or Prof. Mankoff
+- **Respect**: This class is a compact between us based on respect
+
+---
+# A Note on Academic Integrity
+
+**Academic Integrity**: A course value and requirement See our [Academic Conduct]({{site.baseurl}}/academic-conduct) page for more details
+
+Don't plagiarize. If you use someone else's text, quote them and reference them.
+In addition to being expected based on UW policy, this is a form of [*Citational Justice*](https://dl.acm.org/doi/abs/10.1145/3411763.3450389)
+ and thus an important expression of disability values in our class. Therefore
+
+Detour: ChatGPT rules ([Academic Conduct]({{site.baseurl}}/academic-conduct.html))
+
+---
+# Where to find what
+
+The class is on the [web]({{site.baseurl}}/index),
+ but we have used iframes to connect this to
+ [Canvas]({{site.canvas}}). We try to interlink
+ everything as much as possible.
+
+- Class discussions and all contact with instructors should happen
+either in office hours or through a [class discussion board]({{site.discussion}}) or [staff mailing list]({{site.staff_email}})
+- You can also request appointments for further help
+
+---
+# Prerequisites
+
+- Programming is required the final project, which you define
+- As such, there are no specific language or platform requirements
+- Small programming exercises may also happen in class using languages such as JavaScript and Python. Contact the instructors if you have any concerns about this.
+
+---
+# Grading
+
+Assignment completion and participation makes up 15% of your grade. This includes things like
+- Whether you completed all parts of the assignments
+- Participation in discussion and exercises (self reported)
+- Participation in discussion outside of class (based on submissions to Ed)
+
+--
+However, the biggest part of your grade is your *competencies* (85%).
+We use *competency based grading* because it prioritizes *accessibility* and *justice* and *flexibility* for students.
+
+---
+# What is competency-based grading?
+**Traditional grading** focuses on completion of required tasks
+
+| 80% projects | 10% effort | 10% participation |
+|--|--|
+| .red[learning goal 1] | .red[learning goal 1] | .red[learning goal 1] |
+| learning goal 2 | learning goal 2 | learning goal 2 |
+| learning goal 3 | learning goal 3 | learning goal 3 |
+| ... | ... | ...|
+
+
+---
+# What is competency-based grading?
+**Competency-based grading** focuses on evidence of progress and learning
+
+| learning goal 1 | learning goal 2 | learning goal 3 |
+|--|--|
+| .red[Evidence: HW assignment 1] | Evidence: HW assignment 1 | Evidence: HW assignment 2 |
+| .red[Evidence: HW assignment 2] | Evidence: HW assignment 2 | Evidence: HW assignment 3 |
+| .red[Evidence: HW assignment 4] | Evidence: HW assignment 3 | Evidence: HW assignment 4 |
+| .red[Evidence: Discussion posts] | Evidence: Discussion posts | Evidence: Discussion posts |
+| ... | ... | ...|
+
+
+Teaching and learning are centered around *learning outcomes*. This changes how we plan, assess and grade the course.
+
+---
+# More detail on competencies
+
+Competencies are the core learning goals in this class.
+
+If you learn them all well, you will do well in the class
+
+You will have multiple opportunities to show us you learned them
+
+You can find all of the competencies under "[Outcomes]({{site.canvas}}/outcomes)" on canvas
+
+---
+# How Competencies Translate to a 4.0 scale
+On any competency, you may be rated as below competent, competent or excellent
+
+Base grade: Number of Competents/2.5 + Number of Excellents/2
+Final grade: Base grade - (Number of non competents/2)
+
+Again, this is 85% of your total grade
+
+---
+# Expectations for Ongoing Work
+
+We generally expect you will to achieve competency by the second time you try something, and continue improving to excellence over the quarter.
+- If you achieve excellence, and then stop doing a thing (such as providing alt text), your score may drop.
+- Similarly, if you don't try to do something until the very end of the quarter, even if you do it really well, we may not rate you as highly on that competency.
+
+---
+# Access is also for the teaching staff
+
+One additional note: Once you learn how to make the course more accessible to the teaching staff, we expect accessible documents for grading (e.g. you should always provide ALT text for your images and captioned videos).
+
+---
+# Example of Student Competency (1/2)
+
+
+- The presentation slide deck and your first homework are mostly accessible, however you forget to describe any images. As a result, you score "Not Competent" on image descriptions.
+
+--
+- On your next assignment you take special care with image descriptions. You are marked "Competent" but the TA has some advice on how to be write more specific and useful descriptions
+
+---
+# Example of Student Competency (2/2)
+
+- You want to finish this, so the next time you include an image in a discussion post, you make sure to describe this, and ask the TA to review it. You followed their advice and you are marked "Excellent"
+
+--
+- Over the rest of the quarter, you continue to describe all your images, and maintain "Excellent" in this competency
+
+
+---
+
+# First Assignment: [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
+
+.left-column50[
+- Find one computer access technology
+
+- Find one about "the world"
+
+- Find a description of it *by a disabled person who uses it* (first-person experience)
+
+]
+--
+.right-column50[
+- Try not to pick the same things as your classmates
+- Should include a *first person video*
+- Should try at least one out yourself
+- At least one should involve computers
+- No disability dongles!
+- Nothing too common (like glasses)
+]
+
+---
+# Example 1: AAC (who uses AAC?)
+
+Kit Autie is an AAC user and YouTube Creator.
+The video on the next slide shows the variety of options available over specific strengths
+Kit Autie also [describes why they use AAC and ableist reactions they get when using it](https://www.youtube.com/watch?v=z3YQ9F4SFAQ)
+
+Limitations: "*Languaging*" is a multi-person activity in which people can co-create access (or create ableism around access)
+
+Costs have come way down!! (free with in-app purchases)
+
+---
+# Example 1 Video
+
+![:youtube A first person account of how Kit Autie uses AAC to communicate with a few different types of AAC, Tp6YqFz-Ylo]
+
+---
+# Not a first person account (1)
+
+![:youtube A mom describes how she is teaching her child to communicate using AAC at mealtimes, 9FzbX1z-JAM]
+
+Why is this not a first person account?
+- The AAC user never addresses the audience
+- The AAC user never comments on the experience of using it
+
+
+---
+# Not a first person account (2)
+![:youtube An advertisement for the Tobii Dynavox, tYgMfL-CnGo]
+
+Why is this not a first person account?
+- It is highly scripted
+- It doesn't really review the device at hand
+
+---
+# Borderline
+
+![:youtube A first person account of reasons and factors using audible crosswalks, xPlsYhU1HBU?si=jiklQmTbCUQHRcNI&start=126]
+
+- City-produced video with first person account (see 2:10)
+ - Limitations: Not universally available; Does not support DeafBlind
+- Designed for people with visual impairments to cross the street
+
+---
+# Competencies for [AT Around Us]({{site.baseurl}}/assignments/finding-accessibility.html)
+
+- Accessible presentation creation
+- Finding first person accounts by and for people with disabilities
+- Presenting accessibly to an audience with mixed disabilities
+- Familiarity with a range of accessibility technologies
+
+Handin:
+- One accessible slide per AT (see [Class Discussion]({{site.discussion}}) for slide deck)
+- Reflection & List of Competencies on Canvas
+
+---
+# Field Trip: Other Assignments and Readings
+
+- Reading Questions
+- Reading Summaries (2 each, tied to assignments)
+- Project
+
+(possibly postone to Friday)
+Field trip: [Assignments]({{site.baseurl}}/assignments)
+
+
diff --git a/slides/introduction.html b/slides/introduction-ugrad.html
similarity index 100%
rename from slides/introduction.html
rename to slides/introduction-ugrad.html
diff --git a/slides/plain-language.html b/slides/plain-language.html
index 26b4dc6d000a68a356adbf47721303029b1c3c08..cc42056ce416fbe2ea2d975914451841ab2dc7aa 100644
--- a/slides/plain-language.html
+++ b/slides/plain-language.html
@@ -1,13 +1,13 @@
---
layout: presentation
-title: Plain Language --Week N--
+title: Text Simplification
description: Accessibility
class: middle, center, inverse
---
background-image: url(img/people.png)
.left-column50[
-# Week 2: Plain Language
+# Week 2: Text Simplification
{{site.classnum}}, {{site.quarter}}
]
@@ -27,16 +27,9 @@ class:
---
[//]: # (Outline Slide)
# Learning Goals for today
-- Understanding how to apply plain language guidelines
-- Understanding when to apply plain language guidelines
+- Understanding how to apply text simplification principals to create plain language documents
+- Understanding when to use plain language
----
-# Why Plain Language
-
-Helps make text accessible to the non-scientific public (including disabled people).
-- Important when you do research about people with disabilities
-- Helps make sure that study participants or other interested parties can learn about your research
-- The Plain Writing Act of 2010, described on [plainlanguage.gov](https://www.plainlanguage.gov/law/), "requires federal agencies use clear government communication that the public can understand and use."
---
# Why Plain Language
@@ -44,14 +37,28 @@ Helps make text accessible to the non-scientific public (including disabled peop
Helps make text accessible to the non-scientific public (including disabled people).
Can also directly help someone with an intellectual disability.
-- [WCAG guidelines](https://www.w3.org/WAI/GL/WCAG3/2021/how-tos/clear-words/) state that plain language also "benefit individuals who live with cognitive and learning disabilities, language impairments, memory impairments, and autism."
+- [WCAG guidelines](https://www.w3.org/WAI/GL/WCAG3/2021/how-tos/clear-words/) state that text simplification also "benefit individuals who live with cognitive and learning disabilities, language impairments, memory impairments, and autism."
--
Somewhat different requirements for these different audiences
---
+# When to use Plain Language
+
+- May help with member checking (make sure that study participants or other interested parties can learn about your research)
+- Responsibility to share research you do *on* disabled people *with* disabled people (i.e. back to the public)
+- The Plain Writing Act of 2010, described on [plainlanguage.gov](https://www.plainlanguage.gov/law/), "requires federal agencies use clear government communication that the public can understand and use."
+- Meets WCAG AAA standard ([SC 3.1.5](https://www.w3.org/TR/UNDERSTANDING-WCAG20/meaning-supplements.html))
-# Plain Language Guidelines
+---
+# When Not to use Plain Language
+
+- Scientific paper submissions benefit from clear and concise and readable text, but this is different from text simplifiation
+- WCAG AAA is a very high standard to meet everywhere
+
+---
+
+# Text Simplification Guidelines
We are asking you to focus on this subset
.left-column50[
@@ -125,12 +132,36 @@ We are asking you to focus on this subset
# Use Headers
- Preferably, use headers that are built into platforms (e.g., Google Docs, Microsoft Word, EdStem)
- If those are not available, styling text in bold or underlined can still help visual readers
-- Live Demo!
---
-# Plain Language Resources
+# Text Simplification Resources
- If you have any questions or want examples about any of these concepts, you can look at the [PlainLanguage.gov website](https://www.plainlanguage.gov/guidelines/).
+---
+
+# Text Simplification Competency (1/2)
+
+Please pick at least four guidelines to focus on from the following list and specify which four you picked. You can address more to reach a higher competency score. Follows best practices for plain language writing as described on the federal plain language website
+How this will be assessed: You should tell us when you use plain language writing, and ask us to assess. There will be multiple opportunities to do this during the quarter.
---
+# Text Simplification Competency (2/2)
+
+- Use simple words
+- Use positive language
+- Use short paragraphs
+- Use short sentences
+- Avoid jargon
+- Use active voice
+- Use present tense
+- Use examples
+- Use headers
+- Use transition words
+
+---
+# Plain Language Assignment
+
+Write a plain language abstract of a research paper abstract using text simplification (of an assigned reading)
+
+We'll pick papers on Friday
diff --git a/slides/presenting-accessibly.html b/slides/presenting-accessibly.html
index 2ccac46c5660c1565892e25eab6bbf9f0a9d5ff4..358ab286d2f89b84a1a7bd62ef8cf263303ba501 100644
--- a/slides/presenting-accessibly.html
+++ b/slides/presenting-accessibly.html
@@ -1,22 +1,20 @@
---
layout: presentation
-title: Presenting Accessibly --Week N--
+title: Document and Presentation Accessibility
description: Information on how to present accessibly
class: middle, center, inverse
---
background-image: url(img/people.png)
.left-column50[
-# Welcome to the Future of Access Technologies
-
-Week 2, Presenting Accessibly
+# Document and Presentation Accessibility
{{site.classnum}}, {{site.quarter}}
]
---
name: normal
layout: true
-class:
+class:
---
# Important Reminder
@@ -27,228 +25,355 @@ class:
---
[//]: # (Outline Slide)
-# Learning Goals for this slide deck
+# Learning Goals for Today
+- Creating Accessible Presentations and Documents
- Presenting Accessibly
+- Discussion of Readings
----
-# Presenting Accessibly
-
-- First, make your slides accessible
-- Also share them at least 24 hrs ahead of the presentation (required to pass this competency, built into the assignment this week)
+Not on the list: [Making PDFs
+accessible](https://www.washington.edu/accesstech/documents/). We may
+offer an out-of-class tutorial though!
---
-# When presenting
+# First: When presenting live (1/2)
- Speak slowly and clearly
- Read entire quotes
- Describe images and videos
- Non-verbal content should be described (in the video, or by you)
-Today: Pay attention and raise your hand when I fail to do this! If you catch me, you get a surprise :).
-
---
-# Slide Show Basics (1/9)
-
-Image Descriptions
+# First: When presenting live (1/2)
-- Short description overviews image
-- Long description more complete
-- Not redundant with what access tools (e.g. screen reader) already tell the user (i.e. the type of an element such as "button" or "image" is not useful to include in ALT text)
+Also share your (accessible) slides at least 24 hrs ahead of the
+presentation
-We'll talk about this a lot this quarter because images, diagrams, videos, charts, and GUIs all require different types of descriptions.
-Today we will focus on photographs, because you will probably have them in your decks
+Today: Pay attention and raise your hand when I fail to do this! If you catch me, you get a surprise :).
---
-# Describing photographs (1/2)
+# Document Basics (1/11)
-- Automated tools are not enough.
+- Use structure properly
+ - Use header styles to correctly label things
+ - Don't skip header levels
+ - Headings should form an outline of the page content
+ - Use unique slide titles (makes navigation easier)
+ - Use lists to identify all content that can be described as a list of something
+ - Use tables used for content (not layout) and label their headers properly
+
+???
+update styles to make them look good
+use 1/n for slide titles
-
-
-
+---
+# Document Basics (2/11)
-Is this meant to represent a maple leaf? or Canada? How would you describe the differences between these images if all are present? Only one?
+- Use structure properly
+- Color contrast
+.left-column50[
+WCAG Level AAA requires a contrast ratio of at least
+- .contrast71[7:1 for normal text]
+- .contrast41[4.5:1 for large text (14t pt bold or larger)]
+- .badcontrast[Avoid anything else!]
+]
+.right-column50[
+- [Colorzilla](https://chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp?hl=en) is an excellent tool for extracting the color value from any page element;
+- WebAIM has a [contrast checker](https://webaim.org/resources/contrastchecker/#:~:text=WCAG%20Level%20AAA%20requires%20a,value%20from%20any%20page%20element)
+]
???
-Although technology is getting better at recognizing what an image depicts, algorithms alone cannot understand what an image means within the context of the overall page. A maple leaf might represent Canada, or it might just illustrate the leaf of a tree. Web page authors must provide alternative text that represents the content and function of their images.
+Choose colors that provide enough contrast between content and the background so that anyone with low-vision impairments and color deficiencies can perceive the content.
---
-# Describing photographs (2/2)
+# Document Basics (3/11)
-- Automated tools are not enough.
-- Depends on setting. [Stangl et al, 2020](https://dl.acm.org/doi/pdf/10.1145/3308558.3313605) asked BLV people about News; SNS; eCommerce; Employment; Dating; Productivity and E-Publication). Includes a table of what to include when
- - Always include whether people are present; any text; names of objects present
- - Usually include activity; building features (if present); landmarks
+<style>.times {font-family:Times !important;}</style>
-.left-column50[
- ]
-.right-column50[
-.quote[A realistic image of a canadian flag with a red maple leaf on a white background. Shadows and curves suggest it is blowing in the wind. Nothing other than the flag is visible]]
+- Use structure properly
+- Color contrast
+- San serif fonts
+ - This is a san serif font
+ - .times[This is a serif font]
+
+???
+
+San serif is considered easier on the eyes for screen presentations;
+
+Serif is easier for printed documents
---
-# When to Describe Identity
-[Bennett et al](https://dl.acm.org/doi/10.1145/3411764.3445498) interviewed BIPOC, Non-Binary and/or Transgender Blind people.
-.left-column60[
-![:youtube a video describing the results of a study with people with disabilities with intersectional identities about their preferences for how to describe diverse people in image descriptions,By6nzFefcxs]
-]
-.right-column40[
-- Meeting new people
-- Identity is the topic of discussion
-- Seeking specific first person perspectives
-- Want/need to understand representation in the media
-- Need to "read" a room, for example to decide whether to code switch
-]
+# Document Basics (4/11)
+
+- Use structure properly
+- Color contrast
+- San serif fonts
+- Simplify language
+ - Simplify your slide
+ - Embellish when you speak
+ - Avoid clutter
+
---
-# How to Describe Identity
+# What is clutter?
-.left-column40[
-
-]
-.right-column60[
-- Ok to mention race, gender, and disability status in that case
-- Otherwise use appearance (skin color, "person" instead of gender, AT use but not disability status)
+Please, for the love of all that is good on this fine planet we call home, do not do this to your poor audience members
+They don’t deserve this! What did they do to you? They probably flew hundreds of miles and of all talks and things to do in this new place came to YOUR presentation. And what do you do? You greet them with this GIANT wall of text! How rude. It’s ugly to look at. It’s hard to read. It’s annoying as heck for me to type out this thing just to make a point!
-.quote[Lezlie, a white woman, looks at us full front with curls down one size of her head and her long sleeve rolled up just on that side of a cowl neck wild abstract print shirt. Her smiling cheeks greet us.]
-]
-Original announcement: Dr. Lezlie Frye has won [an award] for .red[her] paper; alt text (probably) written with her input.
+So please, don’t do this to your audience members. Be a responsible presenter. Practice your talks so you don’t have to read off the slide (or use speaker notes! also okay!). Break up your content so looking at your slides isn’t like getting smacked in the face with a wall of text.
+
+**But there are exceptions! (e.g., if you have a thick accent)**
---
-# ALT Text with Identity Markers?
+# Document Basics (5/11)
+.left-column50[
+- Use structure properly
+- Color contrast
+- San serif fonts
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+]
+.right-column50[
+<i class="red fa fa-times-circle fa-1x" aria-hidden="true"></i> “required fields are in redâ€
-.left-column40[
-]
+<i class="red fa fa-times-circle fa-1x " aria-hidden="true"></i> Wrong: “click the circle on the rightâ€
-.right-column60[
-<iframe src="https://embed.polleverywhere.com/free_text_polls/dVkKqIvPJ2rYY6uRZP1Ip?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+<i class="green fa fa-check fa-1x" aria-hidden="true"></i> Correct: "required fields are labeled 'Required' and colored red"
]
---
-# Bennet et al's description:
+# Document Basics (6/11)
-.left-column40[
-]
-
-.right-column60[
-.quote[A Black; disabled; non-binary person with a face mask walks down a neighborhood street with one hand in their pocket and the other hand on their cane. They have a short mohawk and are wearing a jacket; shorts; tennis shoes; and glasses]
+.left-column50[
+- Use structure properly
+- Color contrast
+- San serif fonts
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
]
---
-# When presenting
+# Document Basics (7/11)
+
+.left-column50[
+- Use structure properly
+- Color contrast
+- San serif fonts
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
+]
-How much to describe images
+--
+.right-column50[
+- Links should be labeled appropriately, as described [here](https://www.washington.edu/accesstech/courses/canvas/links/).
+]
-Can a BVI person follow your presentation and get the same information as someone without any visual impairment?
+--
+.right-column50[
+Just kidding! as described on the [UW page explaining meaningful link text](https://www.washington.edu/accesstech/courses/canvas/links/)
+]
---
-# Slideshow Basics (2/9)
+# Document Basics (8/11)
-- Image descriptions
-- Use structure
- - Use header styles to correctly label things; update styles to make them look good
- - Don't skip header levels
- - Use unique slide titles
- - makes navigation easier
- - put (x of y) in the title if repeating
- - Check slide order (like DOM order)
+.left-column50[
+- Use structure properly
+- Color contrast
+- San serif fonts
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
+]
+
+.right-column50[
+- Links should be [labeled appropriately](https://www.washington.edu/accesstech/courses/canvas/links/).
+- Provide a document title that describes its topic or purpose
+]
---
-# Slideshow Basics (3/9)
+# Document Basics (9/11)
-- Image descriptions
-- Use headers & styles
+.left-column50[
+- Use structure properly
- Color contrast
- - We'll talk about this more, but you can use [a color contrast checker](https://webaim.org/resources/contrastchecker/) to make sure that people with color blindness or other color-related accessibility needs can read your slides
+- San serif fonts
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
+]
+.right-column50[
+- Links should be [labeled appropriately](https://www.washington.edu/accesstech/courses/canvas/links/).
+- Provide a document title that describes its topic or purpose
+- Allow users to bypass blocks of content that are irrelevant or often repeated (e.g., bookmarks in a PDF)
+]
---
-# Slideshow Basics (4/9)
-
-<style>.times {font-family:Times !important;}</style>
+# Document Basics (10/11)
-- Image descriptions
-- Use headers & styles
+.left-column50[
+- Use structure properly
- Color contrast
- San serif fonts
- - This is a san serif font
- - .times[This is a serif font]
+- Simplify language
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
+]
-San serif is considered easier on the eyes for screen presentations
+.right-column50[
+- Links should be [labeled appropriately](https://www.washington.edu/accesstech/courses/canvas/links/).
+- Provide a document title that describes its topic or purpose
+- Allow users to bypass blocks of content that are irrelevant or often repeated (e.g., bookmarks in a PDF)
+- Identify the language of the document (or individual parts of af multilingual document).
+]
---
-# Slideshow Basics (5/9)
+# Document Basics (11/11)
-- Image descriptions
-- Use headers & styles
+.left-column50[
+- Use structure properly
- Color contrast
- San serif fonts
- Simplify language
- - Simplify your slide
- - Embellish when you speak
- - Avoid clutter
+- Don't use color or other visual characteristics to convey meaning
+- Ensure that the tab and reading order are logical and intuitive
+]
+
+.right-column50[
+- Links should be [labeled appropriately](https://www.washington.edu/accesstech/courses/canvas/links/).
+- Provide a document title that describes its topic or purpose
+- Allow users to bypass blocks of content that are irrelevant or often repeated (e.g., bookmarks in a PDF)
+- Identify the language of the document (or individual parts of af multilingual document).
+- Provide ALT text
+]
---
-# What is clutter?
+# How to Write ALT Text (1/2)
+Image descriptions should be concise, complete and accurate. You should use best practices to decide when to mention the background, describe people, and so on.
-Please, for the love of all that is good on this fine planet we call home, do not do this to your poor audience members
+---
+# How to Write ALT Text (1/2)
-They don’t deserve this! What did they do to you? They probably flew hundreds of miles and of all talks and things to do in this new place came to YOUR presentation. And what do you do? You greet them with this GIANT wall of text! How rude. It’s ugly to look at. It’s hard to read. It’s annoying as heck for me to type out this thing just to make a point!
+Read up on some of these links when you are faced with specific description needs
+.left-column50[
+- [Decorative and branding](https://dl.acm.org/doi/pdf/10.1145/3308558.3313605)
+- Formatting and text styling
+- Images as links
+- [Diagrams](https://ieeexplore.ieee.org/stamp/stamp.jsp?arnumber=9028522&casa_token=zZw_rYBgu1AAAAAA:eozpbJ-vvMZjQNt8p6WU91X4uFumPs-yVuMn4PTPRjyMhtsVrprdIEe1JfYOCUdv8SFP_TGd9s965Q&tag=1)
+- [Visualizations](https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=9555469)
+- [Memes](https://dl.acm.org/doi/10.1145/3308561.3353792)
+- [GUIS](https://dl.acm.org/doi/10.1145/3411764.3445040)
+]
+.right-column50[
+- Animations/Videos (we'll talk more about this later today)
+- AR/VR ([Accessibility, Disabilities, and VR](https://educatorsinvr.com/2019/05/31/accessibility-disabilities-and-virtual-reality-solutions/))
+- [Comparison of IoS and Android Rich Interactions](https://dl.acm.org/doi/pdf/10.1145/2851613.2851680?casa_token=dOz4huS0TUkAAAAA:zv0PjZk3-T8Bb4X2SfNpdZFuqO2u9v1jpWn5fq0hKZ0se6t5g0oMKLfrAmhlyufcw_3AuJ-ABZ2yWQ)
+- ...
+]
-So please, don’t do this to your audience members. Be a responsible presenter. Practice your talks so you don’t have to read off the slide (or use speaker notes! also okay!). Break up your content so looking at your slides isn’t like getting smacked in the face with a wall of text.
+???
-**But there are exceptions! (e.g., if you have a thick accent)**
+All of these require different strategies to describe them well.
+Read up on some of these links when you are faced with specific description needs
---
-# Slideshow Basics (6/9)
+# How to Describe Identity (1/2)
-- Image descriptions
-- Use structure
-- Color contrast
-- San serif fonts
-- Simplify language
-- Don't use color to convey meaning
+.left-column40[
+
+]
+.right-column60[
+- Ok to mention race, gender, and disability status in that case
+- Otherwise use appearance (skin color, "person" instead of gender, AT use but not disability status)
+
+Original announcement: Dr. Lezlie Frye has won [an award] for .red[her] paper; alt text (probably) written with her input.
+]
---
-# Slideshow Basics (7/9)
+# How to Describe Identity (1/2)
-- Image descriptions
-- Use structure
-- Color contrast
-- San serif fonts
-- Simplify language
-- Don't use color to convey meaning
+.left-column40[
+
+]
+.right-column60[
+
+.quote[Lezlie, a white woman, looks at us full front with curls down one size of her head and her long sleeve rolled up just on that side of a cowl neck wild abstract print shirt. Her smiling cheeks greet us.]
+]
+
+---
+# ALT Text with Identity Markers?
+
+.left-column40[
+]
+
+.right-column60[
+<iframe src="https://embed.polleverywhere.com/free_text_polls/htJZwY5gCkiqZql0ZyZyT?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+]
+
+---
+# Bennet et al's description:
+
+.left-column40[
+]
+
+.right-column60[
+.quote[A Black; disabled; non-binary person with a face mask walks down a neighborhood street with one hand in their pocket and the other hand on their cane. They have a short mohawk and are wearing a jacket; shorts; tennis shoes; and glasses]
+]
+
+---
+# Some Presentation Specific Notes (1/4)
+
+- Describe images with equity in mind
+ - Can a BVI person follow your presentation and get the same information as someone without any visual impairment?
+
+---
+# Some Presentation Specific Notes (2/4)
+
+- Describe images with equity in mind
- 9/10, you don’t need sound effects or visual effects
---
-# Slideshow Basics (8/9)
+# Some Presentation Specific Notes (3/4)
-- Image descriptions
-- Use structure
-- Color contrast
-- San serif fonts
-- Simplify language
-- Don't use color to convey meaning
+- Describe images with equity in mind
- 9/10, you don’t need sound effects or visual effects
- Make sure videos are accessible
- Videos should be captioned (at a minimum)
- Videos should be audio described (ideally)
---
-# Slideshow Basics (9/9)
+# Some Presentation Specific Notes (4/4)
-- Image descriptions
-- Use structure
-- Color contrast
-- San serif fonts
-- Simplify language
-- Don't use color to convey meaning
+- Describe images with equity in mind
- 9/10, you don’t need sound effects or visual effects
- Make sure videos are accessible
- Leave space for captions
+
+---
+# In Class Exercise
+- Work on a description of the image you brought. Be sure to address things like identity in a way that feels comfortable to you.
+- Share it with a neighbor, then show them the image. Get feedback
+- Swap and repeat.
+- Post in the [class discussion board]({{site.discussio}})
+
+---
+# How to add ALT Text to various things
+
+- HTML ```img src=... alt="Girl in a jacket" width="500" height="600"'''
+- "Content Creation Platforms" (e.g. wordpress, twitter)
+- Google Slides & Powerpoint
+- Word Documents
+- Any other questions?
+
+---
+# "Homework" (do in class if possible)
+- Find an image of yourself online in a place you can edit*
+- Update it to have ALT text
+- If there is not an image of yourself that is editable, select someone else who is on a website you can edit or ask them to edit
+ - I suggest a faculty member from the UW CSE faculty page whose image does not include ALT text
+ - generate ALT text and check if they are ok with the description you generated.
+ - I will help update the page once they approve (for CSE faculty)
diff --git a/slides/sustainability.html b/slides/sustainability.html
index ee6d8fb4a5bf915c523ee6915d4890654dedeb8c..52a11c08421f3c2a5401b3cd895ea80ca5e3742a 100644
--- a/slides/sustainability.html
+++ b/slides/sustainability.html
@@ -50,7 +50,7 @@ Quote from “Disability, Climate Change, and Environmental Violence: The Politi
---
-# A disability-informed technology agenda for addressing the climate crisis (1/10)
+# A disability-informed climate agenda (1/10)
- Government Services & Civic Engagement
@@ -58,7 +58,7 @@ Essential to changing how we address climate change,
and implementation of the same
---
-# A disability-informed technology agenda for addressing the climate crisis (2/10)
+# A disability-informed climate agenda (2/10)
- Government Services & Civic Engagement
- Process Accessibility
@@ -106,7 +106,7 @@ This differentially impacts people of color, low-income people and people with d
]
---
-# A disability-informed technology agenda for addressing the climate crisis (3/10)
+# A disability-informed climate agenda (3/10)
- Government Services & Civic Engagement
- Accessibility must be considered in the government response to climate change. Accessibility can impact safety, civic engagement, access to services, and who is included in the democratic process
@@ -115,7 +115,7 @@ This differentially impacts people of color, low-income people and people with d
- Give responsibility for support to governmental context
---
-# A disability-informed technology agenda for addressing the climate crisis (4/10)
+# A disability-informed climate agenda (4/10)
- Government Services & Civic Engagement
- Education
@@ -125,7 +125,7 @@ This differentially impacts people of color, low-income people and people with d
- Also generally not designed to include people with disabilities
---
-# A disability-informed technology agenda for addressing the climate crisis (5/10)
+# A disability-informed climate agenda (5/10)
- Government Services & Civic Engagement
- Education
@@ -135,7 +135,7 @@ This differentially impacts people of color, low-income people and people with d
- Lots of improvement possible -- disabled students felt MUCH more supported during COVID [TACCESS 2022]
---
-# A disability-informed technology agenda for addressing the climate crisis (6/10)
+# A disability-informed climate agenda (6/10)
- Government Services & Civic Engagement
- Education
@@ -146,7 +146,7 @@ This differentially impacts people of color, low-income people and people with d
- Can change the balance of power
---
-# A disability-informed technology agenda for addressing the climate crisis (7/10)
+# A disability-informed climate agenda (7/10)
- Government Services & Civic Engagement
- Education
@@ -187,7 +187,9 @@ More likely to include people of color and immigrants/refugees
Spend greater percentages of income on energy
---
-<iframe src="https://embed.polleverywhere.com/free_text_polls/6BulXYeFmPsbUKKaVsFzf?controls=none&short_poll=true" width="800px" height="600px"></iframe>
+# What do you wish you'd known about your current housing?
+
+[small group discussion]
---
# What did we find in our studies?
@@ -226,13 +228,13 @@ Spend greater percentages of income on energy
Not really targeted at renters (30% in US; 1-5 year turnover)
-Paucity of information about factors prospective tenants care about
+Paucity of information about factors prospective tenants care about
- Actual cost
- Sunlight & noise
- Housing quality
---
-# Other data could address intersectional issues
+# Missing rich intersectional data
Housing choices linked to health outcomes & disability (lead, asthma, mold, air quality, etc.)
@@ -243,7 +245,7 @@ Sunlight [crowdsourced comparable estimates] -- impacts health & energy use
Noise -- impacts health/disability & comfort
---
-# A disability-informed technology agenda for addressing the climate crisis (8/10)
+# A disability-informed climate agenda (8/10)
- Government Services & Civic Engagement
- Education
@@ -327,7 +329,7 @@ Sidewalks, public transit, and businesses can be inaccessible to those with disa
---
# Urban Accessibility and Mobility
-Sidewalks, public transit, and businesses can be inaccessible to those with disabilities. Three-fold aim [All work by Froehlich & Caspi]:
+Sidewalks, public transit, and businesses can be inaccessible to those with disabilities. [Work by Froehlich & Caspi]:
1. Develop scalable techniques to map and assess every sidewalk, transit stop, and business in the world
3. Create new digital tools that provide personalized routing, government accountability, and support new urban analytics.
3. Examine geo-spatial patterns of and influences on urban accessibility, barriers and facilitators of accessible infrastructure, and socio-cultural contexts of urban access across the globe.
@@ -340,7 +342,7 @@ Sidewalks, public transit, and businesses can be inaccessible to those with disa
.corner-ribbon.tr[COMPASS 2021]
---
-# A disability-informed technology agenda for addressing the climate crisis (9/10)
+# A disability-informed climate agenda (9/10)
- Government Services & Civic Engagement
- Education
@@ -374,7 +376,7 @@ Makers; recipients; clinicians in seven countries
- Chile (E-Nable)
- Costa Rica (E-Nable)
- Brazil (E-Nable with government)
-- France (E-Nable
+- France (E-Nable)
---
# Key differences between U.S. and other countries
@@ -387,7 +389,7 @@ Makers; recipients; clinicians in seven countries
- Follow up included in process
- Legal context more forgiving?
---
-# A disability-informed technology agenda for addressing the climate crisis (10/10)
+# A disability-informed climate agenda (10/10)
- Government Services & Civic Engagement
- Education