svg

2024-10-29 21:15:16 +01:00
parent 448d2f2b7e
commit d73127b09e
6 changed files with 180 additions and 129 deletions
--- a/public/styles/css/style.css
+++ b/public/styles/css/style.css
@ -360,8 +360,10 @@ th.dt-center, td.dt-center { text-align: center; }
    }
 }

-.grid-sizer { width: 10%;  margin-bottom: 0%;float:left;}
+.grid-sizer { width: 5%;  margin-bottom: 0%;float:left;}
 .grid-item-size  { width: 10%;  margin-bottom: 0%;float:left;}
+.grid-item-size-1  { width: 10%;  margin-bottom: 0%;float:left;}
+.grid-item-size-15  { width: 15%;  margin-bottom: 0%;float:left;}
 .grid-item-size-2  { width: 20%;  margin-bottom: 0%;float:left;}
 .grid-item-size-3  { width: 30%;  margin-bottom: 0%;float:left;}
 .grid-item-size-4  { width: 40%;  margin-bottom: 0%;float:left;}
@ -373,7 +375,7 @@ th.dt-center, td.dt-center { text-align: center; }
 .grid-item-full  { width: 100%;  margin-bottom: 0%; font-size:20px;float:left; }
 .grid-item-full h1 {margin: 0; border:none; padding: 20px 0px 0px 10px; }
 .gutter-sizer  { width: 0%;float:left; }
-.member{display:flex; flex-direction: column; align-items: center;}
+.member{display:flex; flex-direction: column; align-items: center; background-color: var(--colorbgbodydarkdarker); border-radius:10px; padding:10px;}
 .member img{border-radius:100%;width:60px; height: 60px;}
@media (max-width: 980px) {
    .grid-sizer { width:  10%;  margin-bottom: 0%;}
--- a/src/Controller/HomeController.php
+++ b/src/Controller/HomeController.php
@ -14,7 +14,7 @@ class HomeController extends AbstractController
        $em = $this->getDoctrine()->getManager();

        $users = $em->getRepository("App:User")->findBy([],["pseudo"=>"ASC"]);
-        $illustrations = $em->getRepository("App:Illustration")->findAll();
+        $illustrations = $em->getRepository("App:Illustration")->findBy([],["submittime"=>"DESC"]);
        $links = $em->getRepository("App:Link")->findBy(["user"=>null]);
        $webzines = $em->getRepository("App:Webzine")->findBy(["user"=>null], ['set' => 'ASC', 'order' => 'ASC']);
        
--- a/src/Entity/Category.php
+++ b/src/Entity/Category.php
@ -73,7 +73,7 @@ class Category

    /**
     * @ORM\OneToMany(targetEntity="Illustration", mappedBy="category", cascade={"persist", "remove"}, orphanRemoval=true)
-     * @ORM\OrderBy({"id" = "DESC"})
+     * @ORM\OrderBy({"submittime" = "DESC"})
     */
    private $illustrations;

--- a/src/Service/sessionInit.php
+++ b/src/Service/sessionInit.php
@ -21,5 +21,31 @@
            foreach($configs as $config) {
                $this->session->set($config->getKeyid(), strval($config->getValue()));
            }
+
+            $this->session->set("colorbgbodydarkdarker",$this->adjustBrightness($this->session->get("colorbgbodydark"),-20));
        }
+
+
+        public function adjustBrightness($hex, $steps) {
+            // Steps should be between -255 and 255. Negative = darker, positive = lighter
+            $steps = max(-255, min(255, $steps));
+    
+            // Normalize into a six character long hex string
+            $hex = str_replace('#', '', $hex);
+            if (strlen($hex) == 3) {
+                $hex = str_repeat(substr($hex,0,1), 2).str_repeat(substr($hex,1,1), 2).str_repeat(substr($hex,2,1), 2);
+            }
+    
+            // Split into three parts: R, G and B
+            $color_parts = str_split($hex, 2);
+            $return = '';
+    
+            foreach ($color_parts as $color) {
+                $color   = hexdec($color); // Convert to decimal
+                $color   = max(0,min(255,$color + $steps)); // Adjust color
+                $return .= str_pad(dechex($color), 2, '0', STR_PAD_LEFT); // Make two char hex code
+            }
+    
+            return "#".$return;
+        }        
    }
