includes/layout/footer.tmpl - Issue 29488555: Issue 5406 - Create Site Footer Component for Help Center

Delta Between Two Patch Sets: includes/layout/footer.tmpl

Issue 29488555: Issue 5406 - Create Site Footer Component for Help Center (Closed)

Left Patch Set: Use menu pattern on custom select, horizontal list utliity class, etc Created Sept. 8, 2017, 9:52 a.m.

Right Patch Set: Remove langnames commit, use website-default breakpoint variables Created Sept. 18, 2017, 3:09 p.m.

Left:
Right:

Use n/p to move between diff chunks; N/P to move between comments.

Jump to:

Left: Side by side diff | Download
Right: Side by side diff | Download

LEFT	RIGHT
1 <footer id="site-footer" class="navbar">	1 <footer id="site-footer" class="navbar">

2 <div class="navbar-wrapper row">	2 <div class="navbar-wrapper row">

3 <div id="site-footer-locales" class="column one-fourth">	3 <div id="site-footer-locales" class="column one-fourth">

4 <div class="custom-select">	4 <div class="custom-select">

5 <button class="custom-select-selected" aria-expanded="false" aria-haspop up="true">	5 <button class="custom-select-selected" aria-expanded="false" aria-haspop up="true">

6 {{ config.get("langnames", locale) }}	6 {{ config.get("langnames", locale) }}

7 </button>	7 </button>

8 <ul class="custom-select-options" aria-label="{{ "Select Language" \| tra nslate("language-options-label", "Label") }}" role="menu" tabindex="-1">	8 <ul class="custom-select-options" aria-label="{{ "Select Language" \| tra nslate("language-options-label", "Label") }}" role="menu" tabindex="-1">

9 {% for lang in available_locales %}	9 {% for available_locale in available_locales %}

10 <li role="none">	10 <li role="none">
juliandoucette 2017/09/08 17:02:53 Shouldn't this role be "presentation"? :/ Shouldn't this role be "presentation"? :/ ire 2017/09/12 08:57:55 According to the example, it should be "none" in o Show quoted text On 2017/09/08 17:02:53, juliandoucette wrote: > Shouldn't this role be "presentation"? :/ According to the example, it should be "none" in order to remove the implied "listitem" role. See this table https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1... juliandoucette 2017/09/12 11:41:12 Acknowledged. I looked into this further and forg Show quoted text On 2017/09/12 08:57:55, ire wrote: > On 2017/09/08 17:02:53, juliandoucette wrote: > > Shouldn't this role be "presentation"? :/ > > According to the example, it should be "none" in order to remove the implied > "listitem" role. > > See this table > https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1... Acknowledged. I looked into this further and forgot to rescind this comment.
11 {{ page \| linkify(lang) }}	11 {{ page \| linkify(available_locale) }}{{ config.get("langnames", ava ilable_locale) }}</a>

12 {{ config.get("langnames", lang) }}

13 </a>

14 </li>	12 </li>

15 {% endfor %}	13 {% endfor %}

16 </ul>	14 </ul>

17 </div>	15 </div>

18 </div>	16 </div>

19 <div id="site-footer-nav" class="column three-fourths">	17 <div id="site-footer-nav" class="column three-fourths">
juliandoucette 2017/09/08 17:02:53 This section is aligned left between phablet and t This section is aligned left between phablet and tablet sizes when JavaScript is disabled because of the absolute positioning of the custom select. This looks like a grid bug :/ juliandoucette 2017/09/08 17:02:54 The nav and small are not vertically aligned middl The nav and small are not vertically aligned middle with the language selector. ire 2017/09/12 08:57:54 I wasn't intended for it to. The content in both a Show quoted text On 2017/09/08 17:02:54, juliandoucette wrote: > The nav and small are not vertically aligned middle with the language selector. I wasn't intended for it to. The content in both are aligned top. When the screen is resized, the content here flows onto more than one line, and I wanted the language selector to remain aligned top. ire 2017/09/12 08:57:54 I wasn't able to replicate this, but the .custom-s Show quoted text On 2017/09/08 17:02:53, juliandoucette wrote: > This section is aligned left between phablet and tablet sizes when JavaScript is > disabled because of the absolute positioning of the custom select. This looks > like a grid bug :/ I wasn't able to replicate this, but the .custom-select-options shouldn't be absolutely positioned with no javascript, so I've changed that and hopefully the issue is fixed
20 <nav>	18 <nav>

21 <ul class="horizontal-list">	19 <ul class="horizontal-list">

22 <li><a href="">{{ "Legal" \| translate("footer-nav-link-1", "Navigation link") }}</a></li>	20 <li><a href="">{{ "Legal" \| translate("footer-nav-link-1", "Navigation link") }}</a></li>

23 <li><a href="https://adblockplus.org/privacy">{{ "Privacy Policy" \| tr anslate("footer-nav-link-2", "Navigation link") }}</a></li>	21 <li><a href="https://adblockplus.org/privacy">{{ "Privacy Policy" \| tr anslate("footer-nav-link-2", "Navigation link") }}</a></li>

24 </ul>	22 </ul>

25 </nav>	23 </nav>

26 <small class="muted">	24 <small class="muted">
juliandoucette 2017/09/08 17:02:54 "eyeo GmbH" breaks oddly between phablet and table "eyeo GmbH" breaks oddly between phablet and tablet sizes. ire 2017/09/12 08:57:54 Done. Show quoted text On 2017/09/08 17:02:54, juliandoucette wrote: > "eyeo GmbH" breaks oddly between phablet and tablet sizes. Done.
27 {{ "<a href=\"https://adblockplus.org\">Adblock Plus</a> is a registered trademark of <a href=\"https://eyeo.com\">eyeo GmbH</a>" \| translate("footer-tr ademark-notice", "Paragraph") }}	25 {{ "<a href=\"https://adblockplus.org\">Adblock Plus</a> is a registered trademark of <a href=\"https://eyeo.com\">eyeo GmbH</a>" \| translate("footer-tr ademark-notice", "Paragraph") }}

28 </small>	26 </small>

29 </div>	27 </div>

30 </div>	28 </div>

31 </footer>	29 </footer>

LEFT	RIGHT