kujiu
9de1bc0eef
Today, Odoo is really tricky to use without seeing the screen, it must be improved to be usable. This PR forbid to use labels without a "for" attribute, add some title, rule and aria attributes in HTML. With that, Odoo will be fully usable with a screen reader. * [IMP] Labels must have a for attribute. Improve accessibility. * [IMP] Better error message when trying to read a missing cached value * [FIX] Add some aria-label and title attributes for screen readers. * [FIX] Template name is not included in the error message in case of SyntaxError in QWeb * [FIX] Improve the Tour failed at step error message to be more explicit. * [IMP] Add aria-labels * [FIX] Add missing aria-label on failing test * [IMP] aria-hidden means hidden. Fix all bad aria-hidden and hide aria-hidden for all. * [IMP] Color names on kanban views and many2many tags * [IMP] Add some checks on views for accessibility. * [IMP] Add `alt` attribute on `img` tags. * [IMP] Add aria-label and title on non-described icons * [IMP] Add button role to widgets with btn class * [IMP] Translate aria and formatted attributes. * [IMP] Remove wrong aria-labelledby * [IMP] Add menu role on dropdowns * [IMP] Buttons must be focusable * [IMP] Add aria attributes on progress bars * [IMP] Improve accessibility of basic widgets * [IMP] Change main layout to more semantic tags * [IMP] Add menuitem role when missing * [IMP] Remove wrong role='presentation' * [IMP] Improve accessibility of tab panels * [IMP] Add aria-invalid on invalid fields * [IMP] Add aria-sort on ordered columns * [IMP] Add role on alerts * [IMP] Use dialog role, header, main and footer tags for modals * [IMP] Add labels on o_status * [IMP] Improve accessibility of kanban view with feeds and articles * [IMP] Add alerts in case of new messages * [IMP] Add widget, navigation or img role to aria-labelled items
215 lines
12 KiB
XML
215 lines
12 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
||
<odoo>
|
||
<template id="_assets_primary_variables" inherit_id="web._assets_primary_variables">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/primary_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="_assets_frontend_helpers" inherit_id="web._assets_frontend_helpers">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/bootstrap_overridden.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="assets_frontend" inherit_id="website.assets_frontend">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/colors.scss"/>
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/customize_modal.scss"/>
|
||
</xpath>
|
||
</template>
|
||
|
||
<template id="customize_modal" inherit_id="website.theme_customize" name="theme_default modal">
|
||
<xpath expr="div" position="replace">
|
||
<div role="dialog" id="theme_customize_modal" class="modal fade">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
|
||
<div class="loading_backdrop"></div>
|
||
<header class="modal-header text-center">
|
||
<button type="button" class="close">×</button>
|
||
<!-- <a role="button" class="btn btn-primary" href="/web#return_label=Website&action=website.action_module_theme">Click here to change theme</a> -->
|
||
<hr style="margin: 20px -10px 10px -10px;"/>
|
||
<h4 class="modal-title">Customize this default theme</h4>
|
||
</header>
|
||
<main class="modal-body">
|
||
<h5 class="modal-h5">LAYOUT</h5>
|
||
<table name="layout">
|
||
<tr>
|
||
<td class=" text-center" width="50%">
|
||
<label class=" center-block">
|
||
<div class="text-center" style="background-image: url(/theme_default/static/src/img/theme/layout-full.gif); background-size: 100%; line-height: 40px;">FULL WIDTH</div>
|
||
<input name="layoutvar" type="radio" data-xmlid=""/>
|
||
</label>
|
||
</td>
|
||
<td class=" text-center">
|
||
<label class=" center-block">
|
||
<div class="text-center" style="background-image: url(/theme_default/static/src/img/theme/layout-boxed.gif); background-size: 100%; line-height: 40px;">BOXED</div>
|
||
<input name="layoutvar" type="radio" data-xmlid="theme_default.option_layout_boxed"/>
|
||
</label>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
|
||
<h5 class="modal-h5">MAIN COLOR</h5>
|
||
<table name="color">
|
||
<tr>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-stone.gif" alt="Stone" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid=""/>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-emerald.gif" alt="Emerald" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_emerald_variables,theme_default.option_color_emerald_bs_variables,theme_default.option_color_emerald"/>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-cobalt.gif" alt="Cobalt" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_cobalt_variables,theme_default.option_color_cobalt_bs_variables,theme_default.option_color_cobalt"/>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-amethyst.gif" alt="Amethyst" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_amethyst_variables,theme_default.option_color_amethyst_bs_variables,theme_default.option_color_amethyst"/>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-ruby.gif" alt="Blue" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_ruby_variables,theme_default.option_color_ruby_bs_variables,theme_default.option_color_ruby"/>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class="chd-color-combi">
|
||
<img src="/theme_default/static/src/img/theme/variant-gold.gif" alt="Gold" class="chd-color-combi-img"/>
|
||
<input name="colorvar" type="radio" data-xmlid="theme_default.option_color_gold_variables,theme_default.option_color_gold_bs_variables,theme_default.option_color_gold"/>
|
||
</label>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
|
||
<h5 class="modal-h5">FONTS COMBINATIONS</h5>
|
||
<table name="font">
|
||
<tr>
|
||
<td width="50%">
|
||
<label>
|
||
<div>
|
||
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">Helvetica</span>
|
||
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >/ Georgia</span>
|
||
</div>
|
||
<input name="theme" type="radio" data-xmlid=""/>
|
||
</label>
|
||
</td>
|
||
<td width="50%">
|
||
<label>
|
||
<div>
|
||
<span style="font-family:Georgia, 'Times New Roman', Times, serif; font-size:11px" >Georgia</span>
|
||
<span style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:11px">/ Helvetica</span>
|
||
<input name="theme" type="radio" data-xmlid="theme_default.option_font"/>
|
||
</div>
|
||
</label>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</xpath>
|
||
</template>
|
||
|
||
<!-- Option layout -->
|
||
<template id="option_layout_boxed" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_layout_boxed.scss"/>
|
||
</xpath>
|
||
</template>
|
||
|
||
<!-- Option color -->
|
||
<template id="option_color_emerald_variables" inherit_id="theme_default._assets_primary_variables" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_emerald_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_emerald_bs_variables" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_emerald_bs_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_emerald" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_emerald.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_cobalt_variables" inherit_id="theme_default._assets_primary_variables" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_cobalt_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_cobalt_bs_variables" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_cobalt_bs_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_cobalt" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_cobalt.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_amethyst_variables" inherit_id="theme_default._assets_primary_variables" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_amethyst_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_amethyst_bs_variables" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_amethyst_bs_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_amethyst" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_amethyst.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_ruby_variables" inherit_id="theme_default._assets_primary_variables" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_ruby_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_ruby_bs_variables" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_ruby_bs_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_ruby" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_ruby.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_gold_variables" inherit_id="theme_default._assets_primary_variables" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_gold_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_gold_bs_variables" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_gold_bs_variables.scss"/>
|
||
</xpath>
|
||
</template>
|
||
<template id="option_color_gold" inherit_id="theme_default.assets_frontend" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_color_gold.scss"/>
|
||
</xpath>
|
||
</template>
|
||
|
||
<!-- Option font -->
|
||
<template id="option_font" inherit_id="theme_default._assets_frontend_helpers" active="False">
|
||
<xpath expr="//link[last()]" position="after">
|
||
<link rel="stylesheet" type="text/scss" href="/theme_default/static/src/scss/option_font.scss"/>
|
||
</xpath>
|
||
</template>
|
||
</odoo>
|