Refazendo toda a acessibilidade

src/404.php

@@ -1,11 +1,11 @@
 <?php get_header();?>
 
 	<div class="page-header page-404 header-filter clear-filter" style="background-image: url('<?php echo get_template_directory_uri(); ?>/assets/images/404.png')">
-		<div class="container align-self-center">
+		<div id="content" class="container align-self-center">
 			<div class="row">
 				<div class="col-md-12 mx-auto">
 					<div class="brand mb-5">
-						<h1>404</h1>
+						<h2>404</h2>
 						<h3><?php _e( 'The page you are looking for does not exist!', 'tainacan-interface' );?></h3>
 						<h3>̄\_(ツ)_/ ̄</h3>
 					</div>

src/archive.php

@@ -8,7 +8,7 @@
 
 <main role="main" class="mt-5 max-large margin-one-column">
 	<div class="row">
-		<div class="col-12 <?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { ?>col-lg-9<?php } ?>">
+		<div id="content" class="col-12 <?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { ?>col-lg-9<?php } ?>">
 			<?php get_template_part( 'template-parts/loop' ); ?>
 		</div>
 		<?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { get_sidebar(); } ?>

src/assets/js/js.js

@@ -99,4 +99,85 @@ jQuery( document ).ready(function( $ ) {
 	$( ".trigger" ).click( function() {
 		$( ".collection-header--share" ).toggleClass( "active" );
 	});
+
+	/*
+	 * ACESSIBILIDADE
+	*/
+
+	accessibilityCounter = 0;
+
+	jQuery('.button-text-minus').on('click',function() {
+		if (accessibilityCounter > -3) {
+			var _html = jQuery('html'),
+				fonte = _html.css('font-size'),
+				tamanho = fonte.split('px');
+
+			_html.css('font-size', (parseInt(tamanho[0]) - 2));
+			accessibilityCounter--;
+		}
+	});
+
+	jQuery('.button-text-default').on('click',function() {
+		jQuery('html').css('font-size','1rem');
+		accessibilityCounter = 0;
+	});
+
+	jQuery('.button-text-plus').on('click',function() {
+		if (accessibilityCounter < 3) {
+			var _html = jQuery('html'),
+				fonte = _html.css('font-size'),
+				tamanho = fonte.split('px');
+
+			_html.css('font-size', (parseInt(tamanho[0]) + 3));
+			accessibilityCounter++;
+		}
+	});
+
+	jQuery('.button-high-contrast').on('click',function() {
+		jQuery('body').toggleClass('contraste');
+	});
+
+	/*
+	 * BOTÃO DE EXIBIÇÃO DO FORMULÁRIO DE BUSCA
+	*/
+	jQuery('.tainacan-search-button').on('click',function() {
+		var _elementoPai = jQuery(this).parents('.input-group');
+
+		if (!_elementoPai.hasClass('hover')) {
+			_elementoPai.addClass('hover');
+
+			return false;
+		} else {
+			if (jQuery('#tainacan-search-header').val() == '') {
+				_elementoPai.removeClass('hover');
+
+				return false;
+			}
+		}
+	});
+
+	jQuery('#tainacan-search-header').on({
+		'focus': function() {
+			jQuery(this).parents('.input-group').addClass('hover');
+		},
+		'blur': function() {
+			jQuery(this).parents('.input-group').removeClass('hover');
+		}
+	});
+
+	/*
+	 * AO CLICAR EM QUALQUER LUGAR DA PÁGINA, O CAMPO DE BUSCA ABERTO É FECHADO
+	*/
+	var _formBusca = jQuery('.tainacan-search-form'),
+		_formBuscaFilho = _formBusca.find('.input-group');
+
+	_formBusca.on('click',function(e) {
+		e.stopPropagation();
+	});
+
+	jQuery('body').on('click',function() {
+		if (_formBuscaFilho.hasClass('hover')) {
+			_formBuscaFilho.removeClass('hover');
+		}
+	});
 });

src/assets/scss/_comments.scss

