xarxaprod
/
oficinasuport-wp-theme
2
0
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

styled + icons and buttons as :after in links

This commit is contained in:
jorge-vitrubio 2022-12-30 13:23:05 +01:00
parent 00b2e66250
commit b9a758dd35
6 changed files with 185 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
sass/base/elements/_buttons.scss
View File

@ -22,3 +22,42 @@ input[type="submit"],
border-color: $color__border-button-focus;
}
}
.button-more {
position:relative;
a {
padding-right: 1rem;
}
a::after {
content: "+";
display: inline-block;
position: absolute;
right: 0.4rem;
top: 55%;
font-family: $font__black;
font-size: 2rem;
line-height: 0;
}
&:hover a::after{
content: ">";
right: 0.3rem;
font-size:1.5rem;
}
}
.type-ofisuport-ajut {
.button-more {
width: 3rem;
height: 3rem;
a {
font-size: 0px;
&::after {
font-size:3rem;
right:0.5rem;
}
}
&:hover a::after {
font-size: 2rem;
right: 0.3rem;
}
}
}

48
sass/layouts/_no-sidebar.scss
View File

@ -15,11 +15,9 @@
}
> main {
grid-column: 2 / 4;
padding: 0 1rem;
}
> aside {
grid-column: 2 / 4;
padding: 0 1rem;
}
> footer {
grid-column: 1 / -1;
@ -47,10 +45,16 @@
}
}
.site-main {
padding: 0 1rem;
h1,h2,h3,h4,h5,h6,.entry-content {
margin:0;
margin: 0;
}
}
.home-featured {
padding: 0 1rem;
}
.site-footer {
}
}
.ofisuport-destacats,.ofisuport-featured,.archive-posts {
display: grid;
@ -58,16 +62,28 @@
gap: $grid__gap;
}
}
@media screen and (max-width: 48em) {
//only smaller than 48em
.no-sidebar {
.site-header {
}
.site-main {
}
.home-featured {
}
.site-footer {
}
}
}
@media screen and (min-width: 48em) {
//only bigger than 48em
.no-sidebar {
.site {
> header {
}
> main {
padding: 0 2rem;
}
> aside {
padding: 0 2rem;
}
> footer {
}
@ -80,6 +96,17 @@
border-top: 1px solid $color__grey-lighter;
}
}
.site-main {
padding: 0 2rem;
h1,h2,h3,h4,h5,h6,.entry-content {
margin:0;
}
}
.home-featured {
padding: 0 2rem;
}
.site-footer {
}
&.single {
.site-main {
width: 45rem;
@ -96,15 +123,14 @@
}
}
@media screen and (min-width: 80em) {
//only bigger than 80rem
.no-sidebar {
.site {
> header {
}
> main {
padding: 0;
}
> aside {
padding: 0;
}
> footer {
}
@ -118,5 +144,13 @@
.secondary {
}
}
.site-main {
padding: 0;
}
.home-featured {
padding: 0;
}
.site-footer {
}
}
}

31
sass/plugins/guttemberg/_guttemberg.scss
View File

@ -15,26 +15,31 @@
h1,h2,h3,h4,h5,h6 {
min-height: $font__size-body*4.8;
font-family: $font__black;
font-size: $font__size-body*2.3;
font-size: $font__size-body*2;
line-height: $font__line-height-body*0.8;
}
p {
font-family: $font__bold;
font-size: $font__size-body*0.9;
}
.big-plus-wrapper {
position: absolute;
bottom: 0;
}
.big-plus.white .wp-block-button__link {
margin: 0;
padding: 0;
a {
color: $color__white;
background-color: transparent;
font-size: $font__size-body*4.5;
line-height: 0;
font-weight: bold;
font-family: $font__black;
text-decoration: none;
&::after {
content: "+";
position: absolute;
bottom: -1rem;
left: 0.7rem;
font-size: 5rem;
}
&:hover {
color: $color__grey-light;
&::after {
content: ">";
font-size: 3rem;
bottom: 0;
}
}
}
}
}

112
style.css
View File

