xarxaprod
/
xarxaprod-wp-theme
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

styled sass as xarxaprod 2024

This commit is contained in:
jorge 2024-01-14 17:12:37 +01:00
parent 9dfc4c4c8e
commit dedfd511da
16 changed files with 843 additions and 2257 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1013
adminstyles.css
View File

File diff suppressed because it is too large Load Diff

2
assets/css/adminstyles.css
View File

File diff suppressed because one or more lines are too long

28
sass/abstracts/variables/_colors.scss
View File

@ -1,3 +1,13 @@
$color__xxp_black: #000000;
$color__xxp_white: #ffffff;
$color__xxp_salmon: #ff866f;
$color__xxp_yellow: #ffcb1f;
$color__xxp_pink: #ff6bc3;
$color__xxp_violet: #651aff;
$color__xxp_cyan: #00d1ec;
$color__xxp_green: #00f274;
$color__xxp_red: #ff5a69;
$color__white: #fff; $color__white: #fff;
$color__white-dark: #fdfdfd; $color__white-dark: #fdfdfd;
$color__white-transparent: rgba(255,255,255,0.95); $color__white-transparent: rgba(255,255,255,0.95);
@ -17,25 +27,25 @@ $color__green: #69ed82;
$color__red: #ff686e; $color__red: #ff686e;
$color__background-body: $color__white; $color__background-body: none;
$color__background-screen: $color__white; $color__background-screen: none;
$color__background-hr: $color__black; $color__background-hr: $color__black;
$color__background-button: $color__white; $color__background-button: none;
$color__background-pre: $color__grey-lighter; $color__background-pre: $color__grey-lighter;
$color__background-ins: $color__white-dark; $color__background-ins: $color__white-dark;
$color__background-input: $color__grey-lighter; $color__background-input: $color__grey-lighter;
$color__text-screen: $color__black; $color__text-screen: $color__black;
$color__text-input: $color__black-light; $color__text-input: $color__black-grey;
$color__text-input-focus: $color__black; $color__text-input-focus: $color__black;
$color__link: $color__black; $color__link: $color__black;
$color__link-visited: $color__black-grey; $color__link-visited: $color__link;
$color__link-hover: $color__black-light; $color__link-hover: $color__black-light;
$color__text-main: #202020; $color__text-main: $color__black;
$color__border-button: $color__black; $color__border-button: #000;
$color__border-button-hover: $color__black-grey; $color__border-button-hover: #111;
$color__border-button-focus: $color__black-light; $color__border-button-focus: #222;
$color__border-input: $color__black; $color__border-input: $color__black;
$color__border-abbr: $color__grey-dark; $color__border-abbr: $color__grey-dark;

9
sass/adminstyles.scss
View File

@ -29,15 +29,6 @@
display:none; display:none;
} }
} }
.editor-styles-wrapper .wp-block-button__link {
color: #000 !important;
background-color: #fff !important;
border-radius: 0 !important;
box-shadow: none !important;
text-decoration: none !important;
padding: 0.6em 1em 0.4em !important;
font-size: inherit !important;
}
// modify internal paths to make objects locally available // modify internal paths to make objects locally available
@import "adminstyles/fonts"; @import "adminstyles/fonts";

5
sass/base/elements/_body.scss
View File