@@ -1,6 +1,6 @@
 #comments{
     div[for=comment]{
-        span{
+        h4{
             font-size: 1.125rem;
         }
         .authenticated{

src/assets/scss/style.scss

@@ -81,7 +81,6 @@ body{
 
 nav{
 	&.menu-shadow{
-        max-height: 50px;
 		border-bottom: none;
 		.max-large{
 			margin: 0 4.16666666667%;
@@ -163,7 +162,6 @@ nav{
 			top: calc(100% + 2px);
 			right: 0;
 			width: 204px;
-            height: 27px;
 			padding: 0;
 			left: inherit;
 			.input-group {
@@ -271,20 +269,16 @@ nav{
 	.input-group {
 		float: right !important;
 		transition: all 0.35s, border-radius 0s;
-        width: 32px;
+		min-height: 32px;
-        height: 32px;
 		background-color: #fff;
-        //box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
-        //border-radius: 25px;
-        //border: 1px solid #ccc;
 		.form-control {
-            //margin-left: -25px;
+			width: 0;
-            border:none;
+			border: 1px solid transparent;
 			background: transparent;
 			box-shadow: none;
 			display:block;
-            padding: 1rem 2rem;
+			padding: 1rem 0;
-            padding-left: 1rem;
+			transition: width 0.35s, padding 0.35s, border 0.35s;
 			&::-webkit-input-placeholder {
 				display: none;
 			}
@@ -295,31 +289,90 @@ nav{
 			&:-ms-input-placeholder {
 				display: none;
 			}
+			&:focus {
+				width: 400px;
+				padding: 1rem 2rem;
+				border: 1px solid #ccc;
+			}
 		}
 		&:hover, &.hover {
-            width: 100%;
+			.form-control {
-            //border-radius: 25px 25px 25px 25px;
+				width: 400px;
+				padding: 1rem 2rem;
 				border: 1px solid #ccc;
-            position: static;
+			}
 		}
 		.form-control-feedback {
-            position: absolute;
-            //top: -5px;
-            bottom: 0px;
-            right: -2px;
-            left: 5px;
-            display: block;
 			width: 34px;
-            height: 34px;
+			height: 30px;
-            line-height: 34px;
+			font-size: 1.1875rem !important;
-            text-align: center;
 			color: #3596e0;
-            left: initial;
+			text-align: center;
-            font-size: 1.1875rem;
+			line-height: 30px;
+			cursor: pointer;
+			display: block;
+			position: absolute;
+			top: 50%;
+			right: 1px;
+			border: none;
+			background: none;
+			z-index: 9;
+			transform: translate(0,-50%);
+
+			span:before {
+				height: 29px;
+				line-height: 29px;
+			}
 		}
 	}
 }
 
+@media screen and (max-width: 768px) {
+	.navbar { z-index: 2; }
+	.tainacan-search-form .input-group {
+		.form-control {
+			width: 200px;
+			height: 38px;
+			padding: 1rem;
+			position: absolute;
+			right: 0;
+			bottom: 0;
+			opacity: 0;
+			border-radius: .25rem;
+			border: 1px solid transparent;
+			background-clip: padding-box;
+			background-color: #fff;
+			z-index: -2;
+			transition: transform 0.35s, opacity 0.35s, border 0.35s, z-index 0s 0.35s;
+
+			&:focus {
+				width: 200px;
+				padding: 1rem;
+				opacity: 1;
+				border: 1px solid rgba(0,0,0,0.15);
+				z-index: 2;
+				transform: translate(0,50px);
+				transition: transform 0.35s, opacity 0.35s, border 0.35s;
+			}
+		}
+		&:hover, &.hover {
+			.form-control {
+				width: 200px;
+				padding: 1rem;
+				border: 1px solid rgba(0,0,0,0.15);
+			}
+		}
+		&.hover .form-control {
+			width: 200px;
+			padding: 1rem;
+			opacity: 1;
+			border: 1px solid rgba(0,0,0,0.15);
+			z-index: 2;
+			transform: translate(0,50px);
+			transition: transform 0.35s, opacity 0.35s, border 0.35s;
+		}
+	}
+}
 
 .page-header {
 	height: 200px;
@@ -361,7 +414,7 @@ nav{
 			.brand{
 				color: white;
 				text-align: center;
-                h1{
+				h2{
 					font-size: 9.375rem;
 					font-weight: 600;
 				}
@@ -458,7 +511,7 @@ nav{
 			padding: 1rem;
 			padding-top: 0.8rem;
 		}
-        h1{
+		.page-title {
 			color: #000;
 			font-size: 3rem;
 			font-weight: 800;
@@ -601,3 +654,243 @@ nav{
 @import "_view-mode-document.scss";
 
 @import "_view-mode-albums.scss";
+
+/***
+- ACESSIBILIDADE
+***/
+
+/*
+- BARRA DE ACESSIBILIDADE
+*/
+
+.accessibility-bar {
+	width: 100%;
+	position: relative;
+	border-bottom: 1px solid #01295C;
+	background-color: #fff;
+	z-index: 4;
+}
+.accessibility-bar__container {
+	width: 100%;
+	max-width: 960px;
+	min-height: 40px;
+	margin: 0 auto;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	position: relative;
+}
+.accessibility-shortcuts {
+	margin: 0 -10px;
+	padding: 0;
+	list-style: none;
+	display: flex;
+}
+.accessibility-shortcuts--hidden {
+	position: fixed;
+	top: -50px;
+	left: -50px;
+	opacity: 0;
+	z-index: -2;
+}
+.accessibility-shortcuts li { margin: 0 10px; }
+.accessibility-shortcuts a {
+	font-weight: 400;
+	font-family: 'Roboto', sans-serif;
+	font-size: 12px;
+	color: #000;
+	line-height: normal;
+	display: block;
+}
+.accessibility-shortcuts a span {
+	width: 18px;
+	height: 18px;
+	margin-right: 10px;
+	font-weight: 400;
+	font-family: 'Roboto', sans-serif;
+	font-size: 12px;
+	color: #fff;
+	line-height: 18px;
+	text-align: center;
+	display: inline-block;
+	border-radius: 50%;
+	background: #01295C;
+}
+
+.accessibility-options {
+	height: 24px;
+	margin: 0 -10px;
+	padding: 0;
+	display: flex;
+	list-style: none;
+}
+.accessibility-options li {
+	height: 24px;
+	margin: 0 10px;
+	display: flex;
+	align-items: center;
+}
+.accessibility-options span {
+	height: 14px;
+	margin-right: 6px;
+	font-weight: 400;
+	font-family: 'Roboto', sans-serif;
+	font-size: 12px;
+	color: #000;
+	line-height: normal;
+	display: block;
+}
+.accessibility-options button {
+	width: 22px;
+	height: 22px;
+	margin: 0;
+	padding: 0;
+	font-weight: 400;
+	font-family: 'Roboto', sans-serif;
+	font-size: 11px;
+	color: #fff;
+	line-height: 22px;
+	text-align: center;
+	cursor: pointer;
+	display: block;
+	border-radius: 50%;
+	border: none;
+	background: #01295C;
+}
+.accessibility-options button + button { margin-left: 6px; }
+.accessibility-options .button-high-contrast {
+	text-indent: -99999px;
+	overflow: hidden;
+	position: relative;
+	border: 1px solid #000;
+	background-color: #fff;
+}
+.accessibility-options .button-high-contrast:after {
+	content: "";
+	width: 11px;
+	height: 22px;
+	display: block;
+	position: absolute;
+	top: 0;
+	left: 0;
+	background-color: #000;
+}
+
+@media screen and (max-width: 800px) {
+	.accessibility-bar__container {
+		padding: 20px;
+		flex-direction: column;
+		align-items: center;
+		justify-content: space-between;
+	}
+	.accessibility-shortcuts {
+		flex-flow: row wrap;
+		justify-content: space-around;
+	}
+	.accessibility-options { margin-top: 20px; }
+}
+
+/* MODO COMPACTO DA BARRA DE ACESSIBILIDADE */
+
+.accessibility-bar.compact-mode {
+	position: absolute;
+	top: 0;
+	border: none;
+	background: none;
+	transform: translate(0,-100px);
+}
+.accessibility-bar.compact-mode .accessibility-options { display: none; }
+.accessibility-bar.compact-mode .accessibility-shortcuts a {
+	padding: 5px 10px;
+	position: absolute;
+	top: 20px;
+	left: 50%;
+	opacity: 0;
+	background-color: #fff;
+	z-index: -2;
+	transform: translate(-50%,100px);
+}
+.accessibility-bar.compact-mode .accessibility-shortcuts a:focus {
+	opacity: 1;
+	z-index: 2;
+}
+
+@media screen and (max-width: 500px) {
+	.accessibility-bar.compact-mode .accessibility-shortcuts a:focus { transform: translate(-50%,160px); }
+}
+
+/*
+- ALTO CONTRASTE
+*/
+
+body.contraste,
+body.contraste *,
+body.contraste .page-header .title-header,
+body.contraste .button.is-outlined {
+	color: #fff !important;
+	border-color: #fff !important;
+	background-color: #000 !important;
+}
+
+body.contraste .search-box,
+body.contraste .collection-header--type-b { border: 2px solid #fff !important; }
+
+body.contraste .page-header .title-header h2:after,
+body.contraste .highlights-list__title-box:after { display: none !important; }
+
+body.contraste .navbar,
+body.contraste .page-header.page-height,
+body.contraste .accessibility-bar { border-bottom: 1px solid #fff !important; }
+
+body.contraste footer.tainacan-footer { border-top: 1px solid #fff !important; }
+
+body.contraste .tainacan-single-post article header .header-meta,
+body.contraste .theme-items-list a,
+body.contraste .dropdown .dropdown-menu .dropdown-content .dropdown-item,
+body.contraste .dropdown .dropdown-menu .dropdown-content .has-link a,
+body.contraste .dropdown .dropdown-menu .has-link .dropdown-content a,
+body.contraste .autocomplete .dropdown-menu .dropdown-content .dropdown-item,
+body.contraste .autocomplete .dropdown .dropdown-menu .dropdown-content .has-link a,
+body.contraste .dropdown .autocomplete .dropdown-menu .dropdown-content .has-link a,
+body.contraste .autocomplete .dropdown .dropdown-menu .has-link .dropdown-content a,
+body.contraste .dropdown .autocomplete .dropdown-menu .has-link .dropdown-content a,
+body.contraste .select:not(.is-loading)::after,
+body.contraste .table-container .table-wrapper table.tainacan-table .column-main-content p,
+body.contraste .tainacan-title-page ul li,
+body.contraste .tainacan-title-page ul li a,
+body.contraste #menubelowHeader .menu-item a::after,
+body.contraste .menu-shadow button[data-toggle='dropdown']::after,
+body.contraste .tainacan-search-form .input-group .form-control::placeholder { color: #fff !important; }
+
+body.contraste .page-header .title-header.singular-title,
+body.contraste img,
+body.contraste .tainacan-form .control.has-icons-right .icon,
+body.contraste .accessibility-options button { border: 1px solid #fff !important; }
+
+body.contraste footer .tainacan-footer-info .tainacan-footer-info--logo,
+body.contraste .collection-header--type-b .btn.trigger,
+body.contraste .page-header .title-header.singular-title,
+body.contraste .tainacan-single-post article header .header-meta img { border: none !important; }
+
+body.contraste .page-header.page-height > div.ph-title-description,
+body.contraste .collection-header--share .rotater,
+body.contraste .collection-header--share,
+body.contraste .collection-header--share .btn .mdi.mdi-share-variant,
+body.contraste .collection-header--share .btn .mdi,
+body.contraste .t-bg-collection .t-collection--info .t-collection--info-title,
+body.contraste .t-bg-collection .t-collection--info .t-collection--col-9,
+body.contraste .image-placeholder>h4,
+body.contraste .t-bg-collection .t-collection--info .t-collection--col-3,
+body.contraste .accessibility-shortcuts,
+body.contraste .accessibility-shortcuts li,
+body.contraste .tainacan-form .select select,
+body.contraste .page-header > div.ph-title-description,
+body.contraste .page-header .title-header.singular-title { background-color: transparent !important; }
+
+body.contraste .accessibility-shortcuts a span,
+body.contraste .tooltip .tooltip-inner {
+	color: #000 !important;
+	background-color: #fff !important;
+}
+body.contraste .accessibility-options .button-high-contrast,
+body.contraste .tainacan-logo img { background-color: #fff !important; }

src/comments.php

@@ -26,7 +26,7 @@ if ( post_password_required() ) {
 				</p>        
 			<?php else : ?>      
 				<div for="comment" class="d-flex mb-2">
-					<span class="text-jelly-bean title-leave"><?php _e( 'Leave your comment', 'tainacan-interface' ); ?></span>
+					<h4 class="text-jelly-bean title-leave"><?php _e( 'Leave your comment', 'tainacan-interface' ); ?></h4>
 					<?php if ( is_user_logged_in() ) { ?>
 						<span class="text-oslo-gray authenticated ml-sm-3 d-none d-sm-block align-self-center">
 						<?php _e( 'Authenticated as:', 'tainacan-interface' );
@@ -45,9 +45,9 @@ if ( post_password_required() ) {
 						'title_reply' => '',
 						'title_reply_before' => '',
 						'title_reply_after' => '',
-						'comment_field' => sprintf( '<div class="form-row"><div class="col-3 col-md-1 align-self-center form-row--avartar"><img src="%1$s" class="img-fluid rounded-circle"></div>', get_avatar_url( $current_user->ID, array(
+						'comment_field' => sprintf( '<div class="form-row"><div class="col-3 col-md-1 align-self-center form-row--avartar"><img src="%1$s" class="img-fluid rounded-circle" alt="Avatar"></div>', get_avatar_url( $current_user->ID, array(
 							'size' => 60,
-						) ) ) . '<div class="col-9 col-md-11 form-row--textarea"><textarea name="comment" id="comment" tabindex="1" required class="form-control mt-2 mt-sm-0" rows="2"></textarea></div></div>',
+						) ) ) . '<div class="col-9 col-md-11 form-row--textarea"><label for="comment" class="sr-only">Comentário</label><textarea name="comment" id="comment" tabindex="1" required class="form-control mt-2 mt-sm-0" rows="2"></textarea></div></div>',
 						'cancel_reply_before' => '',
 						'cancel_reply_after' => '',
 						'class_submit' => 'btn btn-info bg-jungle-green align-self-center mt-3 float-right ml-auto comment-submit-link',

src/footer.php

@@ -1,5 +1,5 @@
 <?php if ( ! is_404() ) : ?>
-	<footer class="container-fluid p-4 p-sm-5 mt-5 tainacan-footer" style="padding-bottom: 0 !important;">
+	<footer id="footer" class="container-fluid p-4 p-sm-5 mt-5 tainacan-footer" style="padding-bottom: 0 !important;">
 		<?php if ( is_active_sidebar( 'tainacan-sidebar-footer' ) ) { ?>
 			<div class="row">
 				<div class="col-12 col-lg">
@@ -12,35 +12,42 @@
 		<hr class="bg-scooter"/>
 		<div class="row p-4 tainacan-footer-info">
 			<div class="col text-white font-weight-normal">
-				<p class="tainacan-footer-info--blog">
+				<?php
-					<?php echo bloginfo( 'title' );
+					if (get_bloginfo('title')) {
-					if ( ! wp_is_mobile() ) {
+						echo '<p class="tainacan-footer-info--blog">' . get_bloginfo('title');
+						if(!wp_is_mobile()):
 							echo '<br>';
-					} else {
+						else:
 							echo '</p><p>';
-					}
+						endif;
 						if ( get_option('blogaddress') ) {
 							echo get_option('blogaddress', ''); 
-					} ?>
-				</p>
-				<p class="tainacan-footer-info--blog">
-<?php if ( get_option( 'blogemail' ) ) {
-	printf( __( 'E-mail: %s', 'tainacan-interface' ), get_option( 'blogemail', '' ) );
 						}
-if ( get_option( 'blogemail' ) && get_option( 'blogphone' ) ) {
+						echo '</p>';
+					}
+				?>
+				<?php 
+					if( get_option('blogemail') ) {
+						echo '<p class="tainacan-footer-info--blog">';
+						printf(__('E-mail: %s', 'tainacan-theme'), get_option('blogemail', ''));
+						if(get_option('blogphone')) {
 							if(wp_is_mobile()):
 								echo '<br>';
 							else:
 								echo ' - ';
 							endif;
+							printf(__('Telephone: %s', 'tainacan-theme'), get_option('blogphone', ''));
 						}
-if ( get_option( 'blogphone' ) ) {
+						echo '</p>';
-	printf( __( 'Telephone: %s', 'tainacan-interface' ), get_option( 'blogphone', '' ) );
+					} elseif (get_option('blogphone')) {
-} ?>
+						echo '<p class="tainacan-footer-info--blog">';
-				</p>
+						printf(__('Telephone: %s', 'tainacan-theme'), get_option('blogphone', ''));
+						echo '</p>';
+					}
+				?>
 			</div>
 			<div class="col-auto pr-0 pr-md-3 d-none d-md-block align-self-md-top">
-					<img src="<?php if ( get_theme_mod( 'footer_logo' ) ) { echo esc_attr(get_theme_mod( 'footer_logo' )); } ?>" class="tainacan-footer-info--logo" alt="">
+				<!-- <img src="<?php /*if ( get_theme_mod( 'footer_logo' ) ) { echo esc_attr(get_theme_mod( 'footer_logo' )); } */?>" class="tainacan-footer-info--logo" alt="Tainacan - Logo preto e branco"> -->
 			</div>
 			<div class="col-12 tainacan-powered">
 				<span>

src/functions/enqueues.php

@@ -25,8 +25,8 @@ if ( ! function_exists( 'tainacan_enqueues' ) ) {
 		 * Slick Slider Carousel
 		 */
 			//Styles
-			wp_register_style( 'tainacan_SlickCss', get_template_directory_uri() . '/assets/vendor/slick/css/slick.min.css', '', '1.6.1', '' );
+			wp_register_style( 'tainacan_SlickCss', get_template_directory_uri() . '/assets/vendor/slick/css/slick.min.css', '', '1.6.1');
-			wp_register_style( 'tainacan_SlickThemeCss', get_template_directory_uri() . '/assets/vendor/slick/css/slick-theme.min.css', '', '1.6.1', '' );
+			wp_register_style( 'tainacan_SlickThemeCss', get_template_directory_uri() . '/assets/vendor/slick/css/slick-theme.min.css', '', '1.6.1');
 			wp_enqueue_style( 'tainacan_SlickCss' );
 			wp_enqueue_style( 'tainacan_SlickThemeCss' );
 			//Javascript
@@ -39,7 +39,7 @@ if ( ! function_exists( 'tainacan_enqueues' ) ) {
 		 	// Google fonts Roboto
 		 	wp_enqueue_style( 'tainacan_RobotoFonts', 'https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i' );
 			// Material Icons
-			wp_register_style( 'tainacan_MaterialIconsFonts', get_template_directory_uri() . '/assets/fonts/material-design-icons/css/materialdesignicons.min.css', '', '2.4.85', '' );
+			wp_register_style( 'tainacan_MaterialIconsFonts', get_template_directory_uri() . '/assets/fonts/material-design-icons/css/materialdesignicons.min.css', '', '2.4.85');
 			wp_enqueue_style( 'tainacan_MaterialIconsFonts' );
 
 		/**

src/header.php

@@ -10,26 +10,61 @@
 	<?php wp_head(); ?>
 </head>
 <body <?php body_class(); ?>>
+	<!-- MENU DE ACESSIBILIDADE -->
+	<div class="accessibility-bar compact-mode">
+		<div class="accessibility-bar__container">
+			<ul class="accessibility-shortcuts" role="menubar">
+				<li role="menuitem"><a href="#content" accesskey="c"><span>c</span> Ir para o conteúdo</a></li>
+				<li role="menuitem"><a href="#menu-menu-1" accesskey="m"><span>m</span> Ir para o menu</a></li>
+				<li role="menuitem"><a href="#tainacan-search-header" accesskey="b"><span>b</span> Ir para a busca</a></li>
+				<li role="menuitem"><a href="#footer" accesskey="r"><span>r</span> Ir para o rodapé</a></li>
+			</ul>
+
+			<ul class="accessibility-options" role="menubar">
+				<li role="menuitem">
+					<span>Fonte</span>
+					<button type="button" class="button-text-minus" accesskey="5">A-</button>
+					<button type="button" class="button-text-default" accesskey="6">A</button>
+					<button type="button" class="button-text-plus" accesskey="7">A+</button>
+				</li>
+				<li role="menuitem">
+					<span>Contraste</span>
+					<button type="button" class="button-high-contrast" accesskey="8">Alto Contraste</button>
+				</li>
+			</ul>
+		</div>
+	</div>
+
+	<!-- AVISO DE ERRO CASO O JS ESTEJA DESATIVADO OU NÃO ESTEJA FUNCIONANDO -->
+	<noscript>
+		<style>
+			noscript {
+				margin: 0;
+				padding: 12px 15px;
+				font-size: 18px;
+				color: #000;
+				text-align: center;
+				display: block;
+				background-color: #FFC107;
+			}
+		</style>
+
+		<span>Seu navegador não tem suporte a JavaScript ou o mesmo está desativado.</span>
+	</noscript>
 
 	<nav class="navbar navbar-expand-md navbar-light bg-white menu-shadow px-0">
 		<div class="container-fluid max-large px-0 margin-one-column" id="topNavbar">
 			<?php echo tainacan_get_logo(); ?>
 			<div class="btn-group ml-auto"> 
-					<form class="form-horizontal my-2 my-md-0 tainacan-search-form d-none d-md-block" [formGroup]="searchForm" role="form" (keyup.enter)="onSubmit()">
+				<form class="form-horizontal my-2 my-md-0 tainacan-search-form" [formGroup]="searchForm" role="form" (keyup.enter)="onSubmit()">
 					<div class="input-group">
-							<input type="text" name="s" placeholder="<?php _e( 'Search', 'tainacan-interface' ); ?>" class="form-control" formControlName="searchText" size="50">
+						<label for="tainacan-search-header" class="sr-only">Digite o que procura</label>
-							<span class="text-midnight-blue input-group-btn mdi mdi-magnify form-control-feedback"></span>
+						<input type="text" name="s" placeholder="<?php _e('Search', 'tainacan-interface'); ?>" class="form-control" formControlName="searchText" size="50" id="tainacan-search-header">
+						<button type="submit" class="form-control-feedback tainacan-search-button"><span class="text-midnight-blue input-group-btn mdi mdi-magnify"></span></button>
 					</div>
 				</form>
-					<div class="dropdown tainacan-form-dropdown d-md-none">
-						<a class="btn btn-link text-midnight-blue px-1 dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="mdi mdi-magnify"></i></a>
-
-						<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
-							<?php get_search_form(); ?>
-						</div>
-					</div>
 			</div>
 		</div>
 	</nav>
 
-	<a href="javascript:" id="return-to-top"><i class="mdi mdi-menu-up"></i></a>
+	<a href="javascript:" id="return-to-top"><i class="mdi mdi-menu-up"></i><span class="sr-only">Voltar ao topo</span></a>

src/index.php

@@ -8,7 +8,7 @@
 
 <main role="main" class="mt-5 max-large margin-one-column">
 	<div class="row">
-		<div class="col-12 <?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { ?>col-lg-9<?php } ?>">
+		<div id="content" class="col-12 <?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { ?>col-lg-9<?php } ?>">
 			<?php get_template_part( 'template-parts/loop' ); ?>
 		</div>
 		<?php if ( is_active_sidebar( 'tainacan-sidebar-right' ) ) { get_sidebar(); } ?>

src/searchform.php

@@ -1,7 +1,8 @@
 <form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
 	<div class="input-group border">
+		<label for="tainacan-search" class="sr-only">Digite o que procura</label>
 		<input class="form-control py-2 border-0" type="search" name="s" placeholder="<?php _e( 'Search', 'tainacan-interface' ); ?>" id="tainacan-search">
-		<span class="input-group-append d-none d-md-block">
+		<span class="input-group-append">
 			<button class="btn btn-outline-secondary border-0 border bg-white" type="submit">
 				<i class="mdi mdi-magnify" style="line-height: inherit;"></i>
 			</button>

src/single.php

@@ -5,7 +5,7 @@
 <!-- Get the menu if is create in panel admin -->
 <?php get_template_part( 'template-parts/menubellowbanner' ); ?>
 
-<main role="main" class="mt-5 max-large margin-one-column">
+<main id="content" role="main" class="mt-5 max-large margin-one-column">
 	<div class="row">
 		<div class="col col-sm mx-sm-auto">
 			<?php get_template_part( 'template-parts/loop', 'singular' ); ?>

src/tainacan/single-items.php

@@ -11,12 +11,12 @@
 				<?php while ( have_posts() ) : the_post(); ?>
 					<div class="tainacan-title">
 						<div class="border-bottom border-jelly-bean tainacan-title-page" style="border-width: 2px !important;">
-							<ul class="list-inline mb-1">
+							<div class="list-inline mb-1">
-								<li class="list-inline-item text-midnight-blue font-weight-bold title-page">
+								<h3 class="list-inline-item text-midnight-blue font-weight-bold title-page">
 									<?php the_title(); ?>
-								</li>
+								</h3>
-								<li class="list-inline-item float-right title-back"><a href="javascript:history.go(-1)"><?php _e( 'Back', 'tainacan-interface' ); ?></a></li>
+								<a href="javascript:history.go(-1)" class="list-inline-item float-right title-back"><?php _e( 'Back', 'tainacan-interface' ); ?></a>
-							</ul>
+							</div>
 						</div>
 					</div>
 					
@@ -30,7 +30,7 @@
 								</div>
 							</header>
 							<?php if ( tainacan_has_document() ) : ?>
-								<h1 class="title-content-items"><?php _e( 'Document', 'tainacan-interface' ); ?></h1>
+								<h3 class="title-content-items"><?php _e( 'Document', 'tainacan-interface' ); ?></h3>
 								<section class="tainacan-content single-item-collection margin-two-column">
 									<div class="single-item-collection--document">
 										<?php tainacan_the_document(); ?>
@@ -67,7 +67,7 @@
 
 						<div class="mt-3 tainacan-single-post">
 							<article role="article">
-								<h1 class="title-content-items"><?php _e( 'Attachments', 'tainacan-interface' ); ?></h1>
+								<h3 class="title-content-items"><?php _e( 'Attachments', 'tainacan-interface' ); ?></h3>
 								<section class="tainacan-content single-item-collection margin-two-column">
 									<div class="single-item-collection--attachments">
 										<?php foreach ( $attachment as $attachment ) { ?>
@@ -96,7 +96,7 @@
 
 					<div class="mt-3 tainacan-single-post">
 						<article role="article">
-							<!-- <h1 class="title-content-items"><?php _e( 'Information', 'tainacan-interface' ); ?></h1> -->
+							<!-- <h3 class="title-content-items"><?php _e( 'Information', 'tainacan-interface' ); ?></h3> -->
 							<section class="tainacan-content single-item-collection margin-two-column">
 								<div class="single-item-collection--information justify-content-center">
 									<div class="row">
@@ -104,7 +104,7 @@
 											<div class="card border-0">
 												<div class="card-body bg-white border-0 pl-0 pt-0 pb-1">
 													<h3><?php _e( 'Thumbnail', 'tainacan-interface' ); ?></h3>
-													<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-medium-full' ) ?>" class="item-card--thumbnail mt-2">
+													<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-medium-full' ) ?>" class="item-card--thumbnail mt-2" alt="Thumbnail">
 												</div>
 											</div>
 											<div class="card border-0 my-3">
@@ -113,7 +113,7 @@
 													<div class="btn-group" role="group">
 														<?php if ( true == get_theme_mod( 'facebook_share', true ) ) : ?> 
 															<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>" class="item-card-link--sharing" target="_blank">
-																<img src="<?php echo get_template_directory_uri() . '/assets/images/facebook-circle.png'; ?>" alt="">
+																<img src="<?php echo get_template_directory_uri() . '/assets/images/facebook-circle.png'; ?>" alt="Facebook">
 															</a>
 														<?php endif; ?>
 														<?php if ( true == get_theme_mod( 'twitter_share', true ) ) : ?> 
@@ -122,12 +122,12 @@
 															$via = ! empty( $twitter_option ) ? '&amp;via=' . get_option( 'twitter_user' ) : '';
 															?>
 															<a href="http://twitter.com/share?url=<?php the_permalink(); ?>&amp;text=<?php the_title_attribute(); ?><?php echo $via; ?>" target="_blank" class="item-card-link--sharing">
-																<img src="<?php echo get_template_directory_uri() . '/assets/images/twitter-circle.png'; ?>" alt="">
+																<img src="<?php echo get_template_directory_uri() . '/assets/images/twitter-circle.png'; ?>" alt="Twitter">
 															</a>
 														<?php endif; ?>
 														<?php if ( true == get_theme_mod( 'google_share', true ) ) : ?> 
 															<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" target="_blank" class="item-card-link--sharing">
-																<img src="<?php echo get_template_directory_uri() . '/assets/images/google-plus-circle.png'; ?>" alt="">
+																<img src="<?php echo get_template_directory_uri() . '/assets/images/google-plus-circle.png'; ?>" alt="Google Plus">
 															</a>
 														<?php endif; ?>
 													</div>

src/template-parts/bannerheader.php

@@ -1,7 +1,7 @@
 <div <?php if ( get_header_image() ) : ?>class="page-header header-filter clear-filter page-height" style="background-image: url('<?php header_image(); ?>')"<?php else : ?>class="page-header header-filter clear-filter align-items-center" style="background-image: url('<?php echo get_template_directory_uri() ?>/assets/images/capa.png')"<?php endif; ?>>
 	<div class="container-fluid max-large p-0 ph-title-description">
 		<div class="bg-white-title title-header <?php if ( is_singular() || is_archive() || is_search() || is_home() ) { echo 'singular-title'; }?>">
-			<h1 class="mb-0 text-truncate">
+			<h2 class="page-title mb-0 text-truncate">
 				<?php
 				if ( is_home() ) {
 					bloginfo( 'title' );
@@ -26,7 +26,7 @@
 						endif;
 					}
 				} ?>
-			</h1>
+			</h2>
 		</div>
 	</div>
 </div>

src/template-parts/headercollection.php

@@ -34,7 +34,7 @@ echo '</style>';
 		<div class="collection-header position-relative max-large" style="">
 			<?php do_action( 'tainacan-interface-collection-header' ); ?>
 			<?php if ( has_post_thumbnail( tainacan_get_collection_id() ) ) : ?>
-				<img src="<?php echo get_the_post_thumbnail_url( tainacan_get_collection_id() ); ?>" class="t-collection--info-img rounded-circle img-fluid border border-white position-absolute text-left">
+				<img src="<?php echo get_the_post_thumbnail_url( tainacan_get_collection_id() ); ?>" class="t-collection--info-img rounded-circle img-fluid border border-white position-absolute text-left" alt="Image">
 			<?php else : ?>
 				<div class="image-placeholder rounded-circle border border-white position-absolute">
 					<h4 class="text-center">

src/template-parts/list-post.php

@@ -1,7 +1,7 @@
 <div class="row blog-post mb-3">
 	<?php if ( has_post_thumbnail() ) : ?>
 		<div class="col-xs-12 col-md-4 blog-thumbnail align-self-center text-center mb-4 mb-md-0">
-			<a href="<?php the_permalink(); ?>"><img src="<?php echo get_the_post_thumbnail_url( get_the_ID(),'tainacan-interface-list-post' ) ?>" class="img-fluid" alt=""></a>
+			<a href="<?php the_permalink(); ?>"><img src="<?php echo get_the_post_thumbnail_url( get_the_ID(),'tainacan-interface-list-post' ) ?>" class="img-fluid" alt="Thumbnail"></a>
 		</div>
 	<?php endif; ?>
 	<div class="col-xs-12 blog-content <?php if ( has_post_thumbnail() ) :?>col-md-8 blog-flex<?php else : ?>col-md-12<?php endif; ?> align-self-center">

src/template-parts/loop-singular.php

@@ -2,12 +2,12 @@
 	<?php while ( have_posts() ) : the_post(); ?>
 		<div class="tainacan-title">
 			<div class="border-bottom border-jelly-bean tainacan-title-page" style="border-width: 2px !important;">
-				<ul class="list-inline mb-1">
+				<div class="list-inline mb-1">
-					<li class="list-inline-item text-midnight-blue font-weight-bold title-page">
+					<h3 class="list-inline-item text-midnight-blue font-weight-bold title-page">
 						<?php the_title(); ?>
-					</li>
+					</h3>
-					<li class="list-inline-item float-right title-back"><a href="javascript:history.go(-1)"><?php _e( 'Back', 'tainacan-interface' ); ?></a></li>
+					<a href="javascript:history.go(-1)" class="list-inline-item float-right title-back"><?php _e( 'Back', 'tainacan-interface' ); ?></a>
-				</ul>
+				</div>
 			</div>
 		</div>
 		<div class="mt-3 tainacan-single-post">

src/template-parts/loop-tainacan-collection-grid.php

@@ -8,7 +8,7 @@
 							<?php the_title(); ?>           
 						</p>
 						<?php if ( has_post_thumbnail() ) : ?>
-							<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-medium' ) ?>" class="img-fluid tainacan-list-collection--grid-img" alt="">  
+							<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-medium' ) ?>" class="img-fluid tainacan-list-collection--grid-img" alt="Thumbnail">  
 						<?php else : ?>
 							<div class="image-placeholder">
 								<h4 class="text-center">

src/template-parts/loop-tainacan-collection-table.php

@@ -15,7 +15,7 @@
 					<tr class="tainacan-list-collection" onclick="location.href='<?php the_permalink(); ?>'">
 						<td class="collection-miniature">
 							<?php if ( has_post_thumbnail() ) : ?>
-								<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-small' ) ?>" class="img-fluid rounded-circle" alt="">
+								<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'tainacan-small' ) ?>" class="img-fluid rounded-circle" alt="Thumbnail">
 							<?php else : ?>
 								<div class="image-placeholder">
 									<h4>

src/template-parts/loop-tainacan-collection.php

@@ -7,7 +7,7 @@
 						<h5 class="tainacan-list-collection--title text-black text-left p-3 mb-0 text-truncate"><?php the_title(); ?></h5>
 						<div class="media">
 							<?php if ( has_post_thumbnail() ) : ?>
-								<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'collection-list-card' ) ?>" class="tainacan-list-collection--card-img rounded-0 align-self-center mr-3" alt="">  
+								<img src="<?php echo get_the_post_thumbnail_url( get_the_ID(), 'collection-list-card' ) ?>" class="tainacan-list-collection--card-img rounded-0 align-self-center mr-3" alt="Thumbnail">  
 							<?php else : ?>
 								<div class="image-placeholder">
 									<h4>

src/template-parts/loop.php

@@ -1,8 +1,8 @@
 <?php if ( have_posts() ) : ?>
 	<div class="tainacan-title">
 		<div class="border-bottom border-jelly-bean tainacan-title-page">
-			<ul class="list-inline mb-1 d-flex">
+			<div class="list-inline mb-1 d-flex">
-				<li class="list-inline-item text-midnight-blue font-weight-bold title-page">
+				<h3 class="list-inline-item text-midnight-blue font-weight-bold title-page">
 					<?php if ( is_home() ) {
 						if ( get_option( 'page_for_posts' ) ) :
 							echo get_the_title( get_option( 'page_for_posts' ) );
@@ -15,9 +15,9 @@
 } elseif ( is_archive() ) {
 	echo ' ' . get_the_archive_title();
 } ?>
-				</li>
+				</h3>
-				<li class="list-inline-item float-right title-back align-self-end ml-auto"><a href="javascript:history.go(-1)"><?php _e( 'Back', 'tainacan-interface' ); ?></a></li>
+				<a href="javascript:history.go(-1)" class="list-inline-item float-right title-back align-self-end ml-auto"><?php _e( 'Back', 'tainacan-interface' ); ?></a>
-			</ul>
+			</div>
 		</div>
 	</div>
 

src/template-parts/menubellowbanner.php

@@ -9,7 +9,6 @@
 	<nav class="navbar navbar-expand-md navbar-light bg-white px-0 border-bottom menu-belowheader" role="navigation">
 		<div class="container-fluid max-large px-0 margin-one-column">
 			<!-- Brand and toggle get grouped for better mobile display -->	
-			<a class="navbar-brand d-md-none" href="#"></a>
 			<button class="navbar-toggler text-heavy-metal border-0 px-2 pt-2" type="button" data-toggle="collapse" data-target="#menubelowHeader" aria-controls="menubelowHeader" aria-expanded="false" aria-label="Toggle navigation">	
 				<span class="navbar-toggler-icon"></span>	
 			</button>

src/template-parts/single-post.php

@@ -7,19 +7,19 @@
 			<div class="btn-group ml-auto" role="group">
 				<?php if ( true == get_theme_mod( 'facebook_share', true ) ) : ?> 
 					<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>" class="" target="_blank">
-						<img src="<?php echo get_template_directory_uri() . '/assets/images/facebook-circle.png'; ?>" alt="">
+						<img src="<?php echo get_template_directory_uri() . '/assets/images/facebook-circle.png'; ?>" alt="Facebook">
 					</a>
 				<?php endif; ?>
 				<?php if ( true == get_theme_mod( 'twitter_share', true ) ) : ?> 
 					<?php $twitter_option = get_option( 'twitter_user' ); ?>
 					<?php $via = ! empty( $twitter_option ) ? '&amp;via=' . get_option( 'twitter_user' ) : ''; ?>
 					<a href="http://twitter.com/share?url=<?php the_permalink(); ?>&amp;text=<?php the_title_attribute(); ?><?php echo $via; ?>" target="_blank" class="">
-						<img src="<?php echo get_template_directory_uri() . '/assets/images/twitter-circle.png'; ?>" alt="">
+						<img src="<?php echo get_template_directory_uri() . '/assets/images/twitter-circle.png'; ?>" alt="Twitter">
 					</a>
 				<?php endif; ?>
 				<?php if ( true == get_theme_mod( 'google_share', true ) ) : ?> 
 					<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" target="_blank" class="">
-						<img src="<?php echo get_template_directory_uri() . '/assets/images/google-plus-circle.png'; ?>" alt="">
+						<img src="<?php echo get_template_directory_uri() . '/assets/images/google-plus-circle.png'; ?>" alt="Google Plus">
 					</a>
 				<?php endif; ?>
 			</div>