manuelcillero/pagetop
manuelcillero/pagetop
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

🚚 Better class names for inner content

Browse source
This commit is contained in:
Manuel Cillero 2024-03-11 20:11:35 +01:00
parent 193a1b3911
commit b4bb82aa69
8 changed files with 81 additions and 81 deletions
Download patch file Download diff file Expand all files Collapse all files

4
static/base/css/looks.css
View file

@ -257,7 +257,7 @@
/* Branding component */
.branding__inner {
.branding__content {
display: flex;
align-items: flex-end;
column-gap: var(--val-gap-0-75);
@ -265,6 +265,8 @@
.branding__name {
letter-spacing: 0.02em;
font-size: var(--val-fs--l);
font-weight: 700;
text-decoration: none;
}
.branding__slogan {
font-size: var(--val-fs--m);

10
static/base/css/menu.css
View file

@ -9,11 +9,11 @@
background: var(--val-menu--color-bg);
}
.menu__inner {
.menu__content {
padding-right: var(--val-gap);
}
.menu__inner a,
.menu__inner button {
.menu__content a,
.menu__content button {
cursor: pointer;
border: none;
background: none;
@ -119,10 +119,10 @@
.menu__container {
border-radius: var(--val-border-radius);
}
.menu__inner {
.menu__content {
padding-right: var(--val-gap-0-5);
}
.menu__inner button {
.menu__content button {
margin: var(--val-gap-0-5) 0 var(--val-gap-0-5) var(--val-gap-0-5);
}
.menu__trigger {

26
static/base/css/welcome.css
View file

@ -16,11 +16,11 @@
padding-top: 0;
}
#welcome [class$="-col-text"] > .flex-item__inner {
#welcome [class$="-col-text"] > .flex-item__content {
margin: 5% 5% 0;
text-align: center;
}
#welcome [class$="-col-image"] > .flex-item__inner {
#welcome [class$="-col-image"] > .flex-item__content {
margin: 1rem 5%;
}
@ -28,7 +28,7 @@
text-align: center;
margin: 0 5%;
}
#welcome .welcome > .wrapper__inner {
#welcome .welcome > .wrapper__content {
padding: 2rem 1rem;
border-radius: 28px;
background: url("/base/images/welcome.jpg") center center no-repeat;
@ -36,18 +36,18 @@
background-size: cover;
color: #fff;
}
#welcome .welcome > .wrapper__inner > h2 {
#welcome .welcome > .wrapper__content > h2 {
color: #fff;
}
#welcome .welcome > .wrapper__inner > h3 {
#welcome .welcome > .wrapper__content > h3 {
color: #ccc;
}
#welcome .promo-col-image > .flex-item__inner {
#welcome .promo-col-image > .flex-item__content {
padding: 0 5%;
}
#welcome .issues-col-image > .flex-item__inner img {
#welcome .issues-col-image > .flex-item__content img {
border-radius: 40px;
}
@ -55,20 +55,20 @@
/* MD - Applies >= 768px */
@media screen and (min-width: 48rem) {
#welcome .promo-col-image > .flex-item__inner {
#welcome .promo-col-image > .flex-item__content {
padding: 0;
}
#welcome .issues {
padding-top: 1.6rem;
}
#welcome .issues-col-text > .flex-item__inner {
#welcome .issues-col-text > .flex-item__content {
text-align: left;
}
}
/* LG - Applies >= 992px */
@media screen and (min-width: 62rem) {
#welcome .hello-col-text > .flex-item__inner {
#welcome .hello-col-text > .flex-item__content {
margin-top: 2rem;
text-align: left;
}
@ -77,19 +77,19 @@
padding: 0 15% 2rem;
}
#welcome .promo-col-text > .flex-item__inner {
#welcome .promo-col-text > .flex-item__content {
margin-right: 0;
text-align: right;
}
}
/* XL - Applies >= 1280px */
@media screen and (min-width: 80rem) {
#welcome .hello-col-text > .flex-item__inner {
#welcome .hello-col-text > .flex-item__content {
margin-top: 4rem;
margin-left: 20%;
}
#welcome .pagetop-col-text > .flex-item__inner {
#welcome .pagetop-col-text > .flex-item__content {
text-align: left;
}
}