@ -753,6 +753,50 @@ input[type="submit"]:focus,
border-color: #222;
}
.button-more {
position: relative;
}
.button-more a {
padding-right: 1rem;
}
.button-more a::after {
content: "+";
display: inline-block;
position: absolute;
right: 0.4rem;
top: 55%;
font-family: "din-black", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 2rem;
line-height: 0;
}
.button-more:hover a::after {
content: ">";
right: 0.3rem;
font-size: 1.5rem;
}
.type-ofisuport-ajut .button-more {
width: 3rem;
height: 3rem;
}
.type-ofisuport-ajut .button-more a {
font-size: 0px;
}
.type-ofisuport-ajut .button-more a::after {
font-size: 3rem;
right: 0.5rem;
}
.type-ofisuport-ajut .button-more:hover a::after {
font-size: 2rem;
right: 0.3rem;
}
input[type="text"],
input[type="email"],
input[type="url"],
@ -820,11 +864,9 @@ textarea {
}
.no-sidebar .site > main {
grid-column: 2 / 4;
padding: 0 1rem;
}
.no-sidebar .site > aside {
grid-column: 2 / 4;
padding: 0 1rem;
}
.no-sidebar .site > footer {
grid-column: 1 / -1;
@ -850,9 +892,15 @@ textarea {
flex-flow: column;
align-items: center;
}
.no-sidebar .site-main {
padding: 0 1rem;
}
.no-sidebar .site-main h1, .no-sidebar .site-main h2, .no-sidebar .site-main h3, .no-sidebar .site-main h4, .no-sidebar .site-main h5, .no-sidebar .site-main h6, .no-sidebar .site-main .entry-content {
margin: 0;
}
.no-sidebar .home-featured {
padding: 0 1rem;
}
.ofisuport-destacats, .ofisuport-featured, .archive-posts {
display: grid;
grid-template-columns: repeat(1, 1fr);
@ -861,18 +909,21 @@ textarea {
}
@media screen and (min-width: 48em) {
.no-sidebar .site > main {
padding: 0 2rem;
}
.no-sidebar .site > aside {
padding: 0 2rem;
}
.no-sidebar .site-header .main {
flex-flow: column;
}
.no-sidebar .site-header .secondary {
border-top: 1px solid #eee;
}
.no-sidebar .site-main {
padding: 0 2rem;
}
.no-sidebar .site-main h1, .no-sidebar .site-main h2, .no-sidebar .site-main h3, .no-sidebar .site-main h4, .no-sidebar .site-main h5, .no-sidebar .site-main h6, .no-sidebar .site-main .entry-content {
margin: 0;
}
.no-sidebar .home-featured {
padding: 0 2rem;
}
.no-sidebar.single .site-main {
width: 45rem;
margin: 0 auto;
@ -886,17 +937,17 @@ textarea {
}
@media screen and (min-width: 80em) {
.no-sidebar .site > main {
padding: 0;
}
.no-sidebar .site > aside {
padding: 0;
}
.no-sidebar .site-header .main {
width: 80em;
margin: auto;
flex-flow: row;
}
.no-sidebar .site-main {
padding: 0;
}
.no-sidebar .home-featured {
padding: 0;
}
}
/*--------------------------------------------------------------
@ -1326,7 +1377,7 @@ textarea {
.black-blocs .wp-block-column h1, .black-blocs .wp-block-column h2, .black-blocs .wp-block-column h3, .black-blocs .wp-block-column h4, .black-blocs .wp-block-column h5, .black-blocs .wp-block-column h6 {
min-height: 4.8rem;
font-family: "din-black", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 2.3rem;
font-size: 2rem;
line-height: 1.04;
}
@ -1335,20 +1386,27 @@ textarea {
font-size: 0.9rem;
}
.black-blocs .wp-block-column .big-plus-wrapper {
position: absolute;
bottom: 0;
.black-blocs .wp-block-column a {
color: #fff;
text-decoration: none;
}
.black-blocs .wp-block-column .big-plus.white .wp-block-button__link {
margin: 0;
padding: 0;
color: #fff;
background-color: transparent;
font-size: 4.5rem;
line-height: 0;
font-weight: bold;
font-family: "din-black", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
.black-blocs .wp-block-column a::after {
content: "+";
position: absolute;
bottom: -1rem;
left: 0.7rem;
font-size: 5rem;
}
.black-blocs .wp-block-column a:hover {
color: #ccc;
}
.black-blocs .wp-block-column a:hover::after {
content: ">";
font-size: 3rem;
bottom: 0;
}
/* Contact Form 7

2
style.css.map
View File

File diff suppressed because one or more lines are too long

2
template-parts/section-featured.php
View File

@ -9,7 +9,7 @@
?>
<aside>
<aside id="destacats" class="home-featured home-destacats">
<?php
// Detect plugin. For use on Front End only.
include_once( ABSPATH . 'wp-admin/includes/plugin.php' );