@ -1,3 +1,8 @@
body { body {
background: $color__background-body; // Fallback for when there is no custom background color defined. background: $color__background-body; // Fallback for when there is no custom background color defined.
background-image: url(./assets/img/background-colors-02.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
} }

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

@ -11,7 +11,7 @@ input[type="submit"],
color: $color__text-screen; color: $color__text-screen;
line-height: 1; line-height: 1;
padding: 0.6em 1em 0.4em; padding: 0.6em 1em 0.4em;
text-transform: uppercase; //text-transform: uppercase;
&:hover { &:hover {
border-color: $color__border-button-hover; border-color: $color__border-button-hover;
@ -23,111 +23,28 @@ input[type="submit"],
} }
} }
.button-more { .button-more {
line-height: 2.5; //&::before {
// content: "accedir";
// position: absolute;
// bottom: 1em;
// left: 0.5em;
// font-family: $font__light;
// font-size: 1rem;
// line-height: 0;
//}
&::after { &::after {
content: "+"; content: "+";
display: inline-block; display: inline-block;
width: 2rem; width: 1.5rem;
font-family: $font__black; height: 2rem;
padding: 0 0.5rem;
font-family: $font__black;
font-size: 1.5rem; font-size: 1.5rem;
text-align: right;
} }
&:hover::after { &:hover::after {
content: ">"; content: ">";
font-size: 1rem; padding-left: 0.2rem;
font-size: 1.2rem;
line-height: 1.5;
} }
} }
.home-featured,.archive-posts {
.more-link {
position: relative;
.button-more {
border:none;
&::after {
content: "+";
position: absolute;
display: flex;
align-items: center;
justify-content: center;
width: 3rem;
height: 3rem;
bottom: 0;
left: 0;
padding: 0;
border: 1px solid $color__black;
font-size: 4rem;
line-height: inherit;
}
&:hover::after {
content: ">";
padding: 0;
font-size: 2.5rem;
line-height: inherit;
}
}
}
}
.category-faq {
.more-link {
.button-more {
&::before {
content: "accedir";
position: absolute;
bottom: 1em;
left: 0.5em;
font-family: $font__light;
font-size: 1rem;
line-height: 0;
}
&::after {
content: "+";
display: inline-block;
width: 8rem;
height: 2rem;
padding: 0 0.5rem;
text-align: right;
font-size: 2.5rem;
line-height: 0.7;
}
&:hover::after {
content: ">";
padding: 0 0.1rem;
font-size: 1.5rem;
line-height: 1.2;
}
}
}
}
.xarxaprod-search-form {
display: flex;
margin: 0.5rem 0;
.search-field {
padding: 0.5em;
}
.search-submit{
z-index: 10;
margin: 0rem;
border: none;
width: 2.5rem;
height: 2.5rem;
background: none;
cursor: pointer;
font-size: 0px;
}
}
.xarxaprod-icon-search:before {
position: absolute;
padding: 0;
margin: 0.2rem 0 0 -1.5rem;
z-index: 0;
min-width: 2.5rem;
min-height: 2.5rem;
font-size: 2rem;
content: "\26b2";
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

116
sass/base/elements/_links.scss
View File

@ -34,61 +34,61 @@ a {
text-decoration: none; text-decoration: none;
} }
} }
//.home-featured,.archive-posts { .home-featured,.archive-posts {
// .category-faq,.type-xarxaprod-ajut { .category-faq,.type-xarxaprod-ajut {
// position: relative; position: relative;
// padding-bottom: 4rem; padding-bottom: 4rem;
// .entry-title { .entry-title {
// a { a {
// &::after { &::after {
// content: "+"; content: "+";
// position:absolute; position:absolute;
// bottom: 0; bottom: 0;
// left: 0; left: 0;
// width: 3rem; width: 3rem;
// height: 3rem; height: 3rem;
// padding: 0 0.38rem; padding: 0 0.38rem;
// border: 1px solid $color__black; border: 1px solid $color__black;
// font-size: 4rem; font-size: 4rem;
// line-height: 0.8; line-height: 0.8;
// } }
// &:hover::after { &:hover::after {
// content: ">"; content: ">";
// padding: 0 0.38rem; padding: 0 0.38rem;
// font-size: 2.5rem; font-size: 2.5rem;
// line-height: 1.3; line-height: 1.3;
// } }
// } }
// } }
// } }
// .category-faq { .category-faq {
// .entry-title { .entry-title {
// a { a {
// &::before { &::before {
// content: "accedir"; content: "accedir";
// position: absolute; position: absolute;
// bottom: 1em; bottom: 1em;
// left: 0.5em; left: 0.5em;
// font-family: $font__light; font-family: $font__light;
// font-size: 1rem; font-size: 1rem;
// line-height: 0; line-height: 0;
// } }
// &::after { &::after {
// content: "+"; content: "+";
// width: 8rem; width: 8rem;
// height: 2rem; height: 2rem;
// padding: 0 0.5rem; padding: 0 0.5rem;
// text-align: right; text-align: right;
// font-size: 2.5rem; font-size: 2.5rem;
// line-height: 0.7; line-height: 0.7;
// } }
// &:hover::after { &:hover::after {
// content: ">"; content: ">";
// padding: 0 0.1rem; padding: 0 0.1rem;
// font-size: 1.5rem; font-size: 1.5rem;
// line-height: 1.2; line-height: 1.2;
// } }
// } }
// } }
// } }
//} }

130
sass/base/elements/_lists.scss
View File

