Some css tweaks to minimum compatibility with block widget.

This commit is contained in:
mateuswetah 2021-08-12 14:43:27 -03:00
parent da1e1fffe6
commit 2335fd1187
2 changed files with 286 additions and 273 deletions

View File

@ -1,156 +1,49 @@
footer { footer.tainacan-footer {
&.tainacan-footer { background-color: #2c2d2d;
background-color: #2c2d2d; color: white;
a { a {
color: #9f9f9f; color: #9f9f9f;
&:hover { &:hover {
color: white;
font-weight: 600;
text-decoration: none;
}
}
.tainacan-footer-widgets-area {
@media only screen and (max-width: 991px){
margin: 0 calc(4.16666666667% * 1);
margin: 0 calc(4.16666666667vw * 1);
}
@media only screen and (min-width: 992px){
margin: 0 calc(4.16666666667% * 2);
margin: 0 calc(4.16666666667vw * 2);
}
nav {
border: none;
}
.tainacan-side ul,
.tainacan-side ol {
list-style: inside;
li{
color: white; color: white;
font-weight: 600; margin-bottom: 0.875rem;
text-decoration: none;
}
}
.tainacan-footer-widgets-area {
@media only screen and (max-width: 991px){
margin: 0 calc(4.16666666667% * 1);
margin: 0 calc(4.16666666667vw * 1);
}
@media only screen and (min-width: 992px){
margin: 0 calc(4.16666666667% * 2);
margin: 0 calc(4.16666666667vw * 2);
}
nav {
border: none;
}
.tainacan-side ul,
.tainacan-side ol {
list-style: inside;
li{ &.tainacan-side {
color: white; h6 {
margin-bottom: 0.875rem; font: {
size: 1.125rem;
&.tainacan-side {
h6 {
font: {
size: 1.125rem;
}
}
}
p {
.fiber{
font-size: 0.5625rem;
}
}
a {
color: #9f9f9f;
&:hover {
color: white;
font-weight: 600;
text-decoration: none;
} }
} }
} }
} p {
.gallery { .fiber{
display: flex; font-size: 0.5625rem;
flex-wrap: wrap;
max-height: 485px;
overflow: hidden;
justify-content: flex-start;
align-items: flex-start;
.gallery-item{
margin: 5px !important;
width: auto !important;
img {
border: none !important;
} }
} }
.gallery-caption {
display: none;
}
br{
display: none;
}
}
.image {
max-width: 100%;
height: auto;
}
.input-group {
background: white;
padding: 0rem;
align-items: center;
height: 2.5rem;
.btn {
border-radius: 0px;
border-color: #dbdbdb;
min-height: 40px;
&:hover {
color: #454647;
}
}
}
.form-control {
height: 100%;
border-radius: 0;
font-size: 0.875rem;
font-weight: 400;
color: #898d8f;
padding-right: 2rem;
&:focus {
color: #454647;
box-shadow: none;
border: 1px solid #555758 !important;
}
}
.search-controls {
background: #f2f2f2;
border-bottom: 1px solid #dee2e6;
border-left: 1px solid #dee2e6;
border-right: 1px solid #dee2e6;
padding: 0.75rem 0.875rem 0.5rem 0.875rem;
font-size: 0.75rem;
column-count: 2;
label {
white-space: normal;
display: flex;
color: #454647;
align-items: center;
input {
margin-right: 0.5rem;
}
}
}
}
.tainacan-footer-info {
font-size: 0.875rem;
width: auto;
@media only screen and (max-width: 991px){
margin: 0 calc(4.16666666667% * 1);
margin: 0 calc(4.16666666667vw * 1);
}
@media only screen and (min-width: 992px){
margin: 0 calc(4.16666666667% * 2);
margin: 0 calc(4.16666666667vw * 2);
}
.tainacan-footer-info--blog {
font-weight: 400;
margin-bottom: 2rem;
}
.tainacan-footer-info--logo {
width: 120px;
}
.tainacan-powered {
font-weight: 400;
color: #cbcbcb;
a { a {
color: #f9f9f9; color: #9f9f9f;
&:hover { &:hover {
color: white; color: white;
font-weight: 600; font-weight: 600;
@ -159,58 +52,162 @@ footer {
} }
} }
} }
&.tainacan-footer-colored { h1,
background-color: #298596; h2,
a { h3,
color: #e6f6f8; h4,
} h5,
.tainacan-footer-widgets-area { h6 {
.tainacan-side ul, color: white;
.tainacan-side ol { font-size: 1.125rem !important;
li { }
a { .gallery {
color: #e6f6f8; display: flex;
} flex-wrap: wrap;
} max-height: 485px;
overflow: hidden;
justify-content: flex-start;
align-items: flex-start;
.gallery-item{
margin: 5px !important;
width: auto !important;
img {
border: none !important;
} }
} }
.tainacan-footer-info { .gallery-caption {
.tainacan-powered { display: none;
color: #e6f6f8; }
br{
display: none;
}
}
.image {
max-width: 100%;
height: auto;
}
.input-group {
background: white;
padding: 0rem;
align-items: center;
height: 2.5rem;
.btn {
border-radius: 0px;
border-color: #dbdbdb;
min-height: 40px;
&:hover {
color: #454647;
} }
} }
} }
&.tainacan-footer-light { .form-control {
background-color: #f2f2f2; height: 100%;
.text-white { border-radius: 0;
color: #454647 !important; font-size: 0.875rem;
} font-weight: 400;
a { color: #898d8f;
padding-right: 2rem;
&:focus {
color: #454647; color: #454647;
&:hover { box-shadow: none;
color: black; border: 1px solid #555758 !important;
}
}
.search-controls {
background: #f2f2f2;
border-bottom: 1px solid #dee2e6;
border-left: 1px solid #dee2e6;
border-right: 1px solid #dee2e6;
padding: 0.75rem 0.875rem 0.5rem 0.875rem;
font-size: 0.75rem;
column-count: 2;
label {
white-space: normal;
display: flex;
color: #454647;
align-items: center;
input {
margin-right: 0.5rem;
} }
} }
}
.tainacan-footer-widgets-area { }
.tainacan-side ul, .tainacan-footer-info {
.tainacan-side ol { font-size: 0.875rem;
li{ width: auto;
color: black;
a { @media only screen and (max-width: 991px){
color: #454647; margin: 0 calc(4.16666666667% * 1);
&:hover { margin: 0 calc(4.16666666667vw * 1);
color: black; }
} @media only screen and (min-width: 992px){
} margin: 0 calc(4.16666666667% * 2);
margin: 0 calc(4.16666666667vw * 2);
}
.tainacan-footer-info--blog {
font-weight: 400;
margin-bottom: 2rem;
}
.tainacan-footer-info--logo {
width: 120px;
}
.tainacan-powered {
font-weight: 400;
color: #cbcbcb;
a {
color: #f9f9f9;
&:hover {
color: white;
font-weight: 600;
text-decoration: none;
}
}
}
}
&.tainacan-footer-colored {
background-color: #298596;
a {
color: #e6f6f8;
}
.tainacan-footer-widgets-area {
.tainacan-side ul,
.tainacan-side ol {
li {
a {
color: #e6f6f8;
} }
} }
} }
.tainacan-footer-info { }
.tainacan-powered { .tainacan-footer-info {
color: #454647; .tainacan-powered {
color: #e6f6f8;
}
}
}
&.tainacan-footer-light {
background-color: #f2f2f2;
.text-white {
color: #454647 !important;
}
a {
color: #454647;
&:hover {
color: black;
}
}
.tainacan-footer-widgets-area {
.tainacan-side ul,
.tainacan-side ol {
li{
color: black;
a { a {
color: #222; color: #454647;
&:hover { &:hover {
color: black; color: black;
} }
@ -218,5 +215,16 @@ footer {
} }
} }
} }
.tainacan-footer-info {
.tainacan-powered {
color: #454647;
a {
color: #222;
&:hover {
color: black;
}
}
}
}
} }
} }

View File

@ -3,101 +3,106 @@
border-top: none !important; border-top: none !important;
} }
} }
#sidebar{ #sidebar.sidebar {
&.sidebar{ .widget {
.widget{ .widget-title,
.widget-title{ &.widget_block>.wp-block-group>.wp-block-group__inner-container>h1,
font-size: 1rem; &.widget_block>.wp-block-group>.wp-block-group__inner-container>h2,
font-weight: bold; &.widget_block>.wp-block-group>.wp-block-group__inner-container>h3,
color: #1d1d1b; &.widget_block>.wp-block-group>.wp-block-group__inner-container>h4,
} &.widget_block>.wp-block-group>.wp-block-group__inner-container>h5,
&.widget_recent_entries, &.widget_recent_comments{ &.widget_block>.wp-block-group>.wp-block-group__inner-container>h6
ul{ {
li{ font-size: 1rem !important;
margin-bottom: 0.3rem; font-weight: bold;
} color: #1d1d1b;
} }
} &.widget_recent_entries, &.widget_recent_comments{
&.widget_media_gallery{
.gallery{
display: grid;
dl{
margin-top: 0;
dt{
img{
border: 0;
}
}
}
br{
display: none;
}
}
}
&.widget_text{
font-size: 0.75rem;
}
table.wp-calendar-table {
font-size: 0.875rem;
td {
padding: 2px;
}
}
ul{ ul{
padding-left: 0;
li{ li{
display: block;
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
a{
font-weight: 400;
font-size: 0.875rem;
}
}
}
form {
.input-group-append{
button{
height: 30px;
padding: 0 5px 0 0px;
&:hover{
color: inherit;
}
i{
color: #01295c;
font-size: 1.1875rem;
}
}
}
}
#tainacan-search{
font-size: 0.75rem;
color: #555758;
border-color: #dbdbdb;
height: 30px;
border-radius: 0px;
&:focus{
box-shadow: none;
border-color: #555758;
}
&+.input-group-append button {
border-left-width: 0;
border-color: #dbdbdb;
border-radius: 0px;
padding: 0 5px;
} }
} }
} }
.search-controls { &.widget_media_gallery{
padding: 0.75rem 0.875rem 0.5rem 0.875rem; .gallery{
font-size: 0.75rem; display: grid;
column-count: 2; dl{
label { margin-top: 0;
white-space: normal; dt{
display: flex; img{
input { border: 0;
margin-right: 0.5rem; }
}
} }
br{
display: none;
}
}
}
&.widget_text{
font-size: 0.75rem;
}
table.wp-calendar-table {
font-size: 0.875rem;
td {
padding: 2px;
}
}
ul{
padding-left: 0;
li{
display: block;
margin-bottom: 0.3rem;
a{
font-weight: 400;
font-size: 0.875rem;
}
}
}
form {
.input-group-append{
button{
height: 30px;
padding: 0 5px 0 0px;
&:hover{
color: inherit;
}
i{
color: #01295c;
font-size: 1.1875rem;
}
}
}
}
#tainacan-search{
font-size: 0.75rem;
color: #555758;
border-color: #dbdbdb;
height: 30px;
border-radius: 0px;
&:focus{
box-shadow: none;
border-color: #555758;
}
&+.input-group-append button {
border-left-width: 0;
border-color: #dbdbdb;
border-radius: 0px;
padding: 0 5px;
}
}
}
.search-controls {
padding: 0.75rem 0.875rem 0.5rem 0.875rem;
font-size: 0.75rem;
column-count: 2;
label {
white-space: normal;
display: flex;
input {
margin-right: 0.5rem;
} }
} }
} }