Style tweaks. Added mobile styles. Using default font-family. Removed letter-spacing. Using flexbox to centre the content in the header.

This commit is contained in:
And Finally 2021-07-30 14:47:19 +01:00
parent d3d8aae4b4
commit 324c8e229a
1 changed files with 21 additions and 11 deletions

View File

@ -25,9 +25,12 @@
.marketplace-header { .marketplace-header {
background-image: url("../images/marketplace-header-bg@2x.png"); background-image: url("../images/marketplace-header-bg@2x.png");
background-position: right;
background-size: cover; background-size: cover;
font-family: sans-serif; display: flex;
padding-left: 84px; flex-direction: column;
justify-content: center;
padding: 24px;
min-height: 216px; min-height: 216px;
&__title { &__title {
@ -35,18 +38,15 @@
font-size: 32px; font-size: 32px;
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
letter-spacing: -0.32px; line-height: 1.15;
line-height: 24px;
margin-bottom: 8px; margin-bottom: 8px;
padding: 0; padding: 0;
padding-top: 47px;
} }
&__description { &__description {
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
line-height: 24px; line-height: 24px;
letter-spacing: -0.32px;
margin-bottom: 24px; margin-bottom: 24px;
margin-top: 0; margin-top: 0;
} }
@ -54,25 +54,27 @@
&__search-form { &__search-form {
clear: both; clear: both;
display: block; display: block;
max-width: 318px;
position: relative; position: relative;
input { input {
border: 1px solid #ddd; border: 1px solid #ddd;
box-shadow: none; box-shadow: none;
height: 53px; font-size: 13px;
height: 48px;
padding-left: 16px;
padding-right: 50px; padding-right: 50px;
width: 100%; width: 100%;
margin: 0; margin: 0;
max-width: 318px;
} }
button { button {
background: none; background: none;
border: none; border: none;
cursor: pointer; cursor: pointer;
height: 53px; height: 48px;
left: -53px; position: absolute;
position: relative; right: 0;
width: 53px; width: 53px;
} }
} }
@ -7452,3 +7454,11 @@ table.bar_chart {
color: darkred; color: darkred;
font-weight: bold; font-weight: bold;
} }
@media screen and (min-width: 600px) {
.wc_addons_wrap {
.marketplace-header {
padding-left: 84px;
}
}
}