Fazendo js nao obstrusivo, corrigindo o estilo dos campos do formulario de comentarios
This commit is contained in:
Alvino Rodrigues
parent
c07d8a4333
commit
4c3c806471
|
|
@ -180,4 +180,10 @@ jQuery( document ).ready(function( $ ) {
|
|||
_formBuscaFilho.removeClass('hover');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
/*
|
||||
* ADICIONANDO JS NÃO OBSTRUSIVO
|
||||
*/
|
||||
$('body').addClass('js');
|
||||
});
|
||||
|
|
|
|||
|
|
@ -14,16 +14,6 @@
|
|||
color: #898d8f;
|
||||
}
|
||||
.form-row{
|
||||
@media only screen and (min-width: 768px){
|
||||
.form-row--avartar {
|
||||
flex: 0 0 5.333333%;
|
||||
max-width: 5.333333%;
|
||||
}
|
||||
.form-row--textarea {
|
||||
flex: 0 0 94.666667%;
|
||||
max-width: 94.666667%;
|
||||
}
|
||||
}
|
||||
img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
|
|
@ -41,18 +31,35 @@
|
|||
}
|
||||
p[class^="comment-form-"] {
|
||||
margin-bottom: 22px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
label{
|
||||
width: 100%;
|
||||
max-width: 25%;
|
||||
margin-right: 0;
|
||||
padding-right: 5px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
margin-right: 1.8%;
|
||||
}
|
||||
input {
|
||||
width: 50%;
|
||||
width: 100%;
|
||||
max-width: 75%;
|
||||
margin-left: 3px;
|
||||
border: 1px solid #cbcbcb;
|
||||
height: 30px;
|
||||
@media only screen and (max-width: 576px) {
|
||||
width: 82%;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
display: block;
|
||||
|
||||
label{
|
||||
max-width: 100%;
|
||||
padding-right: 0;
|
||||
}
|
||||
input {
|
||||
max-width: 100%;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -72,18 +79,16 @@
|
|||
}
|
||||
.comment-form-url {
|
||||
margin-bottom: 30px !important;
|
||||
label {
|
||||
margin-right: 1.4% !important;
|
||||
@media only screen and (max-width: 576px) {
|
||||
margin-right: 0.3% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mx-sm-auto{
|
||||
@media only screen and (max-width: 576px){
|
||||
padding: 0 2rem;
|
||||
}
|
||||
}
|
||||
textarea.form-control {
|
||||
border-radius: 0;
|
||||
border: 1px solid #cbcbcb;
|
||||
}
|
||||
/* textarea{
|
||||
@media only screen {
|
||||
@media (max-width: 576px){
|
||||
|
|
|
|||
|
|
@ -329,7 +329,31 @@ nav{
|
|||
|
||||
@media screen and (max-width: 768px) {
|
||||
.navbar { z-index: 2; }
|
||||
/* JS NÃO OBSTRUSIVO */
|
||||
.tainacan-search-form .input-group {
|
||||
.form-control {
|
||||
width: 200px;
|
||||
height: 38px;
|
||||
padding: 1rem;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 1;
|
||||
border-radius: .25rem;
|
||||
border: 1px solid rgba(0,0,0,0.15);
|
||||
background-clip: padding-box;
|
||||
background-color: #fff;
|
||||
z-index: 2;
|
||||
transform: translate(0,50px);
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
width: 200px;
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
body.js .tainacan-search-form .input-group {
|
||||
.form-control {
|
||||
width: 200px;
|
||||
height: 38px;
|
||||
|
|
@ -343,6 +367,7 @@ nav{
|
|||
background-clip: padding-box;
|
||||
background-color: #fff;
|
||||
z-index: -2;
|
||||
transform: translate(0,0);
|
||||
transition: transform 0.35s, opacity 0.35s, border 0.35s, z-index 0s 0.35s;
|
||||
|
||||
&:focus {
|
||||
|
|
@ -717,7 +742,8 @@ nav{
|
|||
background: #01295C;
|
||||
}
|
||||
|
||||
.accessibility-options {
|
||||
.accessibility-options { display: none; }
|
||||
body.js .accessibility-options {
|
||||
height: 24px;
|
||||
margin: 0 -10px;
|
||||
padding: 0;
|
||||
|
|
@ -819,6 +845,13 @@ nav{
|
|||
.accessibility-bar.compact-mode .accessibility-shortcuts a:focus { transform: translate(-50%,160px); }
|
||||
}
|
||||
|
||||
/*
|
||||
- ADICIONANDO JS NÃO OBSTRUSIVO
|
||||
*/
|
||||
|
||||
.collapse:not(.show) { display: block; }
|
||||
body.js .collapse:not(.show) { display: none; }
|
||||
|
||||
/*
|
||||
- ALTO CONTRASTE
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -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" alt="Avatar"></div>', get_avatar_url( $current_user->ID, array(
|
||||
'comment_field' => sprintf( '<div class="form-row"><div class="col-12 col-md-3 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"><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>',
|
||||
) ) ) . '<div class="col-12 col-md-9 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',
|
||||
|
|
|
|||
Loading…
Reference in New Issue