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

styled convo view with images and other convos

This commit is contained in:
Jorge vitrubio.net 2024-04-01 18:15:52 +02:00
parent 51d0ba24e2
commit da21ef92e2
10 changed files with 346 additions and 173 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
adminstyles.css
View File

@ -1615,6 +1615,23 @@ Add your custom styles in this file so it is easier to update the theme.
padding-bottom: 4rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .site-main > article.xarxaprod-convo {
display: grid;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .site-main > article.xarxaprod-convo > * {
max-width: 40rem;
margin: 0 auto;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .site-main > article.xarxaprod-convo > header {
grid-row-start: 2;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .site-main > article.xarxaprod-convo > footer {
max-width: unset;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .site-main > section {
padding-bottom: 4rem;
}
@ -1948,19 +1965,19 @@ Add your custom styles in this file so it is easier to update the theme.
.edit-post-visual-editor__content-area .editor-styles-wrapper {
/*
* big lletters block below titles
* */
* big lletters block below titles
* */
/*
* blocks columns with line below each block
* see Que oferim?
* */
* blocks columns with line below each block
* see Que oferim?
* */
/*
* download files
* line and icon to show download
*
* * * * * * * */
* download files
* line and icon to show download
*
* * * * * * * */
/* used in
* ./template-parts/section-eachpost.php
@ -1983,6 +2000,8 @@ Add your custom styles in this file so it is easier to update the theme.
*
* */
/* mapas leaflet associats */
/*
* categories:
*
@ -2167,6 +2186,30 @@ Add your custom styles in this file so it is easier to update the theme.
font-size: 0.8rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper article.xarxaprod-convo > .xarxaprod-convo-info-fields {
padding-top: 2rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper article.xarxaprod-convo > .entry-footer {
padding-top: 2rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper article.xarxaprod-convo > .entry-footer .xarxaprod-more-convos-header {
padding: 2rem 0;
font-size: 1.6rem;
text-align: center;
text-transform: uppercase;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper article.xarxaprod-convo > .entry-footer .last-convos {
padding: 2rem 0;
border-top: 0.05em solid #000;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper article.xarxaprod-convo > .entry-footer .last-convos > header {
display: none;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-convo-info-fields,
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-agenda-info {
margin-bottom: 2em;
@ -2284,6 +2327,20 @@ Add your custom styles in this file so it is easier to update the theme.
font-size: 1rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact {
font-size: 0.9rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact h6 {
font-size: 0.9rem;
border: none;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact li {
display: grid;
grid-template-columns: 1fr 2fr;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associats-map,
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-espais-map {
aspect-ratio: 4 / 3;
@ -2300,20 +2357,6 @@ Add your custom styles in this file so it is easier to update the theme.
aspect-ratio: 16 / 9;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact {
font-size: 0.9rem;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact h6 {
font-size: 0.9rem;
border: none;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-contact li {
display: grid;
grid-template-columns: 1fr 2fr;
}
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-cards,
.edit-post-visual-editor__content-area .editor-styles-wrapper .category-convocatories,
.edit-post-visual-editor__content-area .editor-styles-wrapper .category-activitats,
@ -2663,7 +2706,6 @@ Add your custom styles in this file so it is easier to update the theme.
.edit-post-visual-editor__content-area .editor-styles-wrapper .xarxaprod-associat-gallery-images {
--this-aspect-ratio: 16 / 9;
display: grid;
grid-template-rows: 6fr 1fr;
grid-gap: 1rem;
overflow: hidden;
}

2
adminstyles.css.map
View File

File diff suppressed because one or more lines are too long

2
assets/css/adminstyles.css
View File

File diff suppressed because one or more lines are too long

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

@ -1,4 +1,6 @@
@media screen {
@media screen {
//any screen
.sticky {
display: block;
}
@ -13,7 +15,6 @@
}
.page-content,
//.entry-content,
.entry-summary {
margin: 1.5em 0 0;
}
@ -27,63 +28,63 @@
margin: 0 0 1.5em;
}
.home-featured {
padding: 0 1rem;
padding: 0 1rem;
}
/*
* big lletters block below titles
* */
.xarxaprod-intro {
line-height: 1.2;
margin-top: 0;
margin-bottom: 0;
}
/*
* blocks columns with line below each block
* see Que oferim?
* */
.ratlla-abaix,.border-bottom {
.wp-block-column {
position:relative;
}
/*
* big lletters block below titles
* */
.xarxaprod-intro {
line-height: 1.2;
margin-top: 0;
margin-bottom: 0;
}
/*
* blocks columns with line below each block
* see Que oferim?
* */
.ratlla-abaix,.border-bottom {
.wp-block-column {
position:relative;
}
.wp-block-heading {
padding-top: 1em;
padding-bottom: 2em;
display:inline-grid;
&:after {
content: "";
border-bottom: $border__line;
width: 100%;
position: absolute;
bottom: 0;
}
.wp-block-heading {
padding-top: 1em;
padding-bottom: 2em;
display:inline-grid;
&:after {
content: "";
border-bottom: $border__line;
width: 100%;
position: absolute;
bottom: 0;
}
}
/*
* download files
* line and icon to show download
*
* * * * * * * */
.descarregar-fitxers,.descarga-fichero,.download-files {
a {
display: inline-block;
width: 100%;
border-bottom: $border__line;
&:after {
content: "";
display:inline-block;
float: right;
width: 1em;
height: 1em;
background-image: url(./assets/img/icon-download.svg);
background-repeat: none;
background-size: contain;
}
}
}
}
}
/*
* download files
* line and icon to show download
*
* * * * * * * */
.descarregar-fitxers,.descarga-fichero,.download-files {
a {
display: inline-block;
width: 100%;
border-bottom: $border__line;
&:after {
content: "";
display:inline-block;
float: right;
width: 1em;
height: 1em;
background-image: url(./assets/img/icon-download.svg);
background-repeat: none;
background-size: contain;
}
}
}
/* used in
* ./template-parts/section-eachpost.php
@ -113,7 +114,7 @@
padding: 0.5em 0;
}
.more-link {
margin-top: 1rem;
margin-top: 1rem;
}
}
@ -165,7 +166,27 @@
font-size: $font__size-body*0.8;
}
}
article.xarxaprod-convo {
> .xarxaprod-convo-info-fields, {
padding-top: 2rem;
}
> .entry-footer {
padding-top: 2rem;
.xarxaprod-more-convos-header {
padding: 2rem 0;
font-size: $font__size-body*1.6;
text-align: center;
text-transform: uppercase;
}
.last-convos{
padding: 2rem 0;
border-top: $border__line;
> header {
display:none;
}
}
}
}
.xarxaprod-convo-info-fields,
.xarxaprod-agenda-info {
margin-bottom: 2em;
@ -197,7 +218,7 @@
dt {
grid-row: 1 / 1;
font-weight: 100;
}
}
dd {
grid-row: 1 / 2;
margin: 0;
@ -278,7 +299,20 @@
* page-templates/associats-search.php
*
* */
//mapas leaflet
.xarxaprod-associat {
}
.xarxaprod-associat-contact {
font-size: $font__size-body*0.9;
h6 {
font-size: $font__size-body*0.9;
border: none;
}
li {
display:grid;
grid-template-columns: 1fr 2fr;
}
}
/* mapas leaflet associats */
.xarxaprod-associats-map,.xarxaprod-espais-map {
aspect-ratio: 4 / 3;
background-color: rgba(200,200,200,0.4); //place holder background color
@ -293,19 +327,6 @@
aspect-ratio: 16 / 9;
}
}
.xarxaprod-associat {
}
.xarxaprod-associat-contact {
font-size: $font__size-body*0.9;
h6 {
font-size: $font__size-body*0.9;
border: none;
}
li {
display:grid;
grid-template-columns: 1fr 2fr;
}
}
/*
* categories:
*
@ -452,7 +473,6 @@
}
}
}
@media screen and (max-width: 48em) {
//only smaller than 48em
@ -505,7 +525,7 @@
font-size: $font__size-body*1.5;
}
}
.single-xarxaprod-associat {
.xarxaprod-associat {
.xarxaprod-associat-info {
@ -535,18 +555,17 @@
}
@media screen and (min-width: 80em) {
//only bigger than 80rem
.xarxaprod-filtered-content {
grid-template-columns: 1fr 3fr;
gap: $grid__gap * 6;
.archive-posts {
grid-template-columns: repeat(2 , minmax(0,1fr));
&.archive-xarxaprod-associats,&.archive-custom-post-type-associat {
grid-template-columns: repeat(1 , minmax(0,1fr));
}
.xarxaprod-filtered-content {
grid-template-columns: 1fr 3fr;
gap: $grid__gap * 6;
.archive-posts {
grid-template-columns: repeat(2 , minmax(0,1fr));
&.archive-xarxaprod-associats,&.archive-custom-post-type-associat {
grid-template-columns: repeat(1 , minmax(0,1fr));
}
}
.archive-posts {
grid-template-columns: repeat(3 , minmax(0,1fr));
}
}
.archive-posts {
grid-template-columns: repeat(3 , minmax(0,1fr));
}
}

2
sass/components/media/_galleries.scss
View File

@ -41,7 +41,7 @@
.xarxaprod-associat-gallery-images { //section
--this-aspect-ratio: 16 / 9;
display: grid;
grid-template-rows: 6fr 1fr;
//grid-template-rows: 6fr 1fr; //no need to impose height, it will auto adapt
grid-gap: $grid__gap;
overflow: hidden;
.xarxaprod-associat-slides-nav{ //navigation

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

@ -1,4 +1,6 @@
@media screen {
//any screen
html:not([data-scroll='0']) {
.site-header:before {
content: "";
@ -12,7 +14,7 @@
margin-right:-50vw;
height: 100%;
z-index: -1;
background-color: $color__white;
background-color: $color__white;
}
}
.no-sidebar {
@ -49,7 +51,7 @@
top: 0;
z-index: 500;
width: 100%;
padding: 0.5rem 0;
padding: 0.5rem 0;
background-color: transparent;
.main {
@ -77,18 +79,18 @@
.site-footer {
display: flex;
flex-flow: row;
background: $color__black;
color: $color__white;
background: $color__black;
color: $color__white;
margin-top: 4em;
:where(.wp-block-columns.is-layout-flex) {
gap: $grid__gap * 5;
}
gap: $grid__gap * 5;
}
.site-info {
&> section {
margin-top: 2em;
padding: 2em 4em;
border-top: $border__line;
}
margin-top: 2em;
padding: 2em 4em;
border-top: $border__line;
}
}
a {
color: $color__white;
@ -97,11 +99,11 @@
}
}
ul[id*="menu-footer"] {
column-count: 3;
column-count: 3;
a {
text-decoration: underline;
}
}
}
}//end .site-footer
:where(.wp-block-columns.is-layout-flex) {
gap: $grid__gap * 1.5;
@ -143,7 +145,7 @@
margin-right:-50vw;
height: 100%;
z-index: -1;
background-color: $color__white;
background-color: $color__white;
}
}
.site {
@ -161,15 +163,15 @@
}
}
.site-header {
padding: 0;
padding: 0;
.main {
grid-column: 2/4;
width: 100%;
grid-column: 2/4;
width: 100%;
}
.secondary {
grid-column: 2/4;
align-items: center;
grid-column: 2/4;
align-items: center;
width: 100%;
}
}
@ -177,6 +179,23 @@
padding: 0;
> article {
padding-bottom: 4rem;
&.xarxaprod-convo {
display: grid;
> * {
max-width: 40rem;
margin: 0 auto;
}
> header {
grid-row-start: 2;
}
> aside, > .xarxaprod-espai-image {
}
> .entry-content {
}
> footer{
max-width: unset;
}
}
}
> section {
padding-bottom: 4rem;
@ -198,17 +217,17 @@
.archive-posts {
grid-template-columns: repeat(3 , 1fr);
}
.xarxaprod-faqs-aside {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
.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;
}
flex-grow: 1;
}
}
}
}
}
@media screen and (min-width: 80em) {
//only bigger than 80rem
@ -237,4 +256,3 @@
padding: 0;
}
}

89
style.css
View File

@ -1479,6 +1479,23 @@ textarea {
padding-bottom: 4rem;
}
.site-main > article.xarxaprod-convo {
display: grid;
}
.site-main > article.xarxaprod-convo > * {
max-width: 40rem;
margin: 0 auto;
}
.site-main > article.xarxaprod-convo > header {
grid-row-start: 2;
}
.site-main > article.xarxaprod-convo > footer {
max-width: unset;
}
.site-main > section {
padding-bottom: 4rem;
}
@ -1842,8 +1859,8 @@ textarea {
}
/*
* big lletters block below titles
* */
* big lletters block below titles
* */
.xarxaprod-intro {
line-height: 1.2;
margin-top: 0;
@ -1851,9 +1868,9 @@ textarea {
}
/*
* blocks columns with line below each block
* see Que oferim?
* */
* blocks columns with line below each block
* see Que oferim?
* */
.ratlla-abaix .wp-block-column,
.border-bottom .wp-block-column {
position: relative;
@ -1876,10 +1893,10 @@ textarea {
}
/*
* download files
* line and icon to show download
*
* * * * * * * */
* download files
* line and icon to show download
*
* * * * * * * */
.descarregar-fitxers a,
.descarga-fichero a,
.download-files a {
@ -1998,6 +2015,30 @@ textarea {
font-size: 0.8rem;
}
article.xarxaprod-convo > .xarxaprod-convo-info-fields {
padding-top: 2rem;
}
article.xarxaprod-convo > .entry-footer {
padding-top: 2rem;
}
article.xarxaprod-convo > .entry-footer .xarxaprod-more-convos-header {
padding: 2rem 0;
font-size: 1.6rem;
text-align: center;
text-transform: uppercase;
}
article.xarxaprod-convo > .entry-footer .last-convos {
padding: 2rem 0;
border-top: 0.05em solid #000;
}
article.xarxaprod-convo > .entry-footer .last-convos > header {
display: none;
}
.xarxaprod-convo-info-fields,
.xarxaprod-agenda-info {
margin-bottom: 2em;
@ -2124,6 +2165,21 @@ textarea {
* page-templates/associats-search.php
*
* */
.xarxaprod-associat-contact {
font-size: 0.9rem;
}
.xarxaprod-associat-contact h6 {
font-size: 0.9rem;
border: none;
}
.xarxaprod-associat-contact li {
display: grid;
grid-template-columns: 1fr 2fr;
}
/* mapas leaflet associats */
.xarxaprod-associats-map,
.xarxaprod-espais-map {
aspect-ratio: 4 / 3;
@ -2140,20 +2196,6 @@ textarea {
aspect-ratio: 16 / 9;
}
.xarxaprod-associat-contact {
font-size: 0.9rem;
}
.xarxaprod-associat-contact h6 {
font-size: 0.9rem;
border: none;
}
.xarxaprod-associat-contact li {
display: grid;
grid-template-columns: 1fr 2fr;
}
/*
* categories:
*
@ -2526,7 +2568,6 @@ textarea {
.xarxaprod-associat-gallery-images {
--this-aspect-ratio: 16 / 9;
display: grid;
grid-template-rows: 6fr 1fr;
grid-gap: 1rem;
overflow: hidden;
}

2
style.css.map
View File

File diff suppressed because one or more lines are too long

6
template-parts/content-xarxaprod-associat.php
View File

@ -100,8 +100,8 @@
</section>
</section>
<section class="xarxaprod-associat-gallery-images">
<?php if( have_rows('xxp_associat_gallery_images') ){ ?>
<section class="xarxaprod-associat-gallery-images">
<nav class="xarxaprod-associat-slides-nav">
<?php while( have_rows('xxp_associat_gallery_images') ): the_row(); ?>
<?php $image=get_sub_field('xxp_associat_image'); ?>
@ -110,7 +110,6 @@
</a>
<?php endwhile; //end while has rows ?>
</nav>
<ul class="xarxaprod-associat-slides">
<?php while( have_rows('xxp_associat_gallery_images') ): the_row(); ?>
<?php $image=get_sub_field('xxp_associat_image'); ?>
@ -122,8 +121,9 @@
</li>
<?php endwhile; //end while has rows ?>
</ul>
<?php }; //end if xxp_associat_gallery_images ?>
</section>
<?php }; //end if xxp_associat_gallery_images ?>
<section class="xarxaprod-associat-convos">
<?php get_template_part( 'template-parts/section', 'last-convos' ); ?>
</section>

59
template-parts/content-xarxaprod-convo.php
View File

@ -15,6 +15,53 @@
<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
</header><!-- .entry-header -->
<aside cass="xarxaprod-espai-image">
<?php
if( get_field('xxp_convo_espai_associat') ):
// read here howto
// https://www.advancedcustomfields.com/resources/relationship/#display-list-of-posts-with-setuppostdata
$espai_associat_posts = get_field('xxp_convo_espai_associat');
if( $espai_associat_posts ):
foreach( $espai_associat_posts as $post ):
// Setup this post for WP functions (variable must be named $post).
setup_postdata($post); ?>
<?php
// search and output images
// check if has post_thumbnail
if ( has_post_thumbnail() ){
xarxaprod_post_thumbnail('full');
} else { ?>
<?php if( have_rows('xxp_associat_gallery_images') ){ ?>
<section class="xarxaprod-associat-gallery-images">
<ul class="xarxaprod-associat-slides">
<?php while( have_rows('xxp_associat_gallery_images') ): the_row(); ?>
<?php $image=get_sub_field('xxp_associat_image'); ?>
<li id="<?php echo acf_esc_html( $image['filename'] );?>" class="xarxaprod-associat-image">
<?php //print_r( $image ); //echo the whole array ?>
<?php //print_r( $image['ID'] ); // echo one fiels of the array?>
<?php echo wp_get_attachment_image( $image['ID'], 'full' ); ?>
<p class="caption"><?php //echo acf_esc_html( $image['caption'] );?></p>
</li>
<?php endwhile; //end while has rows ?>
</ul>
</section>
<?php }; //end if xxp_associat_gallery_images ?>
<?php };//end has_post_thumbnail ?>
<?php endforeach;
// Reset the global post object so that the rest of the page works correctly.
wp_reset_postdata();
endif;
endif;
?>
</aside>
<section class="xarxaprod-convo-info-fields">
<ul>
<?php if( get_field('xxp_convo_espai_associat') ):
@ -83,7 +130,7 @@
</ul>
</section>
<div class="entry-content">
<main class="entry-content">
<?php
the_content(
sprintf(
@ -106,9 +153,15 @@
)
);
?>
</div><!-- .entry-content -->
</main><!-- .entry-content -->
<section class="">
</section>
<footer class="entry-footer">
<h6 class="xarxaprod-more-convos-header big"> Altres convòcatories</h6>
<?php get_template_part( 'template-parts/section', 'last-convos' ); ?>
<footer class="entry-footer">
<?php xarxaprod_entry_footer(); ?>
</footer><!-- .entry-footer -->
</article><!-- #post-<?php the_ID(); ?> -->