--- a/templates/Home/home.html.twig
+++ b/templates/Home/home.html.twig
@ -29,47 +29,55 @@
 {% block body %}

 <!-- FOLIOMENU -----------------------------------------------------------------------------------------------------------------------------------------------!-->
+    <div class="foliomenu">
+        <a href="#top"><img src="{{ asset("uploads/logo/"~app.session.get("logodark")) }}" class="logo"></a>

-<div class="foliomenu">
-    <a href="#top"><img src="/{{ appAlias }}/uploads/logo/{{ app.session.get("logodark") }}" class="logo"></a>
-
-    <div>
-        <i class="fa fa-circle fa-fw"></i> <a href="#membre">Membres</a>&nbsp;
-        <i class="fa fa-circle fa-fw"></i> <a href="#illustration">Illustrations</a>&nbsp;
-        {% if not webzines is empty %}
-        <i class="fa fa-circle fa-fw"></i> <a href="#webzine">Webzines</a>&nbsp;
-        {% endif %}
-        <i class="fa fa-circle fa-fw"></i> <a href="#link">Liens</a>&nbsp;
-    </div>
-
-    <div class="float-right">
-        {% if app.user %}
-            <a href="{{path("app_user_profil")}}">
-                <img src="{{app.user.avatar|urlavatar}}" class="avatar">
-            </a>
-
-            {% if is_granted('ROLE_ADMIN') %}
-                <a href={{ path("app_illustration") }} class="btn btn-link" title="Configuration">
-                    <i class="fa fa-cog fa-fw"></i>
-                </a>
-                <a href={{ path("app_illustration_submit") }} class="btn btn-link" title="Créer une Illustration">
-                    <i class="fa fa-paint-brush fa-fw"></i>
-                </a>
+        <div>
+            {% if users is not empty %}
+                <i class="fa fa-circle fa-fw"></i> <a href="#membre">Membres</a>&nbsp;
            {% endif %}
-                <a href={{ path("app_logout") }} class="btn btn-link" title="Déconnexion">
-                    <i class="fa fa-sign-out-alt fa-fw"></i>
-                </a>           
-        {% else %}
-            <a href={{ path("app_login") }} class="btn btn-link" title="Connexion">
-                <i class="fa fa-sign-in-alt fa-fw"></i>
-            </a>  
-        {% endif %}      
-    </div>
-</div>

-<div class="foliotop">
-    <a href="#top"><i class="fa fa-chevron-up"></i></a>
-</div>
+            {% if illustrations is not empty %}
+            <i class="fa fa-circle fa-fw"></i> <a href="#illustration">Illustrations</a>&nbsp;
+            {% endif %}
+
+            {% if not webzines is empty %}
+            <i class="fa fa-circle fa-fw"></i> <a href="#webzine">Webzines</a>&nbsp;
+            {% endif %}
+            
+            {% if not links is empty %}
+            <i class="fa fa-circle fa-fw"></i> <a href="#link">Liens</a>&nbsp;
+            {% endif %}
+        </div>
+
+        <div class="float-right">
+            {% if app.user %}
+                <a href="{{path("app_user_profil")}}">
+                    <img src="{{app.user.avatar|urlavatar}}" class="avatar">
+                </a>
+
+                {% if is_granted('ROLE_ADMIN') %}
+                    <a href={{ path("app_illustration") }} class="btn btn-link" title="Configuration">
+                        <i class="fa fa-cog fa-fw"></i>
+                    </a>
+                    <a href={{ path("app_illustration_submit") }} class="btn btn-link" title="Créer une Illustration">
+                        <i class="fa fa-paint-brush fa-fw"></i>
+                    </a>
+                {% endif %}
+                    <a href={{ path("app_logout") }} class="btn btn-link" title="Déconnexion">
+                        <i class="fa fa-sign-out-alt fa-fw"></i>
+                    </a>           
+            {% else %}
+                <a href={{ path("app_login") }} class="btn btn-link" title="Connexion">
+                    <i class="fa fa-sign-in-alt fa-fw"></i>
+                </a>  
+            {% endif %}      
+        </div>
+    </div>
+
+    <div class="foliotop">
+        <a href="#top"><i class="fa fa-chevron-up"></i></a>
+    </div>

 <!-- HEROHEADER ------------------------------------------------------------------------------------------------------------------------------------------------!-->
    <div id="top" class="heroheader" displaynone>
