From 49de74ec24ee221995e54940626e202a0306fa7c Mon Sep 17 00:00:00 2001 From: Simon Vieille Date: Thu, 5 Jan 2023 19:53:34 +0100 Subject: [PATCH 1/3] add posts as card on homepage --- assets/css/app.scss | 8 +++-- assets/images/post-image-logo.png | Bin 0 -> 1356 bytes assets/js/app/px-image.js | 12 +++++-- src/Controller/Blog/PostController.php | 2 +- src/Twig/Extension/ColorExtension.php | 38 ++++++++++++++++++++ src/Twig/Extension/TypoExtension.php | 28 +++++++++++++++ templates/page/category/default.html.twig | 14 ++++---- templates/page/post/_post.html.twig | 20 +---------- templates/page/post/_post_card.html.twig | 42 ++++++++++++++++++++++ templates/page/posts/default.html.twig | 14 ++++---- templates/page/search/default.html.twig | 14 ++++---- 11 files changed, 146 insertions(+), 46 deletions(-) create mode 100644 assets/images/post-image-logo.png create mode 100644 src/Twig/Extension/ColorExtension.php create mode 100644 src/Twig/Extension/TypoExtension.php create mode 100644 templates/page/post/_post_card.html.twig diff --git a/assets/css/app.scss b/assets/css/app.scss index b10d387..5b944f3 100644 --- a/assets/css/app.scss +++ b/assets/css/app.scss @@ -463,10 +463,14 @@ pre[class*="language-"] { cursor: pointer; } - a:not(.button), h1, h2, h3, h4, h5, p, ul { + a:not(.button), h1, h2, h3, h4, h5, p, ul:not(.btn-group) { color: $color-body-text; } + ul.btn-group a { + color: #fff; + } + p a, ul a { border-bottom: 2px dotted $color-blue2; } @@ -1253,7 +1257,7 @@ $links: ( } .bg-box { - background: #fbfcff; + background: #f1f1f1; } .invalid-feedback { diff --git a/assets/images/post-image-logo.png b/assets/images/post-image-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..f1d9a58b84a339db255c97e0110459e9452ccd38 GIT binary patch literal 1356 zcmeAS@N?(olHy`uVBq!ia0y~yVEh7Pf8$^Sk_wrnra+3bz$3Dlfr0582s8c<&c6c` zlq_+LC<)F_D=AMbN@XZ7FW1Y=%Pvk%EJ)SMFG`>N&PIxXf#s&Bi(^Q|oVRy;^QA*2 z+8#dlb-pvL-z7)m|Nrfb+$tFvQ?Fe)n<%KfP)pdX^Zd)%uP1H#q3~kE2E$|LJ>$;ZEBvx?Ro!e`rXBZh zzF|D@_n5@%J9&H6FPlns zYAnUlYG^SS+1o%kUz(C(u*R===Ou=g`_&KmH(x$N4#@uT_*Clh~~?-Sb@fIgg^r zPu8!Jn$6z(QR!spq`NEIa&M?tMu*P6K2u&l^0(s2*Jo_E%S?(1zgqW*&0^n&;lE(G{Na^xfXJ^yH<&(sK@F&Hvf{ZOt~*pS!-T z+r~a`3cn3~QyE5Bf4+0)oZN?26h|!p3Z|?T{`-3^`>IzHo;>E<{%3ywao=dO_|q)g zcUG@|cyq-~<_A}fN!(Z2=~HA^>^5oks;ch~9Fylf&3pY$W%ahVlYv3mY~Kb{p { const source = image.getAttribute('data-src') + const sourceError = image.getAttribute('data-src-error') + const color = image.getAttribute('data-color') const loader = new Image() - loader.onload = function() { - image.style.backgroundImage = 'url(' + source + ')' + loader.onload = () => { + image.style.background = `${color ? color : null} url(${source})` image.style.backgroundSize = 'cover' image.style.backgroundPosition = 'center' } + loader.onerror = () => { + image.style.background = `${color ? color : null} url('${sourceError}') center center` + } + loader.src = source })(images[i]) } diff --git a/src/Controller/Blog/PostController.php b/src/Controller/Blog/PostController.php index 918eb90..6e8fc7a 100644 --- a/src/Controller/Blog/PostController.php +++ b/src/Controller/Blog/PostController.php @@ -95,7 +95,7 @@ class PostController extends PageController public function posts(int $page = 1): Response { $entities = $this->createQuery() - ->paginate($page, 5) + ->paginate($page, 9) ; return $this->defaultRender($this->siteRequest->getPage()->getTemplate(), [ diff --git a/src/Twig/Extension/ColorExtension.php b/src/Twig/Extension/ColorExtension.php new file mode 100644 index 0000000..09311bc --- /dev/null +++ b/src/Twig/Extension/ColorExtension.php @@ -0,0 +1,38 @@ + - {% endif %} - - {{ include('page/post/_post.html.twig', {post: post}) }} - {% endfor %} +
+ {% for post in pager %} +
+ {{ include('page/post/_post_card.html.twig') }} +
+ {% endfor %} +
{% if pager.getPaginationData.pageCount > 1 %}
diff --git a/templates/page/post/_post.html.twig b/templates/page/post/_post.html.twig index 3a18d64..7490782 100644 --- a/templates/page/post/_post.html.twig +++ b/templates/page/post/_post.html.twig @@ -76,26 +76,8 @@
{% for item in similarPosts %} - {% set url = safe_path('blog_menu_post', {post: item.id, slug: item.slug, _domain: _domain}) %} -
-
- {%- if item.image -%} -
- - {% set image = asset(item.image)|imagine_filter('post_preview_filter') %} - {{ item.title }} - -
- {%- endif -%} -
-

- - {{- item.title -}} - -

-
-
+ {{ include('page/post/_post_card.html.twig', {post: item, summarySize: 100}) }}
{% endfor %}
diff --git a/templates/page/post/_post_card.html.twig b/templates/page/post/_post_card.html.twig new file mode 100644 index 0000000..0862143 --- /dev/null +++ b/templates/page/post/_post_card.html.twig @@ -0,0 +1,42 @@ +{% set url = safe_path('blog_menu_post', {post: post.id, slug: post.slug, _domain: _domain}) %} +{% set color = generate_color_by_string(post.title) %} + +{%- set image -%} + {%- if post.image -%} + {{ asset(post.image)|imagine_filter('post_preview_filter') }} + {%- elseif post.quickImage -%} + {{ post.quickImage }} + {% else %} + {{ asset('build/images/post-image-logo.png') }} + {%- endif -%} +{%- endset -%} + +
+ + {{ post.title }} + +
+ +
+

+ + {{- post.title|nbsp|raw -}} + +

+ + {% set content %} + {% if post.contentFormat == 'html' %} + {{- post.content|murph_url|file_attributes|post -}} + {% elseif post.contentFormat == 'markdown' %} + {{- post.content|murph_url|file_attributes|markdown('post')|lazy_load -}} + {% elseif post.contentFormat == 'editorjs' %} + {{- post.content|murph_url|file_attributes|editorjs_to_html|raw -}} + {% endif %} + {%- endset -%} + + {% set summarySize = summarySize ?? 200 %} + + {% set content = content|striptags[:summarySize] %} + +

{{ content }}{% if content|length >= summarySize %}…{% endif %}

+
diff --git a/templates/page/posts/default.html.twig b/templates/page/posts/default.html.twig index 9edec9f..f82738c 100644 --- a/templates/page/posts/default.html.twig +++ b/templates/page/posts/default.html.twig @@ -1,13 +1,13 @@ {% extends "page/titled/default.html.twig" %} {% block body %} - {% for post in pager %} - {% if not loop.first %} -
- {% endif %} - - {{ include('page/post/_post.html.twig', {post: post}) }} - {% endfor %} +
+ {% for post in pager %} +
+ {{ include('page/post/_post_card.html.twig') }} +
+ {% endfor %} +
{% if pager.getPaginationData.pageCount > 1 %}
diff --git a/templates/page/search/default.html.twig b/templates/page/search/default.html.twig index c3dfd74..e1fb848 100644 --- a/templates/page/search/default.html.twig +++ b/templates/page/search/default.html.twig @@ -14,13 +14,13 @@
{% if pager %} - {% for post in pager %} - {% if not loop.first %} -
- {% endif %} - - {{ include('page/post/_post.html.twig', {post: post}) }} - {% endfor %} +
+ {% for post in pager %} +
+ {{ include('page/post/_post_card.html.twig') }} +
+ {% endfor %} +
{% if pager.getPaginationData.pageCount > 1 %}
From b061996b2020517a584e2ad55f47493671b180e5 Mon Sep 17 00:00:00 2001 From: Simon Vieille Date: Thu, 5 Jan 2023 20:01:11 +0100 Subject: [PATCH 2/3] update ci --- .woodpecker.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/.woodpecker.yml b/.woodpecker.yml index 39982a5..853c403 100644 --- a/.woodpecker.yml +++ b/.woodpecker.yml @@ -77,7 +77,6 @@ pipeline: - sed -i "s#app_directory#$APP_DIRECTORY#g" .mage.yml - /root/.config/composer/vendor/bin/mage deploy "$CI_BUILD_DEPLOY_TARGET" when: - branch: [master, master-*, develop, develop-*] event: [deployment] services: From d25d619e6af8b1673021f05fb05fd270fff45e97 Mon Sep 17 00:00:00 2001 From: Simon Vieille Date: Thu, 5 Jan 2023 20:14:09 +0100 Subject: [PATCH 3/3] update max per page --- src/Controller/Blog/PostController.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/Controller/Blog/PostController.php b/src/Controller/Blog/PostController.php index 6e8fc7a..fe4e369 100644 --- a/src/Controller/Blog/PostController.php +++ b/src/Controller/Blog/PostController.php @@ -111,7 +111,7 @@ class PostController extends PageController if ($query || $tag) { $entities = $this->createQuery() ->search($query, $tag) - ->paginate($page, 5) + ->paginate($page, 9) ; } @@ -126,7 +126,7 @@ class PostController extends PageController { $entities = $this->createQuery() ->inCategory($category, false) - ->paginate($page, 5) + ->paginate($page, 9) ; if (!$category->getIsActive() && !$this->getUser()) {