@ -1,112 +1,64 @@
ul, ul,
ol { ol {
margin: 0 0 0.5em 0.5em; margin: 0 0 0.5em 0.5em;
padding: 0; padding: 0;
} }
ul { ul {
list-style: none; list-style: none;
} }
ol { ol {
list-style: decimal; list-style: decimal;
} }
li > ul, li > ul,
li > ol { li > ol {
margin-bottom: 0; margin-bottom: 0;
margin-left: 0.5em; margin-left: 0.5em;
} }
dt { dt {
font-weight: 700; font-weight: 700;
} }
dd { dd {
margin: 0 0 0.5em 0.5em; margin: 0 0 0.5em 0.5em;
padding: 0; padding: 0;
} }
article:not(.type-post){ .xarxaprod-label {
.xarxaprod-label { margin: 0;
margin: 0; padding: 0;
padding: 0; display: inline;
display: inline; li {
li {
display:inline-block;
margin:0.1em 0;
padding: 0.2em 0.2em 0 0.2em;
color: $color__white;
background-color: $color__black;
font-family: $font__black;
font-size: $font__size-body*0.7;
text-transform: uppercase;
}
}
.item-os_fund_target li {
background-color: $color__orange;
}
.item-os_fund_source li {
background-color: $color__lightblue;
}
.item-os_fund_field li {
background-color: $color__yellow;
}
.item-os_fund_dates li {
background-color: $color__green;
}
.item-os_fund_call {
display: block;
margin:0.2rem 0;
li {
font-size: $font__size-body*1.2;
}
}
.item-os_fund_apply_text {
display:inline-block;
margin:0.1em 0;
padding: 0.2em 0.2em 0 0.2em;
color: $color__white;
background-color: $color__green;
font-family: $font__black;
font-size: $font__size-body*0.7;
text-transform: uppercase;
}
}
.xarxaprod-faqs-types {
ul {
margin: 0;
}
.cat-item {
display:inline-block; display:inline-block;
margin: 0.1em 0.5em 0.1em 0; margin:0.1rem;
padding: 0.2em 0.2em 0 0.2em; padding: 0 0.2rem;
color: $color__white; color: $color__white;
background-color: $color__black; background-color: $color__black;
font-family: $font__black; font-family: $font__black;
font-size: $font__size-body*1.1; font-size: $font__size-body*0.7;
text-transform: uppercase; //text-transform: uppercase;
} }
.current-cat{
background-color: $color__orange;
}
a {
color: $color__white;
text-decoration: none;
&:visited, &:hover{
color: $color__white;
}
}
} }
.single-xarxaprod-ajut { .item-os_fund_target li {
article:not(.type-post) { background-color: $color__orange;
.xarxaprod-label {
li {
font-size: $font__size-body*1.1;
}
}
.item-os_fund_apply_text {
font-size: $font__size-body*1.1;
}
}
} }
.item-os_fund_source li {
background-color: $color__lightblue;
}
.item-os_fund_field li {
background-color: $color__yellow;
}
.item-os_fund_dates li {
background-color: $color__green;
}
.item-os_fund_call {
display: block;
margin:0.2rem 0.1rem;
li {
font-size: $font__size-body*1.2;
}
}

106
sass/base/typography/_headings.scss
View File

