From b42d62996e7db414ada5e823211f7949e39f56f7 Mon Sep 17 00:00:00 2001
From: Metehan Celik <mthncelik@gmail.com>
Date: Fri, 28 Jan 2022 17:42:39 +0300
Subject: [PATCH] styles.scss is removed. thus, most of the problems are
 resolved. deleted no-sense class names in post.scss. related posts limited as
 max 4.

---
 .../resources/{scss => css}/post.scss         | 44 +++++++++++++------
 .../anomaly/posts-module/posts/articles.twig  | 35 +++++++++++++++
 .../anomaly/posts-module/posts/index.twig     |  4 +-
 .../anomaly/posts-module/posts/view.twig      | 24 ++++++----
 4 files changed, 82 insertions(+), 25 deletions(-)
 rename addons/default/visiosoft/base-theme/resources/{scss => css}/post.scss (79%)
 create mode 100644 addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/articles.twig

diff --git a/addons/default/visiosoft/base-theme/resources/scss/post.scss b/addons/default/visiosoft/base-theme/resources/css/post.scss
similarity index 79%
rename from addons/default/visiosoft/base-theme/resources/scss/post.scss
rename to addons/default/visiosoft/base-theme/resources/css/post.scss
index b6e41bc3b..5d7e7c961 100644
--- a/addons/default/visiosoft/base-theme/resources/scss/post.scss
+++ b/addons/default/visiosoft/base-theme/resources/css/post.scss
@@ -1,17 +1,3 @@
-vedat.social {
-  display: flex;
-  .icon {
-    width: 40px;
-    height: 40px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border: .5px solid #f4f4f4;
-    border-radius: 4px;
-    margin: 0 5px;
-    color: black;
-  }
-}
 
 .productImage {
   max-height: 700px;
@@ -116,6 +102,12 @@ vedat.social {
 .left-zero {
   left: 0;
 }
+.h-278{
+  height: 278px;
+}
+.w-225{
+  width: 225px;
+}
 
 .bottom-zero {
   bottom: 0;
@@ -150,3 +142,27 @@ vedat.social {
     color: white;
   }
 }
+.related-posts-header{
+  color:black;
+}
+.related-posts-bottom-divider{
+  border-color:black;
+}
+.related-image{
+  width: 100%;
+  object-fit: cover;
+  height: 220px;
+  margin-top: 5px;
+}
+.related-image-wrapper{
+  padding: 0 5px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.single-line{
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-weight:500;
+}
\ No newline at end of file
diff --git a/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/articles.twig b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/articles.twig
new file mode 100644
index 000000000..d8ee3b62b
--- /dev/null
+++ b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/articles.twig
@@ -0,0 +1,35 @@
+<div class="container mt-2 mb-4 px-0">
+    <div class="d-flex justify-content-between align-items-center mb-2">
+        <h5 class="text-left ml-2">{{ trans('visiosoft.theme.hepsiemlak::field.news_title', {name: setting_value('streams::name')}) }}</h5>
+        <a href="{{ url('posts') }}" class="btn btn-outline-primary all-post-btn d-none d-md-block">
+            {{ trans('theme::field.all_news') }}
+        </a>
+    </div>
+    <div class="slider">
+        {% if entries('posts','types').findBySlug('default') %}
+            {% set posts = entries('posts').type('default').live().limit(4).get() %}
+            {% for post in posts %}
+                <div class="px-2">
+                    <div
+                        class="fs-14 product rounded position-relative bg-white link-dark text-decoration-none border">
+                        <div class="product-img">
+                            <a href="{{ post.route('view') }}">
+                                {{ img( post.image.make.url ?? 'visiosoft.theme.base::images/no-image.png').class('w-100')|raw }}
+                            </a>
+                        </div>
+                        <div class="product-text-area p-3">
+                            <div class="fw-500 text-dark single-line">
+                                <a href="{{ post.route('view') }}" class="text-dark">
+                                    {{ post.title }}
+                                </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            {% endfor %}
+        {% endif %}
+    </div>
+    <a href="{{ url('posts') }}" class="btn btn-outline-yellow mx-2 all-post-btn d-block d-md-none fs-16 font-weight-bold py-2">
+        {{ trans('theme::field.all_news') }}
+    </a>
+</div>
diff --git a/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/index.twig b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/index.twig
index a750e91d9..9df3bd1c2 100644
--- a/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/index.twig
+++ b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/index.twig
@@ -1,7 +1,7 @@
 {% extends layout('posts') %}
 
 {% block styles %}
-    {{ asset_style("visiosoft.theme.base::scss/post.scss") }}
+    {{ asset_style("visiosoft.theme.base::css/post.scss") }}
 {% endblock %}
 
 {% block content %}
@@ -29,7 +29,7 @@
             {% endfor %}
         </div>
     </div>
-    {% set selectedCats = setting_value('visiosoft.theme.hepsiemlak::list_cats') %}
+    {% set selectedCats = setting_value('visiosoft.theme.base::list_cats') %}
     {% for selectedCat in selectedCats %}
         <div class="container p-0 m-0 maxWidth bg-white mx-auto">
             {% set posts = entries('posts').where('category_id', selectedCat).recent().paginate() %}
diff --git a/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/view.twig b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/view.twig
index 5b2f93d88..d69505ef4 100644
--- a/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/view.twig
+++ b/addons/default/visiosoft/base-theme/resources/views/addons/anomaly/posts-module/posts/view.twig
@@ -1,7 +1,7 @@
 {% extends layout('posts') %}
 
 {% block styles %}
-    {{ asset_style("visiosoft.theme.base::scss/post.scss") }}
+    {{ asset_style("visiosoft.theme.base::css/post.scss") }}
 {% endblock %}
 
 {% block content %}
@@ -35,18 +35,22 @@
 
                 <div class="container m-0 p-0 mx-auto mt-5">
                     <div class="row p-0 m-0">
-                        <h5 class="text-danger mb-0 text-uppercase">
+                        <h5 class="related-posts-header mb-0 text-uppercase">
                             {{ trans('theme::field.related_posts') }}
                         </h5>
-                        <div class="w-100 border border-danger mb-3"></div>
-                        <div class="post-slider mx-auto w-100">
+                        <div class="w-100 border related-posts-bottom-divider mb-3"></div>
+                        <div class="row w-100 d-flex justify-content-center">
                             {% if entries('posts','types').findBySlug('default') %}
                                 {% set posts = entries('posts').where('slug', '!=', post.slug).type('default').live().limit(5).get() %}
-                                {% for post in posts %}
+                                {% for post in posts.slice(0,4) %}
+
+
+
+                        <div class="bg-white rounded h-278 overflow-hidden mx-2">
                                     <a href="{{ post.route('view') }}"
-                                       class="col-3 fs-14 product p-0 mr-3 rounded position-relative bg-white link-dark text-decoration-none">
-                                        <div class="product-img">
-                                            {{ img( post.cover_photo.make.url ?? 'visiosoft.theme.base::images/no-image.png') }}
+                                       class="fs-14 product p-0 mr-3 rounded position-relative bg-white link-dark text-decoration-none">
+                                        <div class="related-image-wrapper w-225">
+                                            {{ img( post.cover_photo.make.url ?? 'visiosoft.theme.base::images/no-image.png').class('related-image')|raw }}
                                         </div>
                                         <div class="product-text-area p-3">
                                             <div class="fw-500 text-dark single-line">
@@ -54,9 +58,11 @@
                                             </div>
                                         </div>
                                     </a>
+                        </div>
+
                                 {% endfor %}
                             {% endif %}
-                        </div>
+                                    </div>
                     </div>
                 </div>