@ -117,9 +125,11 @@
            </a>  
        {% endif %}   
    </div>
+
    <div class="herobox"></div>
+    
    <div class="herotitle">
-        <h1>{{ (app.session.get("appname")) }}</h1>
+        <h1><a href="#site">{{ (app.session.get("appname")) }}</a></h1>

        <div class="heromenu" >
            {% if not app.session.get("appsubname") is empty %}
@ -149,8 +159,13 @@
            </div>                    

            <div class="catmenu">
-                <a href="#membre"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Membres</a><br>
-                <a href="#illustration"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Illustrations</a><br>
+                {% if not users is empty %}
+                    <a href="#membre"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Membres</a><br>
+                {% endif %}
+
+                {% if not illustrations is empty %}
+                    <a href="#illustration"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Illustrations</a><br>
+                {% endif %}

                {% if not webzines is empty %}
                    <a href="#webzine"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Webzines</a><br>
@ -179,7 +194,9 @@

 <!-- SITE ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
        <div>
-            <div id="site" class="grid-item grid-item-size grid-item-size-3 grid-item-size-square cssfilter" style="height:200px;background-position: center; background-size: cover; background-image: url(/{{ appAlias }}/uploads/image/{{ app.session.get("imgcontact")}});">
+            <div id="site" class="grid-item grid-item-full"><h1 class="mt-5 mb-3"></h1></div>
+
+            <div class="grid-item grid-item-size grid-item-size-3 grid-item-size-square cssfilter" style="height:200px;background-position: center; background-size: cover; background-image: url(/{{ appAlias }}/uploads/image/{{ app.session.get("imgcontact")}});">
            </div>
            
            <div class="grid-item grid-item-size grid-item-size-6 grid-item-size-noresize" style="padding:0px 15px;">
@ -219,103 +236,107 @@
        </div>

 <!-- MEMBRE ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
-        <div>
-            <div id="membre" class="grid-item grid-item-full"><h1 class="mt-5 mb-3">Membres</h1></div>
-            
-            {% for user in users %}
-                <div class="grid-item grid-item-size grid-item-size-2 grid-item-size-small-3 grid-item-size-noresize" style="padding:0px 15px;">
-                    <a class="member" href="{{path("app_home_user",{userpseudo:user.slug})}}">
-                        <img src="/{{ appAlias }}/uploads/avatar/{{ user.avatar }}">
-                        {{user.pseudo}}
-                    </a>
-                </div>
-            {% endfor %}
-        </div>
+        {% if not users is empty %}
+            <div>
+                <div id="membre" class="grid-item grid-item-full"><h1 class="mt-5 mb-3">Membres</h1></div>
+                
+                {% for user in users %}
+                    <div class="grid-item grid-item-size grid-item-size-15 grid-item-size-small-3 grid-item-size-noresize" style="padding:0px 5px;">
+                        <a class="member" href="{{path("app_home_user",{userpseudo:user.slug})}}">
+                            <img src="/{{ appAlias }}/uploads/avatar/{{ user.avatar }}" class="mb-2">
+                            <small>{{user.pseudo}}</small>
+                        </a>
+                    </div>
+                {% endfor %}
+            </div>
+        {% endif %}

 <!-- ILLUSTRATION ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
-        <div>
-            <div id="illustration" class="grid-item grid-item-full"><h1 class="mt-5">Illustrations</h1></div>
+        {% if not illustrations is empty %}
+            <div>
+                <div id="illustration" class="grid-item grid-item-full"><h1 class="mt-5 mb-3">Illustrations</h1></div>

-            {% for illustration in illustrations %}
-                {% set appthumbwidth=app.session.get("appthumbwidth") %}
-                {% set appthumbheight=app.session.get("appthumbheight") %}
+                {% for illustration in illustrations %}
+                    {% set appthumbwidth=app.session.get("appthumbwidth") %}
+                    {% set appthumbheight=app.session.get("appthumbheight") %}