@ -4,57 +4,31 @@
h3, h3,
h4, h4,
h5, h5,
h6, h6 {
.h1,.h2,.h3,.h4,.h5,.h6{ font-family: $font__header;
clear: both; clear: both;
line-height: $font__line-height-header; line-height: $font__line-height-header;
a {
text-decoration: none;
}
} }
h1,.h1 { h1 {
font-family: $font__light;
font-size: $font__size-body*1.8; font-size: $font__size-body*1.8;
text-transform: uppercase;
&.small {
font-size: $font__size-body*1.5;
}
} }
h2,.h2 { h2 {
font-family: $font__light;
font-size: $font__size-body*1.5; font-size: $font__size-body*1.5;
text-transform: uppercase;
&.small {
font-size: $font__size-body*1.2;
}
} }
h3,.h3 { h3 {
font-family: $font__black;
font-size: $font__size-body*1.3; font-size: $font__size-body*1.3;
text-transform: uppercase;
&.small {
font-size: $font__size-body*1;
}
} }
h4,.h4 { h4 {
font-family: $font__bold;
font-size: $font__size-body*1.2; font-size: $font__size-body*1.2;
text-transform: uppercase;
&.small {
font-size: $font__size-body*0.9;
}
} }
h5,.h5 { h5 {
font-family: $font__medium;
font-size: $font__size-body*1.1; font-size: $font__size-body*1.1;
text-transform: uppercase;
&.small {
font-size: $font__size-body*0.8;
}
} }
h6,.h6 { h6 {
font-family: $font__light;
font-size: $font__size-body*1.1; font-size: $font__size-body*1.1;
&.small {
font-size: $font__size-body*0.8;
}
} }
.site-main { .site-main {
h1, h1,
@ -63,18 +37,17 @@
h4, h4,
h5, h5,
h6, h6,
.h1,.h2,.h3,.h4,.h5,.h6,
.entry-content { .entry-content {
margin: 0; margin: 0;
} }
} }
.single { .single {
h1,.h1 { h1 {
font-family: $font__black; font-family: $font__black;
} }
} }
.home-featured { .home-featured {
h2,.h2 { h2 {
margin: 1.2rem 0; margin: 1.2rem 0;
font-size: $font__size-body*2; font-size: $font__size-body*2;
line-height: 1.2; line-height: 1.2;
@ -83,54 +56,27 @@
} }
} }
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
h1,.h1 { h1 {
font-size: $font__size-body*3.5; font-size: $font__size-body*3.5;
} }
h2,.h2 { h2 {
font-size: $font__size-body*2.5; font-size: $font__size-body*2.5;
} }
h3,.h3 { h3 {
font-size: $font__size-body*2;
}
h4 {
font-family: $font__black;
font-size: $font__size-body*1.7;
}
h5 {
font-size: $font__size-body*1.5; font-size: $font__size-body*1.5;
} }
h4,.h4 { h6 {
font-family: $font__black; font-size: $font__size-body*1.5;
font-size: $font__size-body*1.3;
}
h5,.h5 {
font-size: $font__size-body*1.3;
}
h6,.h6 {
font-size: $font__size-body*1.3;
} }
.home-featured { .home-featured {
h2,.h2 { h2 {
font-size: $font__size-body*3.5;
border-bottom: 0.8rem solid $color__black;
}
}
}
@media screen and (min-width: 1440px) {
h1,.h1 {
font-size: $font__size-body*3.5;
}
h2,.h2 {
font-size: $font__size-body*2.5;
}
h3,.h3 {
font-size: $font__size-body*1.6;
}
h4,.h4 {
font-family: $font__black;
font-size: $font__size-body*1.4;
}
h5,.h5 {
font-size: $font__size-body*1.4;
}
h6,.h6 {
font-size: $font__size-body*1.4;
}
.home-featured {
h2,.h2 {
font-size: $font__size-body*3.5; font-size: $font__size-body*3.5;
border-bottom: 0.8rem solid $color__black; border-bottom: 0.8rem solid $color__black;
} }

18
sass/base/typography/_typography.scss
View File

@ -9,23 +9,7 @@ textarea {
font-size: $font__size-body; font-size: $font__size-body;
line-height: $font__line-height-body; line-height: $font__line-height-body;
} }
.hide {
display: inline-block;
margin: 0;
padding: 0;
min-width: unset;
max-width: unset;
width: 0px;
min-height: unset;
max-height: unset;
height: 0px;
font-size: 0px;
line-height: 0px;
text-decoration: none;
border: 0;
background: none;
background-color: transparent;
}
@import "headings"; @import "headings";
@import "copy"; @import "copy";
@import "fonts"; @import "fonts";

128
sass/components/content/_posts-and-pages.scss
View File

@ -5,7 +5,7 @@
.post, .post,
.page { .page {
margin: 0 0 5em; margin: 0 0 1.5em;
} }
.updated:not(.published) { .updated:not(.published) {
@ -22,30 +22,17 @@
clear: both; clear: both;
margin: 0 0 1.5em; margin: 0 0 1.5em;
} }
/* used in
* ./template-parts/section-eachpost.php
* */
.xarxaprod-card-each { .xarxaprod-card-each {
.entry-title,h6 { .entry-title,h6 {
border-bottom: 1px solid $color__black; border-bottom: 1px solid $color__black;
margin: 0; margin: 0;
padding: 0.5rem 0; padding: 0.5rem 0;
//word-break: break-word;
} }
p { p {
padding: 0.5rem 0; padding: 0.5rem 0;
margin:0; margin:0;
} }
.more-link {
display: inline-blocK;
margin-top: 2rem;
}
} }
/* used in
* ./template-parts/content-xarxaprod-ajut.php
* ./template-parts/section-eachpost.php
* */
.xarxaprod-fund-info-fields, .xarxaprod-fund-info-fields,
.xarxaprod-fund-info-contact-fields { .xarxaprod-fund-info-contact-fields {
display: grid; display: grid;
@ -74,6 +61,8 @@
margin: 1rem 0 0.5rem 0; margin: 1rem 0 0.5rem 0;
} }
} }
.xarxaprod-label {
}
.xarxaprod-funder-name, .xarxaprod-funder-name,
.xarxaprod-fund-contact-name, .xarxaprod-fund-contact-name,
.xarxaprod-fund-web { .xarxaprod-fund-web {
@ -89,118 +78,49 @@
font-size: 0.8rem; font-size: 0.8rem;
} }
} }
/* filters form custom fields // .page-template-funds-search {
*/ .xarxaprod-filtered-funds {
.xarxaprod-filtered-funds { display:grid;
display:grid; grid-template-columns: 1fr 1fr;
grid: 1fr;
.os_fund_target,
.os_fund_source,
.os_fund_field {
.filter {
display: none;
}
} }
} .xarxaprod-fund-filter {
.xarxaprod-filters { display: grid;
section { grid-template-columns: repeat(1 , 1fr);
margin: 1em 0; gap: $grid__gap;
} }
.xarxaprod-titol-opcions { .archive-posts {
grid-template-columns: repeat(1 , 1fr);
} }
} //}
.archive-posts {
// https://stackoverflow.com/questions/47601564/equal-width-columns-in-css-grid#61240964
grid-template-columns: repeat(1 , minmax(0,1fr));
}
.xarxaprod-titol-opcions {
// applied in forms and contactforms
display: inline-block;
width: 100%;
max-width: 13em;
margin-bottom: 0;
margin-bottom: 1rem;
padding: 0.6em 1em 0.4em;
clear: both;
cursor: pointer;
font-family: $font__black;
font-size: $font__size-body*0.9;
border: 1px solid $color__border-button;
text-transform: uppercase;
&:after {
content: ">";
display: inline;
float:right;
}
&:hover {
&:after {
transform: rotate(90deg);
animation: rotate 0.5s;
}
}
@keyframes rotate {
0% {
transform: rotate(0);
}
100% {
transform: rotate(90deg);
}
}
}
} }
@media screen and (max-width: 48em) { @media screen and (max-width: 48em) {
//only smaller than 48em //only smaller than 48em
.post,
.page {
margin: 0 0 1em;
}
.xarxaprod-filters {
section {
display: block;
h5 {
display: block;
width: 100%;
}
.filter {
display: inline-block;
width: 45%;
margin-top: 0.5rem;
margin-right: 0.3em;
float: left;
&:last-of-type {
margin-bottom: 2rem;
}
}
}
}
} }
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
//only bigger than 48em //only bigger than 48em
.xarxaprod-filters { //.page-template-funds-search {
padding-right: 2em;
section {
margin: 1em 0;
}
}
.xarxaprod-filtered-funds { .xarxaprod-filtered-funds {
grid-template-columns: 1fr 2fr; grid-template-columns: 1fr 2fr;
} }
.xarxaprod-fund-filter {
}
.archive-posts { .archive-posts {
grid-template-columns: repeat(2 , minmax(0,1fr)); grid-template-columns: repeat(2 , 1fr);
grid-gap: 3em;
} }
//}
} }
@media screen and (min-width: 80em) { @media screen and (min-width: 80em) {
//only bigger than 80rem //only bigger than 80rem
//.page-template-funds-search {
.xarxaprod-filtered-funds { .xarxaprod-filtered-funds {
grid-template-columns: 1fr 3fr; grid-template-columns: 1fr 3fr;
} }
.xarxaprod-fund-filter {
}
.archive-posts { .archive-posts {
grid-template-columns: repeat(3 , minmax(0,1fr)); grid-template-columns: repeat(3 , 1fr);
} }
//}
} }

