Improve accessibility (#221)
Eduardo Gómez
GitHub
parent
7ce1faca6f
commit
42d726ec5f
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
||||
.m-featured-slider{position:relative;overflow:hidden!important;height:350px;margin:-40px -20px 40px;transition:all .25s cubic-bezier(.02,.01,.47,1)}@media only screen and (min-width:48rem){.m-featured-slider:hover{transform:translateY(-5px);box-shadow:var(--article-shadow-hover),0 0 0 transparent}}@media only screen and (min-width:48rem){.m-featured-slider{width:100%;height:420px;margin:-40px 10px 20px;border-radius:10px}}@media only screen and (min-width:64rem){.m-featured-slider{width:calc(66.66667% - 40px);margin:0 20px 40px;overflow:unset}}.m-featured-slider:not(:root:root){overflow:hidden!important}.m-featured-slider__list{list-style-type:none;padding:0;margin:0;height:100%}@media only screen and (min-width:48rem){.m-featured-slider__list{border-radius:10px;overflow:hidden}}.m-featured-slider__list .slick-list,.m-featured-slider__list .slick-slide>div,.m-featured-slider__list .slick-track,.m-featured-slider__list__item{height:100%}.m-featured-article{position:relative;height:100%;overflow:hidden;background-color:var(--primary-subtle-color);z-index:1}.m-featured-article:hover .m-featured-article__author{box-shadow:0 4px 8px rgba(0,0,0,.3),0 0 0 transparent}.m-featured-article.no-picture .m-featured-article__picture{background-color:var(--link-color)}.m-featured-article__picture{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;z-index:1}.m-featured-article__picture img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:.7}.m-featured-article__meta{position:absolute;top:20px;left:20px;z-index:4}@media only screen and (min-width:48rem){.m-featured-article__meta{top:40px;left:40px}}.rtl .m-featured-article__meta{left:auto;right:20px}@media only screen and (min-width:48rem){.rtl .m-featured-article__meta{left:auto;right:40px}}.m-featured-article__author{display:block;width:35px;height:35px;background-color:#fff;border:2px solid #fff;border-radius:50%;margin-bottom:20px;transition:all .25s cubic-bezier(.02,.01,.47,1)}.m-featured-article__author div{width:100%;height:100%;background-repeat:no-repeat;background-position:50%;background-size:cover;border-radius:50%}.m-featured-article__tag{color:#fff;letter-spacing:.3px;font-weight:700;font-size:1rem}.m-featured-article__ribbon{display:flex;align-items:center;justify-content:center;position:absolute;top:26px;right:20px;width:24px;height:24px;color:#000;background-color:#fff;border-radius:50%;z-index:2}@media only screen and (min-width:48rem){.m-featured-article__ribbon{justify-content:flex-start;top:47px;right:40px;width:auto;height:22px;padding:0 7px;font-size:.875rem;font-weight:600;border-radius:15px}}.m-featured-article__ribbon span{display:inline-block}@media only screen and (min-width:48rem){.m-featured-article__ribbon span:first-of-type{font-size:.75rem;margin-right:4px}}.m-featured-article__ribbon span:last-of-type{display:none}@media only screen and (min-width:48rem){.m-featured-article__ribbon span:last-of-type{display:block}}.rtl .m-featured-article__ribbon{right:auto;left:20px}@media only screen and (min-width:48rem){.rtl .m-featured-article__ribbon{right:auto;left:40px}}@media only screen and (min-width:48rem){.rtl .m-featured-article__ribbon span:first-of-type{margin-right:0;margin-left:4px}}.m-featured-article__content{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:120px 20px 20px;position:relative;z-index:3}@media only screen and (min-width:48rem){.m-featured-article__content{padding:125px 40px 40px}}.m-featured-article__title{color:#fff;letter-spacing:.4px;line-height:1.3;font-size:1.625rem;font-weight:600;margin:0}@media only screen and (min-width:48rem){.m-featured-article__title{letter-spacing:.5px;font-size:2.25em;max-width:80%}}.m-featured-article__timestamp{display:flex;align-items:center;color:#fff;letter-spacing:.2px;font-size:.875rem;font-weight:600}.m-featured-article__timestamp span:nth-child(2){padding:0 10px}
|
||||
.m-featured-slider{position:relative;overflow:hidden!important;height:350px;margin:-40px -20px 40px;transition:all .25s cubic-bezier(.02,.01,.47,1)}@media only screen and (min-width:48rem){.m-featured-slider:hover{transform:translateY(-5px);box-shadow:var(--article-shadow-hover),0 0 0 transparent}}@media only screen and (min-width:48rem){.m-featured-slider{width:100%;height:420px;margin:-40px 10px 20px;border-radius:10px}}@media only screen and (min-width:64rem){.m-featured-slider{width:calc(66.66667% - 40px);margin:0 20px 40px;overflow:unset}}.m-featured-slider:not(:root:root){overflow:hidden!important}.m-featured-slider__list{list-style-type:none;padding:0;margin:0;height:100%}@media only screen and (min-width:48rem){.m-featured-slider__list{border-radius:10px;overflow:hidden}}.m-featured-slider__list__item{height:100%;overflow:hidden}@media only screen and (min-width:48rem){.m-featured-slider__list__item{border-radius:10px}}.m-featured-article{position:relative;height:100%;overflow:hidden;background-color:var(--primary-subtle-color);z-index:1}.m-featured-article:hover .m-featured-article__author{box-shadow:0 4px 8px rgba(0,0,0,.3),0 0 0 transparent}.m-featured-article.no-picture .m-featured-article__picture{background-color:var(--primary-subtle-color)}.m-featured-article__picture{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;z-index:1}.m-featured-article__picture img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;opacity:.7}.m-featured-article__meta{position:absolute;top:20px;left:20px;z-index:4}@media only screen and (min-width:48rem){.m-featured-article__meta{top:40px;left:40px}}.rtl .m-featured-article__meta{left:auto;right:20px}@media only screen and (min-width:48rem){.rtl .m-featured-article__meta{left:auto;right:40px}}.m-featured-article__author{display:block;width:35px;height:35px;background-color:#fff;border:2px solid #fff;border-radius:50%;margin-bottom:20px;transition:all .25s cubic-bezier(.02,.01,.47,1)}.m-featured-article__author div{width:100%;height:100%;background-repeat:no-repeat;background-position:50%;background-size:cover;border-radius:50%}.m-featured-article__tag{color:#fff;letter-spacing:.3px;font-weight:700;font-size:1rem}.m-featured-article__ribbon{display:flex;align-items:center;justify-content:center;position:absolute;top:26px;right:20px;width:24px;height:24px;color:#000;background-color:#fff;border-radius:50%;z-index:2}@media only screen and (min-width:48rem){.m-featured-article__ribbon{justify-content:flex-start;top:47px;right:40px;width:auto;height:22px;padding:0 7px;font-size:.875rem;font-weight:600;border-radius:15px}}.m-featured-article__ribbon span{display:inline-block}@media only screen and (min-width:48rem){.m-featured-article__ribbon span:first-of-type{font-size:.75rem;margin-right:4px}}.m-featured-article__ribbon span:last-of-type{display:none}@media only screen and (min-width:48rem){.m-featured-article__ribbon span:last-of-type{display:block}}.rtl .m-featured-article__ribbon{right:auto;left:20px}@media only screen and (min-width:48rem){.rtl .m-featured-article__ribbon{right:auto;left:40px}}@media only screen and (min-width:48rem){.rtl .m-featured-article__ribbon span:first-of-type{margin-right:0;margin-left:4px}}.m-featured-article__content{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:120px 20px 20px;position:relative;z-index:3}@media only screen and (min-width:48rem){.m-featured-article__content{padding:125px 40px 40px}}.m-featured-article__title{color:#fff;letter-spacing:.4px;line-height:1.3;font-size:1.625rem;font-weight:600;margin:0}@media only screen and (min-width:48rem){.m-featured-article__title{letter-spacing:.5px;font-size:2.25em;max-width:80%}}.m-featured-article__timestamp{display:flex;align-items:center;color:#fff;letter-spacing:.2px;font-size:.875rem;font-weight:600}.m-featured-article__timestamp span:nth-child(2){padding:0 10px}
|
||||
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
||||
(window.webpackJsonp=window.webpackJsonp||[]).push([[4],{1:function(e,t,n){"use strict";n.r(t),n.d(t,"isRTL",(function(){return a})),n.d(t,"isMobile",(function(){return r})),n.d(t,"isDarkMode",(function(){return o})),n.d(t,"formatDate",(function(){return i})),n.d(t,"getParameterByName",(function(){return s})),n.d(t,"adjustImageGallery",(function(){return c})),n.d(t,"managePostImages",(function(){return l})),n.d(t,"makeImagesZoomable",(function(){return u}));var a=function(){var e=document.querySelector("html");return["ar","he","fa"].includes(e.getAttribute("lang"))},r=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"768px";return window.matchMedia("(max-width: ".concat(e,")")).matches},o=function(){var e=window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)");return e&&e.matches},i=function(e){return e?new Date(e).toLocaleDateString(document.documentElement.lang,{year:"numeric",month:"long",day:"numeric"}):""},s=function(e,t){t||(t=window.location.href),e=e.replace(/[\[\]]/g,"\\$&");var n=new RegExp("[?&]".concat(e,"(=([^&#]*)|&|#|$)")).exec(t);return n?n[2]?decodeURIComponent(n[2].replace(/\+/g," ")):"":null},c=function(){for(var e=document.querySelectorAll(".kg-gallery-image img"),t=0,n=e.length;t<n;t++){var a=e[t].closest(".kg-gallery-image"),r=e[t].attributes.width.value/e[t].attributes.height.value;a.style.flex="".concat(r," 1 0%")}},l=function(e){e(".js-post-content").find("img").each((function(){e(this).closest("figure").hasClass("kg-bookmark-card")||e(this).parent().is("a")||e(this).addClass("js-zoomable");var t=e(this).parent().find("figcaption");t?e(this).attr("alt",t.text()):e(this).attr("alt","")}))},u=function(e,t){var n=t(".js-zoomable");n.on("open",(function(t){r()&&e(t.target).parent().hasClass("kg-gallery-image")&&setTimeout((function(){var t=e(".medium-zoom-image--opened"),n=t[0].style.transform,a=n.substr(0,n.indexOf(" ")),r=parseFloat(a.substr(a.indexOf("(")+1).split(")")[0]),o=n.substr(n.indexOf(" ")+1),i=parseFloat(o.split(",")[1]),s="scale(1) translate3d(0, ".concat(i<0?r*i+i:r*i-i,"px, 0)");t.addClass("medium-zoom-image-mobile"),t[0].style.transform=s}),10)})),n.on("close",(function(){r()&&e(event.target).parent().hasClass("kg-gallery-image")&&e(".medium-zoom-image").removeClass("medium-zoom-image-mobile")}))}},16:function(e,t,n){e.exports=n(17)},17:function(e,t,n){"use strict";n.r(t);var a=n(0),r=n.n(a),o=n(3),i=n(2),s=n(1);r()(document).ready((function(){var e=r()(".js-featured-slider");if(e.length>0){var t=e.find(".js-featured-slide").length,n=new i.d(".js-featured-slider",{type:1===t?"slider":"carousel",rewind:!1,gap:0,swipeThreshold:!1,dragThreshold:!1,direction:Object(s.isRTL)()?"rtl":"ltr",breakpoints:{768:{swipeThreshold:1!==t&&80,dragThreshold:1!==t&&120}}});1===t&&e.find(".js-controls").remove(),n.on("mount.after",(function(){Object(o.a)(".js-featured-article-title",200)})),n.mount({Controls:i.b,Swipe:i.c,Breakpoints:i.a}),setTimeout((function(){window.dispatchEvent(new Event("resize"))}),350)}Object(o.a)(".js-featured-article-title",200)}))}},[[16,0,1]]]);
|
||||
(window.webpackJsonp=window.webpackJsonp||[]).push([[4],{1:function(e,t,n){"use strict";n.r(t),n.d(t,"isRTL",(function(){return r})),n.d(t,"isMobile",(function(){return a})),n.d(t,"isDarkMode",(function(){return i})),n.d(t,"formatDate",(function(){return o})),n.d(t,"getParameterByName",(function(){return s})),n.d(t,"adjustImageGallery",(function(){return l})),n.d(t,"managePostImages",(function(){return u})),n.d(t,"makeImagesZoomable",(function(){return d}));var r=function(){var e=document.querySelector("html");return["ar","he","fa"].includes(e.getAttribute("lang"))},a=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"768px";return window.matchMedia("(max-width: ".concat(e,")")).matches},i=function(){var e=window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)");return e&&e.matches},o=function(e){return e?new Date(e).toLocaleDateString(document.documentElement.lang,{year:"numeric",month:"long",day:"numeric"}):""},s=function(e,t){t||(t=window.location.href),e=e.replace(/[\[\]]/g,"\\$&");var n=new RegExp("[?&]".concat(e,"(=([^&#]*)|&|#|$)")).exec(t);return n?n[2]?decodeURIComponent(n[2].replace(/\+/g," ")):"":null},l=function(){for(var e=document.querySelectorAll(".kg-gallery-image img"),t=0,n=e.length;t<n;t++){var r=e[t].closest(".kg-gallery-image"),a=e[t].attributes.width.value/e[t].attributes.height.value;r.style.flex="".concat(a," 1 0%")}},u=function(e){e(".js-post-content").find("img").each((function(){e(this).closest("figure").hasClass("kg-bookmark-card")||e(this).parent().is("a")||e(this).addClass("js-zoomable");var t=e(this).parent().find("figcaption");t?e(this).attr("alt",t.text()):e(this).attr("alt","")}))},d=function(e,t){var n=t(".js-zoomable");n.on("open",(function(t){a()&&e(t.target).parent().hasClass("kg-gallery-image")&&setTimeout((function(){var t=e(".medium-zoom-image--opened"),n=t[0].style.transform,r=n.substr(0,n.indexOf(" ")),a=parseFloat(r.substr(r.indexOf("(")+1).split(")")[0]),i=n.substr(n.indexOf(" ")+1),o=parseFloat(i.split(",")[1]),s="scale(1) translate3d(0, ".concat(o<0?a*o+o:a*o-o,"px, 0)");t.addClass("medium-zoom-image-mobile"),t[0].style.transform=s}),10)})),n.on("close",(function(){a()&&e(event.target).parent().hasClass("kg-gallery-image")&&e(".medium-zoom-image").removeClass("medium-zoom-image-mobile")}))}},16:function(e,t,n){e.exports=n(17)},17:function(e,t,n){"use strict";n.r(t);var r=n(0),a=n.n(r),i=n(3),o=n(2),s=n(1);a()(document).ready((function(){var e=a()(".js-featured-slider");if(e.length>0){var t=e.find(".js-featured-slide").length,n=new o.d(".js-featured-slider",{type:"slider",rewind:!1,gap:0,swipeThreshold:!1,dragThreshold:!1,direction:Object(s.isRTL)()?"rtl":"ltr",breakpoints:{768:{swipeThreshold:1!==t&&80,dragThreshold:1!==t&&120}}});1===t&&e.find(".js-featured-slider-controls").remove(),n.on("mount.after",(function(){Object(i.a)(".js-featured-article-title",200)})),n.mount({Controls:o.b,Swipe:o.c,Breakpoints:o.a,ArrowDisabler:function(e,n){var r="js-featured-slider-controls",a="js-featured-slider-previous",i="js-featured-slider-next";return{mount:function(){e.settings.rewind||1===t||e.on(["mount.after","run"],(function(){var t=!0,o=!1,s=void 0;try{for(var l,u=n.Controls.items[Symbol.iterator]();!(t=(l=u.next()).done);t=!0){var d=l.value;if(d.className.includes(r)){var c=d.querySelector(".".concat(a));c&&(0===e.index?c.setAttribute("disabled",""):c.removeAttribute("disabled"));var m=d.querySelector(".".concat(i));if(m)(e.settings.bound?e.index+(e.settings.perView-1):e.index)===n.Sizes.length-1?m.setAttribute("disabled",""):m.removeAttribute("disabled")}}}catch(e){o=!0,s=e}finally{try{t||null==u.return||u.return()}finally{if(o)throw s}}}))}}}}),setTimeout((function(){window.dispatchEvent(new Event("resize"))}),350)}Object(i.a)(".js-featured-article-title",200)}))}},[[16,0,1]]]);
|
||||
@ -1,27 +1,27 @@
|
||||
<div class="m-alert success subscribe js-alert" data-notification="subscribe">
|
||||
{{t "Great! You've successfully subscribed."}}
|
||||
<button class="m-alert__close js-notification-close" aria-label="Close">
|
||||
<button class="m-alert__close js-notification-close" aria-label="{{t "Close"}}">
|
||||
<span class="icon-close"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="m-alert success signup js-alert" data-notification="signup">
|
||||
{{t "Great! Next, complete checkout for full access."}}
|
||||
<button class="m-alert__close js-notification-close" aria-label="Close">
|
||||
<button class="m-alert__close js-notification-close" aria-label="{{t "Close"}}">
|
||||
<span class="icon-close"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="m-alert success signin js-alert" data-notification="signin">
|
||||
{{t "Welcome back! You've successfully signed in."}}
|
||||
<button class="m-alert__close js-notification-close" aria-label="Close">
|
||||
<button class="m-alert__close js-notification-close" aria-label="{{t "Close"}}">
|
||||
<span class="icon-close"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="m-alert success checkout js-alert" data-notification="checkout">
|
||||
{{t "Success! Your account is fully activated, you now have access to all content."}}
|
||||
<button class="m-alert__close js-notification-close" aria-label="Close">
|
||||
<button class="m-alert__close js-notification-close" aria-label="{{t "Close"}}">
|
||||
<span class="icon-close"></span>
|
||||
</button>
|
||||
</div>
|
||||
Loading…
Reference in New Issue