-                {% if appthumbwidth==0 %}
-                    {% set class="" %}    
-                    {% if loop.index < 40 %}     
-                        {% if loop.index == 1 %}
-                            {% set class="grid-item-size-4" %}            
-                        {% elseif loop.index is divisible by(28) %}
-                            {% set class="grid-item-size-4" %}            
-                        {% elseif loop.index is divisible by(7) %}
-                            {% set class="grid-item-size-2" %}            
-                        {% elseif loop.index is divisible by(46) %}
-                            {% set class="grid-item-size-4" %}            
-                        {% endif %}
-                    {% elseif loop.index > 48 %}
-                        {% if loop.index == 49 %}
-                            {% set class="grid-item-size-4" %}            
-                        {% elseif (loop.index-49) is divisible by(28) %}
-                            {% set class="grid-item-size-4" %}            
-                        {% elseif (loop.index-49) is divisible by(7) %}
-                            {% set class="grid-item-size-2" %}            
+                    {% if appthumbwidth==0 %}
+                        {% set class="" %}    
+                        {% if loop.index < 40 %}     
+                            {% if loop.index == 1 %}
+                                {% set class="grid-item-size-4" %}            
+                            {% elseif loop.index is divisible by(28) %}
+                                {% set class="grid-item-size-4" %}            
+                            {% elseif loop.index is divisible by(7) %}
+                                {% set class="grid-item-size-2" %}            
+                            {% elseif loop.index is divisible by(46) %}
+                                {% set class="grid-item-size-4" %}            
+                            {% endif %}
+                        {% elseif loop.index > 48 %}
+                            {% if loop.index == 49 %}
+                                {% set class="grid-item-size-4" %}            
+                            {% elseif (loop.index-49) is divisible by(28) %}
+                                {% set class="grid-item-size-4" %}            
+                            {% elseif (loop.index-49) is divisible by(7) %}
+                                {% set class="grid-item-size-2" %}            
+                            {% endif %}
                        {% endif %}
+                    {% elseif appthumbwidth==1 %} {% set class="" %}
+                    {% elseif appthumbwidth==2 %} {% set class="grid-item-size-2" %}
                    {% endif %}
-                {% elseif appthumbwidth==1 %} {% set class="" %}
-                {% elseif appthumbwidth==2 %} {% set class="grid-item-size-2" %}
-                {% endif %}

-                {%if appthumbheight==0 %}
-                    {% set class=class~" grid-item-size-square" %}
-                {% elseif appthumbheight==1 %}
-                    {% set class=class~" grid-item-size-proportion" %}
-                {% else %}
-                    {% set class=class~" grid-item-size-page" %}
-                {% endif %}
+                    {%if appthumbheight==0 %}
+                        {% set class=class~" grid-item-size-square" %}
+                    {% elseif appthumbheight==1 %}
+                        {% set class=class~" grid-item-size-proportion" %}
+                    {% else %}
+                        {% set class=class~" grid-item-size-page" %}
+                    {% endif %}

-                {% set source="thumb_"~illustration.illustration %}
-                {% if appthumbheight!=0  %}
-                    {% set source="thumbori_"~illustration.illustration %}
-                {% endif %}
+                    {% set source="thumb_"~illustration.illustration %}
+                    {% if appthumbheight!=0  %}
+                        {% set source="thumbori_"~illustration.illustration %}
+                    {% endif %}

-                <a href="{{ path("app_illustration_view",{"idcat":illustration.category.id,"id":illustration.id}) }}">
-                    <div id="illustration{{illustration.id}}" class="grid-item grid-item-size {{class}} cssfilter no-cache-bg" data-width="{{illustration.width}}"  data-background-image="/{{ appAlias }}/uploads/illustration/{{source}}"  data-height="{{illustration.height}}" style="height:auto;background-position: center ; background-size: cover; background-image: url(/{{ appAlias }}/uploads/illustration/{{source}}");">
-                    </div>
-                </a>
-            {% endfor %}        
-        </div>
+                    <a href="{{ path("app_illustration_view",{"idcat":illustration.category.id,"id":illustration.id}) }}">
+                        <div id="illustration{{illustration.id}}" class="grid-item grid-item-size {{class}} cssfilter no-cache-bg" data-width="{{illustration.width}}"  data-background-image="/{{ appAlias }}/uploads/illustration/{{source}}"  data-height="{{illustration.height}}" style="height:auto;background-position: center ; background-size: cover; background-image: url(/{{ appAlias }}/uploads/illustration/{{source}}");">
+                        </div>
+                    </a>
+                {% endfor %}        
+            </div>
+        {% endif %}

 <!-- WEBZINE ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
