Skip to content

Commit

Permalink
Add image roles and title information to accommodation icons
Browse files Browse the repository at this point in the history
  • Loading branch information
devowhippit committed May 5, 2022
1 parent 5d22e21 commit a42645a
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 15 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -1306,7 +1306,7 @@
const __vue_script__ = script;

/* template */
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('article',{staticClass:"c-card"},[_c('header',{staticClass:"c-card__header"},[_c('a',{staticClass:"c-card__header-link",attrs:{"data-js":'post-' + _vm.post.id,"href":_vm.post.link}},[_c('h3',{staticClass:"c-card__title",domProps:{"innerHTML":_vm._s(_vm.post.context.program_plain_language_title)}})]),_vm._v(" "),_c('p',{staticClass:"c-card__subtitle text-alt mb-1"},[_c('b',{attrs:{"data-program":"title"},domProps:{"innerHTML":_vm._s(_vm.post.context.program_title)}}),_vm._v(" "),_c('span',[_vm._v(" "+_vm._s(_vm.strings.BY)+" ")]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.program_agency)}})])]),_vm._v(" "),_c('div',{staticClass:"c-card__body"},[(_vm.post.status)?_c('p',{staticClass:"c-card__status flex items-center"},[(_vm.post.context.status.recruiting)?_c('mark',{staticClass:"badge mie-2",attrs:{"data-program":"recruiting"}},[_vm._v("\n "+_vm._s(_vm.post.context.status.recruiting.name)),_c('span',{staticClass:"sr-only"},[_vm._v(".")])]):_vm._e(),_vm._v(" "),(_vm.post.context.status.disability)?_c('span',{staticClass:"flex mie-2",attrs:{"title":_vm.post.context.status.disability.name}},[_c('svg',{staticClass:"icon text-em",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#icon-wnyc-accessible"}})]),_vm._v(" "),_c('span',{staticClass:"sr-only"},[_vm._v(_vm._s(_vm.post.context.status.disability.name))])]):_vm._e(),_vm._v(" "),(_vm.post.context.status.disability)?_c('span',{staticClass:"sr-only"},[_vm._v(" ")]):_vm._e(),_vm._v(" "),(_vm.post.context.status.language)?_c('span',{staticClass:"flex me-2",attrs:{"title":_vm.post.context.status.language.name}},[_c('svg',{staticClass:"icon-wnyc-ui text-em",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#icon-wnyc-translate"}})]),_vm._v(" "),_c('span',{staticClass:"sr-only"},[_vm._v(_vm._s(_vm.post.context.status.language.name))])]):_vm._e()]):_vm._e(),_vm._v(" "),_c('div',{staticClass:"c-card__summary"},[_c('p',[(_vm.post.context.intro)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.intro)}}):_vm._e(),_vm._v(" "),(_vm.post.context.populations)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.populations)}}):_vm._e()])]),_vm._v(" "),_c('ul',{staticClass:"c-card__features"},[(_vm.post.context.services)?_c('li',{staticClass:"flex items-center"},[_c('svg',{staticClass:"icon-wnyc-ui flex-shrink-0 mie-1",attrs:{"role":"img"}},[_c('title',[_vm._v(_vm._s(_vm.strings.SERVICES))]),_vm._v(" "),_c('use',{attrs:{"href":"#feather-award"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.services)}})]):_vm._e(),_vm._v(" "),(_vm.post.context.schedule)?_c('li',{staticClass:"flex items-center"},[_c('svg',{staticClass:"icon-wnyc-ui flex-shrink-0 mie-1",attrs:{"role":"img"}},[_c('title',[_vm._v(_vm._s(_vm.strings.SCHEDULE))]),_vm._v(" "),_c('use',{attrs:{"href":"#feather-calendar"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.schedule)}})]):_vm._e()]),_vm._v(" "),_c('a',{staticClass:"c-card__cta",attrs:{"href":_vm.post.link}},[_c('svg',{staticClass:"icon-wnyc-ui rtl:flip",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#feather-arrow-left"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.strings.LEARN_MORE_ABOUT.replace('{{ program }}', _vm.post.context.program_plain_language_title))}}),_vm._v(" "),_c('svg',{staticClass:"icon-wnyc-ui rtl:flip",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#feather-arrow-right"}})])]),_vm._v(" "),(_vm.post.raw)?_c('details',[_c('summary',[_vm._v("Raw")]),_vm._v(" "),_c('pre',{attrs:{"tabindex":"-1"}},[_vm._v(_vm._s(_vm.post.raw))])]):_vm._e()])])};
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('article',{staticClass:"c-card"},[_c('header',{staticClass:"c-card__header"},[_c('a',{staticClass:"c-card__header-link",attrs:{"data-js":'post-' + _vm.post.id,"href":_vm.post.link}},[_c('h3',{staticClass:"c-card__title",domProps:{"innerHTML":_vm._s(_vm.post.context.program_plain_language_title)}})]),_vm._v(" "),_c('p',{staticClass:"c-card__subtitle text-alt mb-1"},[_c('b',{attrs:{"data-program":"title"},domProps:{"innerHTML":_vm._s(_vm.post.context.program_title)}}),_vm._v(" "),_c('span',[_vm._v(" "+_vm._s(_vm.strings.BY)+" ")]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.program_agency)}})])]),_vm._v(" "),_c('div',{staticClass:"c-card__body"},[(_vm.post.status)?_c('p',{staticClass:"c-card__status flex items-center"},[(_vm.post.context.status.recruiting)?_c('mark',{staticClass:"badge mie-2",attrs:{"data-program":"recruiting"}},[_vm._v("\n "+_vm._s(_vm.post.context.status.recruiting.name)),_c('span',{staticClass:"sr-only"},[_vm._v(".")])]):_vm._e(),_vm._v(" "),(_vm.post.context.status.disability)?_c('span',{staticClass:"flex mie-2",attrs:{"title":_vm.post.context.status.disability.name}},[_c('svg',{staticClass:"icon text-em",attrs:{"role":"img"}},[_c('title',{domProps:{"innerHTML":_vm._s(_vm.post.context.status.disability.name)}}),_vm._v(" "),_c('use',{attrs:{"href":"#icon-wnyc-accessible"}})])]):_vm._e(),_vm._v(" "),(_vm.post.context.status.disability)?_c('span',{staticClass:"sr-only"},[_vm._v(" ")]):_vm._e(),_vm._v(" "),(_vm.post.context.status.language)?_c('span',{staticClass:"flex me-2",attrs:{"title":_vm.post.context.status.language.name}},[_c('svg',{staticClass:"icon-wnyc-ui text-em",attrs:{"role":"img"}},[_c('title',{domProps:{"innerHTML":_vm._s(_vm.post.context.status.language.name)}}),_vm._v(" "),_c('use',{attrs:{"href":"#icon-wnyc-translate"}})])]):_vm._e()]):_vm._e(),_vm._v(" "),_c('div',{staticClass:"c-card__summary"},[_c('p',[(_vm.post.context.intro)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.intro)}}):_vm._e(),_vm._v(" "),(_vm.post.context.populations)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.populations)}}):_vm._e()])]),_vm._v(" "),_c('ul',{staticClass:"c-card__features"},[(_vm.post.context.services)?_c('li',{staticClass:"flex items-center"},[_c('svg',{staticClass:"icon-wnyc-ui flex-shrink-0 mie-1",attrs:{"role":"img"}},[_c('title',[_vm._v(_vm._s(_vm.strings.SERVICES))]),_vm._v(" "),_c('use',{attrs:{"href":"#feather-award"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.services)}})]):_vm._e(),_vm._v(" "),(_vm.post.context.schedule)?_c('li',{staticClass:"flex items-center"},[_c('svg',{staticClass:"icon-wnyc-ui flex-shrink-0 mie-1",attrs:{"role":"img"}},[_c('title',[_vm._v(_vm._s(_vm.strings.SCHEDULE))]),_vm._v(" "),_c('use',{attrs:{"href":"#feather-calendar"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.post.context.schedule)}})]):_vm._e()]),_vm._v(" "),_c('a',{staticClass:"c-card__cta",attrs:{"href":_vm.post.link}},[_c('svg',{staticClass:"icon-wnyc-ui rtl:flip",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#feather-arrow-left"}})]),_vm._v(" "),_c('span',{domProps:{"innerHTML":_vm._s(_vm.strings.LEARN_MORE_ABOUT.replace('{{ program }}', _vm.post.context.program_plain_language_title))}}),_vm._v(" "),_c('svg',{staticClass:"icon-wnyc-ui rtl:flip",attrs:{"aria-hidden":"true"}},[_c('use',{attrs:{"href":"#feather-arrow-right"}})])]),_vm._v(" "),(_vm.post.raw)?_c('details',[_c('summary',[_vm._v("Raw")]),_vm._v(" "),_c('pre',{attrs:{"tabindex":"-1"}},[_vm._v(_vm._s(_vm.post.raw))])]):_vm._e()])])};
var __vue_staticRenderFns__ = [];

/* style */
Expand Down
16 changes: 10 additions & 6 deletions wp-content/themes/workingnyc/views/programs/program.twig
Original file line number Diff line number Diff line change
Expand Up @@ -11,20 +11,24 @@

<div class="c-card__body">
{% if post.status %}<p class="c-card__status flex items-center">
{% if post.status.recruiting %}<mark class="badge mie-2" data-program="recruiting">
{% if post.status.recruiting %}<mark class="badge mie-2">
{{ post.status.recruiting.name }}<span class="sr-only">.</span>
</mark>{% endif %}

{% if post.status.disability %}<span class="flex mie-2" data-program="accessible" title="{{ post.status.disability.name }}">
<svg aria-hidden="true" class="icon text-em">
{% if post.status.disability %}<span class="flex mie-2" title="{{ post.status.disability.name }}">
<svg class="icon text-em" role="img">
<title>{{ post.status.disability.name }}</title>

<use href="#icon-wnyc-accessible"></use>
</svg>

<span class="sr-only">{{ post.status.disability.name }}</span>
</span> <span class="sr-only">&nbsp;</span>{% endif %}

{% if post.status.language %}<span class="flex me-2" data-program="multilingual" title="{{ post.status.language.name }}">
<svg aria-hidden="true" class="icon-wnyc-ui text-em">
{% if post.status.language %}<span class="flex me-2" title="{{ post.status.language.name }}">
<svg class="icon-wnyc-ui text-em" role="img">
<title>{{ post.status.language.name }}</title>

<use href="#icon-wnyc-translate"></use>
</svg>

Expand Down Expand Up @@ -66,7 +70,7 @@
<use href="#feather-arrow-left"></use>
</svg>

<span>{{ __('Learn more', 'WNYC') }} <span class="sr-only">{{ __('about', 'WNYC') }} <span data-program="plain-language-name">{{ post.program_title }}</span></span></span>
<span>{{ __('Learn more', 'WNYC') }} <span class="sr-only">{{ __('about', 'WNYC') }} <span>{{ post.program_title }}</span></span></span>

<svg aria-hidden="true" class="icon-wnyc-ui rtl:flip">
<use href="#feather-arrow-right"></use>
Expand Down
16 changes: 8 additions & 8 deletions wp-content/themes/workingnyc/views/programs/program.vue
Original file line number Diff line number Diff line change
Expand Up @@ -18,20 +18,20 @@
{{ post.context.status.recruiting.name }}<span class="sr-only">.</span>
</mark>

<span class="flex mie-2" :title="post.context.status.disability.name" v-if="post.context.status.disability">
<svg aria-hidden="true" class="icon text-em">
<span class="flex mie-2" v-if="post.context.status.disability" :title="post.context.status.disability.name">
<svg class="icon text-em" role="img">
<title v-html="post.context.status.disability.name"></title>

<use href="#icon-wnyc-accessible"></use>
</svg>

<span class="sr-only">{{ post.context.status.disability.name }}</span>
</span> <span v-if="post.context.status.disability" class="sr-only">&nbsp;</span>

<span class="flex me-2" :title="post.context.status.language.name" v-if="post.context.status.language">
<svg aria-hidden="true" class="icon-wnyc-ui text-em">
<span class="flex me-2" v-if="post.context.status.language" :title="post.context.status.language.name">
<svg class="icon-wnyc-ui text-em" role="img">
<title v-html="post.context.status.language.name"></title>

<use href="#icon-wnyc-translate"></use>
</svg>

<span class="sr-only">{{ post.context.status.language.name }}</span>
</span>
</p>

Expand Down

0 comments on commit a42645a

Please sign in to comment.