271
sass/components/navigation/_navigation.scss
View File

@ -18,14 +18,53 @@
margin: 0; margin: 0;
padding-left: 0; padding-left: 0;
ul.sub-menu { ul {
padding-top: 0.5rem; background-color: $color__white;
padding-left: 1rem; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
} flex-direction: column;
float: left;
position: absolute;
top: 100%;
left: -999em;
z-index: 99999;
ul {
left: -999em;
top: 0;
}
li {
&:hover > ul,
&.focus > ul {
//display: block;
left: 30%;
top: 2.5rem;
}
}
a {
width: 200px;
}
:hover > a,
.focus > a {
}
a:hover,
a.focus {
}
}
li:hover > ul,
li.focus > ul {
left: auto;
}
} }
li { li {
position: relative; position: relative;
padding: 1rem;
&:hover > a, &:hover > a,
&.focus > a { &.focus > a {
@ -61,7 +100,7 @@
} }
} }
.secondary-navigation { .secondary-navigation {
padding: 0 1em 1em 0; padding: 1em 0;
ul { ul {
display: inline-block; display: inline-block;
li { li {
@ -69,22 +108,45 @@
} }
} }
a { a {
text-transform: uppercase; // text-transform: uppercase;
} }
} }
.menu-item-has-children { .menu-item-has-children {
&::after {
content: "";
display: inline-block;
position: absolute;
top: 40%;
right: 0.3em;
//vertical-align: middle;
//margin: -3em 0 0.5em;
width: 0.3em;
height: 0.3em;
border: 1px solid $color__black;
border-top: none;
border-left: none;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
&:hover {
&::after {
border-color: $color__grey-dark;
}
}
} }
/* begin of menu-hidden */ /* begin of menu-hidden */
.toggle-secondary-navigation .show-mobile{ .toogle-secondary-navigation .show-mobile{
display:inherit; display:inherit;
} }
.toggle, .toogle,
.toggled-menu { .toogled-menu {
display: none; display: none;
} }
.toggle:checked+.toggled-menu{ .toogle:checked+.toogled-menu{
display: block; display: block;
position: absolute; position: absolute;
left:0; left:0;
@ -92,32 +154,31 @@
width: 100%; width: 100%;
height: 100vh; height: 100vh;
margin-top: 0; margin-top: 0;
padding: 0 2rem; padding: 7em 4em 0 4em;
background-color: $color__white; background-color: $color__white;
} }
.toggle-show { .toogle-show {
position: relative; position: relative;
display: inline-block; display: inline-block;
width: 1.8em; width: 1.8em;
height: 1.4em; height: 1.4em;
margin-right: 0.3em; margin-right: 0.3em;
border-top: 0.3em solid $color__black; //border-top: 0.3em solid $color__black;
border-bottom: 0.3em solid $color__black; //border-bottom: 0.3em solid $color__black;
} }
.toggle-show::before { .toogle-show::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0.3em; top: 0.3em;
left: 0; left: 0;
width: 100%; width: 100%;
border-top: 0.3em solid $color__black; //border-top: 0.3em solid $color__black;
} }
.toggle-hide { .toogle-hide {
display: flex; display: flex;
justify-content: end; justify-content: center;
margin-right: -0.5em;
} }
.toggle-hide::after{ .toogle-hide::after{
content: "x"; content: "x";
padding: 0; padding: 0;
font-size: 3rem; font-size: 3rem;
@ -126,52 +187,15 @@
/* end of menu hidden*/ /* end of menu hidden*/
/* Small menu. */ /* Small menu. */
.main-navigation.toggled { .menu-toggle,
ul { .main-navigation.toggled ul {
display: block;
}
.main-navigation-content {
display: inline-block;
position: absolute;
top: 5rem;
left: 0;
width: 100%;
height: calc(100vh - 5rem);
padding: 3rem;
background-color: $color__white;
}
}
.menu-toggle {
display: inline-block;
width: 10rem;
height: 4rem;
margin: 0;
padding: 0;
font-size: 0;
border: none;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
}
@media screen and (max-width: 47.99em) {
.site-branding {
display: block; display: block;
width: 0px;
height: 0px;
overflow: hidden;
margin: 0;
padding: 0;
}
.main-navigation-content {
text-transform: uppercase;
li {
padding: 0.5rem 0;
}
}
.secondary-navigation-content {
padding: 4rem 2rem;
} }
.xarxaprod-filters {
.xarxaprod-filter {
//float: left;
}
}
} }
@media screen and (min-width: 48em) { @media screen and (min-width: 48em) {
.site-branding { .site-branding {
@ -187,49 +211,7 @@
.main-navigation,.secondary-navigation { .main-navigation,.secondary-navigation {
ul { ul {
display: flex; display: flex;
ul {
background-color: $color__white;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 100%;
left: -999em;
z-index: 99999;
ul {
left: -999em;
top: 0;
}
li {
&:hover > ul,
&.focus > ul {
display: block;
left: auto;
}
}
a {
width: 200px;
}
:hover > a,
.focus > a {
}
a:hover,
a.focus {
}
}
li:hover > ul,
li.focus > ul {
left: auto;
}
} }
a { a {
padding: 0 0.5rem; padding: 0 0.5rem;
} }
@ -244,15 +226,6 @@
padding-bottom: 1em; padding-bottom: 1em;
ul { ul {
justify-content: end; justify-content: end;
ul.sub-menu {
flex-direction: column;
padding-top: 2rem;
padding-left: 1rem;
padding-bottom: 1rem;
li {
margin: 0.5rem 0;
}
}
} }
a[href^="http://localhost"], a[href^="http://localhost"],
a[href^="http://xarxaprod.cat"], a[href^="http://xarxaprod.cat"],
@ -265,60 +238,31 @@
a[href^="http://xarxaprod.cat"]::after, a[href^="http://xarxaprod.cat"]::after,
a[href^="https://xarxaprod.cat"]::after, a[href^="https://xarxaprod.cat"]::after,
.current-menu-item a::after { .current-menu-item a::after {
display: inline-block; //display: inline-block;
content: ""; //content: "";
position: absolute; //position: absolute;
left: 5%; //left: 5%;
min-height: 2px; //min-height: 2px;
height: 100%; //height: 100%;
width: 90%; //width: 90%;
margin-top: 2.3em; //margin-top: 2.3em;
border-bottom: 0.3rem solid $color__black; //border-bottom: 0.3rem solid $color__black;
} }
.menu-item-has-children {
ul {
}
}
} }
.secondary-navigation { .secondary-navigation {
padding: 1.5em 0; padding: 1.5em 0;
} }
.menu-item-has-children { /*
&::after { * css menu toogler
content: ""; * */
display: inline-block; .toogle-secondary-navigation .show-mobile,
position: absolute; .toogle-secondary-navigation .hide-not-mobile{
top: 40%;
right: 0.3em;
//vertical-align: middle;
//margin: -3em 0 0.5em;
width: 0.3em;
height: 0.3em;
border: 1px solid $color__grey-light;
border-top: none;
border-left: none;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
&:hover {
&::after {
border-color: $color__grey-dark;
}
}
}
/*
* css menu toggler
* */
.toggle-secondary-navigation .show-mobile,
.toggle-secondary-navigation .hide-not-mobile{
display: none; display: none;
} }
.toggled-menu { .toogled-menu {
display: inherit; display: inherit;
} }
/* end css menu toggler /* end css menu toogler
* */ * */
} }
@ -328,7 +272,6 @@
.site-main & { .site-main & {
margin: 0 0 1.5em; margin: 0 0 1.5em;
align-self: end;
} }
.nav-links { .nav-links {
@ -340,14 +283,14 @@
} }
.nav-next { .nav-next {
//text-align: end; text-align: end;
flex: 1 0 50%; flex: 1 0 50%;
} }
} }
@media screen and (min-width: 80em) { @media screen and (min-width: 80em) {
.main-navigation,.secondary-navigation { .main-navigation,.secondary-navigation {
.toggle-sidebar-segona .show-mobile, .toogle-sidebar-segona .show-mobile,
.toggle-sidebar-segona .hide-not-mobile{ .toogle-sidebar-segona .hide-not-mobile{
display:none; display:none;
} }

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

@ -29,19 +29,18 @@
z-index: 900; z-index: 900;
top: 0; top: 0;
margin-bottom: 2rem; margin-bottom: 2rem;
background-color: $color__white; //background-color: $color__white;
box-shadow: 0 15px 30px rgba(0,0,0,0.05), 0 1px 0 0 rgba(0,0,0,0.0); //box-shadow: 0 15px 30px rgba(0,0,0,0.05), 0 1px 0 0 rgba(0,0,0,0.0);
.main { .main {
display: flex; display: flex;
flex-flow: column; flex-flow: row;
align-items: initial; align-items: center;
justify-content: space-around; justify-content: space-around;
padding-left: 1rem;
} }
.secondary { .secondary {
display: flex; display: flex;
flex-flow: column; flex-flow: column;
align-items: end; align-items: center;
} }
} }
.site-main { .site-main {
@ -61,10 +60,6 @@
@media screen and (max-width: 48em) { @media screen and (max-width: 48em) {
//only smaller than 48em //only smaller than 48em
.site-header { .site-header {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 0.5rem 0;
align-items: center;
} }
.site-main { .site-main {
} }
@ -89,11 +84,10 @@
} }
.site-header { .site-header {
.main { .main {
align-items: center; flex-flow: column;
} }
.secondary { .secondary {
border-top: 1px solid $color__grey-lighter; //border-top: 1px solid $color__grey-lighter;
align-items: center;
} }
} }
.site-main { .site-main {
@ -106,24 +100,13 @@
} }
&.single { &.single {
.site-main { .site-main {
width: 45rem; //width: 45rem;
margin: 0 auto; margin: 0 auto;
} }
} }
.xarxaprod-destacats,.xarxaprod-featured,.archive-posts { .xarxaprod-destacats,.xarxaprod-featured,.archive-posts {
grid-template-columns: repeat(4 , 1fr); grid-template-columns: repeat(4 , 1fr);
} }
.xarxaprod-faqs-aside {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
.xarxaprod-search-form {
&:hover,&:active,&:focus,&:target {
flex-grow: 1;
}
}
}
} }
@media screen and (min-width: 80em) { @media screen and (min-width: 80em) {
//only bigger than 80rem //only bigger than 80rem
@ -139,7 +122,7 @@
} }
.site-header { .site-header {
.main { .main {
width: 80em; //width: 80em;
margin: auto; margin: auto;
flex-flow: row; flex-flow: row;
} }

102
sass/plugins/contactform7/_contactform7.scss
View File

@ -1,4 +1,8 @@
/* contact forms styles used in wp backend with CF7 */ //.wpcf7-form-control-wrap {
// input {
// margin-top: -1em;
// }
//}
.wpcf7-not-valid:not(:focus) { .wpcf7-not-valid:not(:focus) {
background-color: $color__red; background-color: $color__red;
@ -19,39 +23,9 @@
padding: 0rem; padding: 0rem;
} }
.wpcf7-form { .wpcf7-form {
.wpcf7-submit { .contactform-name, .wpcf7-form .contactform-email {
margin-left: 1rem; max-width: 40%;
} display: inline-block;
.wpcf7-spinner {
margin: 0 -24px 0 0;
}
}
.wpcf7-list-item-label {
margin: 0 0.3rem;
}
/* styles applied if written in wp backend
* class="contactform contactform-WHATEVER"
* */
.contactform {
margin-bottom: 1rem;
br {
display: none;
}
p {
display: block;
break-inside: avoid-column;
margin-top: 0;
}
.break-after-column, .saltar-columna{
break-after:column;
}
}
.contactform-consultoria {
.contactform-name, .contactform-email {
max-width: 40%;
display: inline-block;
} }
.contactform-name { .contactform-name {
float: left; float: left;
@ -62,54 +36,16 @@
} }
.contactform-message { .contactform-message {
} }
}
.contactform-acceptance { .contactform-acceptance {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: end; justify-content: end;
} }
.contactform-fund-info { .wpcf7-submit {
display: inline-block; margin-left: 1rem;
column-count: 2; }
column-gap: 2em; .wpcf7-spinner {
width: 100%; margin: 0 -24px 0 0;
.contactform-descripcio textarea {
display: inline-block;
min-height: 15.5em;
} }
} }
.contactform-fund-options {
display: flex;
justify-content: space-between;
p{
display: inline-block;
}
.wpcf7-list-item {
display:block;
label {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}
}
.wpcf7-form-control-wrap {
&[data-name="oferta-data-start"],&[data-name="oferta-data-end"] {
display: block;
input[type="date"] {
width: auto;
background-color: $color__white;
}
&::before {
display: inline-block;
width: 2rem;
}
}
&[data-name="oferta-data-start"]::before {
content:"inici: ";
}
&[data-name="oferta-data-end"]::before {
content:"fi: ";
}
}
}

24
sass/style.scss
View File

@ -1,22 +1,22 @@
/* /*
Theme Name: XarxaProd.cat 2024 Theme Name: Xarxaprod theme
Theme URI: https://git.hangar.org/xarxaprod/ Theme URI: http://underscores.me/
Author: Hangar.org Tech Lab - hangar.org Author: jorge-vitrubio.net
Author URI: https://hangar.org Author URI: https://vitrubio.net
Description: theme for the <a href="https://xarxaprod.cat">XarxaProd</a>. Inclou la possibilitat de publicar, catalogar i cercar ajuts, resoldre dubtes amb FAQs i altres. Design by Eudald Van der Pla <a href="https://vanderpla.com">vanderpla.com</a>. Coding template and theme by <a href="https://vitrubio.net">Jorge - vitrubio.net</a> Description: theme for the Xarxaprod.cat
Version: 1.0.7 Version: 1.0.0
Tested up to: 6.2 Tested up to: 5.4
Requires PHP: 7.4 Requires PHP: 5.6
License: GNU General Public License v3 or later License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html License URI: LICENSE
Text Domain: xarxaprod Text Domain: xarxaprod
Tags: custom-logo, custom-menu, search,custom post-type, translation-ready Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
This theme, like WordPress, is licensed under the GPL. This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned. Use it to make something cool, have fun, and share what you've learned.
The Xarxaprod.cat theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc. Xarxaprod theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later. Underscores is distributed under the terms of the GNU GPL v2 or later.
Normalizing styles have been helped along thanks to the fine work of Normalizing styles have been helped along thanks to the fine work of

996
style.css
View File

File diff suppressed because it is too large Load Diff