-        <div>
-            {% if not webzines is empty %}
-                <div id="webzine" class="grid-item grid-item-full"><h1 class="mt-5">Webzines</h1></div>
-            {% endif %}
+        {% if not webzines is empty %}
+            <div>
+                <div id="webzine" class="grid-item grid-item-full"><h1 class="mt-5 mb-3">Webzines</h1></div>

-            {% set setname="" %}
-            {% for webzine in webzines %}
-                {% if not webzine.webzinepages is empty %}
-                    {% if setname!=webzine.set %}
-                        {% if not webzine.set is empty %}
-                            <div id="webzine" class="grid-item grid-item-full"><h2 class="mt-3 pl-3">{{webzine.set}}</h2></div>
+                {% set setname="" %}
+                {% for webzine in webzines %}
+                    {% if not webzine.webzinepages is empty %}
+                        {% if setname!=webzine.set %}
+                            {% if not webzine.set is empty %}
+                                <div id="webzine" class="grid-item grid-item-full"><h2 class="mt-3 pl-3">{{webzine.set}}</h2></div>
+                            {% endif %}
+                            {% set setname=webzine.set %}
                        {% endif %}
-                        {% set setname=webzine.set %}
-                    {% endif %}
-                    {% set page=webzine.webzinepages[0] %}
-                    {% set source="thumbori_"~page.illustration %}
-                    {% set class=" grid-item-size-2 grid-item-size-page" %}
+                        {% set page=webzine.webzinepages[0] %}
+                        {% set source="thumbori_"~page.illustration %}
+                        {% set class=" grid-item-size-2 grid-item-size-page" %}

-                    <a href="{{ path("app_webzine_view",{"idcat":webzine.id,"id":page.id}) }}">
-                    <div id="webzine{{webzine.id}}" class="grid-item grid-item-size {{class}} cssfilter no-cache-bg" data-width="{{page.width}}"  data-background-image="/{{ appAlias }}/uploads/webzine/{{source}}"  data-height="{{page.height}}" style="height:auto;background-position: center ; background-size: cover; background-image: url(/{{ appAlias }}/uploads/webzine/{{source}}");">
-                    </div>
-                    </a>
-                {% endif %}
-            {% endfor %}
-        </div>
+                        <a href="{{ path("app_webzine_view",{"idcat":webzine.id,"id":page.id}) }}">
+                        <div id="webzine{{webzine.id}}" class="grid-item grid-item-size {{class}} cssfilter no-cache-bg" data-width="{{page.width}}"  data-background-image="/{{ appAlias }}/uploads/webzine/{{source}}"  data-height="{{page.height}}" style="height:auto;background-position: center ; background-size: cover; background-image: url(/{{ appAlias }}/uploads/webzine/{{source}}");">
+                        </div>
+                        </a>
+                    {% endif %}
+                {% endfor %}
+            </div>
+        {% endif %}

 <!-- LINK ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
-        <div>
-            {% if not webzines is empty %}
-                <div id="link" class="grid-item grid-item-full"><h1 class="mt-5">Liens</h1></div>
+        {% if not links is empty %}
+            <div>
+                <div id="link" class="grid-item grid-item-full"><h1 class="mt-5 mb-3">Liens</h1></div>
                
                <div class="grid-item grid-item-size grid-item-size-3 grid-item-size-square cssfilter" style="height:200px;background-position: center; background-size: cover; background-image: url(/{{ appAlias }}/uploads/image/{{ app.session.get("imglink")}});">
                </div>
@ -325,9 +346,10 @@
                        <a href="{{link.url}}" target="_blank">{{ link.name }}</a>
                    {% endfor %}
                </div>
-            {% endif %}
-        </div>
+            </div>
+        {% endif %}

+<!-- BOTTOM ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
        <div id="bottom" class="grid-item grid-item-full" style="height:300px">
    </div>
    
--- a/templates/Include/style.css.twig
+++ b/templates/Include/style.css.twig
@ -1,6 +1,7 @@
 :root{
    --colorbgbodylight: {{ app.session.get('colorbgbodylight')|raw }};
    --colorbgbodydark: {{ app.session.get('colorbgbodydark')|raw }};
+    --colorbgbodydarkdarker: {{ app.session.get('colorbgbodydarkdarker')|raw }};
    --colorfttitlelight: {{ app.session.get('colorfttitlelight')|raw }};
    --colorfttitledark: {{ app.session.get('colorfttitledark')|raw }};   
    --colorftbodylight: {{ app.session.get('colorftbodylight')|raw }};