This commit is contained in:
afornerot 2024-10-28 22:37:24 +01:00
parent b85d03f78c
commit 8aa60b8a4b
5 changed files with 134 additions and 192 deletions

View File

@ -1,3 +1,7 @@
body {
font-size: 20px;
}
h1{
padding: 40px 0px 9px 0px;
border-bottom: 1px solid #eee;
@ -295,7 +299,6 @@ th.dt-center, td.dt-center { text-align: center; }
.herotitle {
text-align: left;
position:absolute;
//width:100%;
top: 80px;
left:50px;
z-index: 9000;
@ -306,39 +309,6 @@ th.dt-center, td.dt-center { text-align: center; }
border:none;
}
.herousers {
position: absolute;
top: 100px;
flex-wrap: wrap;
left: 400px;
z-index: 10000;
display: flex;
}
.herousers h3 {
width:100%;
padding-left:15px;
}
.herouser {
padding:15px;
width:250px;
background-color: var(--colorbgbodydark);
margin:10px;
border-radius:5px;
text-align:center;
}
.herouser img {
width:80px;
height: 80px;
}
.herouser h4 {
font-size:16px;
margin-top:15px;
}
.heromenu {
padding-top: 30px;
font-size: 20px;
@ -372,7 +342,8 @@ th.dt-center, td.dt-center { text-align: center; }
}
.herologo img {
max-height:200px;
height:200px;
width:200px;
border-radius: 100%;
}
@ -382,15 +353,8 @@ th.dt-center, td.dt-center { text-align: center; }
.slick-dots { top: 120px; left: 0px; text-align: center; width: 100%; }
.heromenu .facatmenu {display: none;}
.catmenu { display:none }
.heromenu .linkmenu {zoom:200%}
.herousers { top:315px; left:0px; width: 100%; justify-content: center; }
.herousers { text-align: center; }
.herousers h3{ padding-left: 0px; }
.herouser { width:170px}
.herouser img { width:50px;height:50px}
.herofloatmenu a {
font-size: 40px;
}
.heromenu .linkmenu {zoom:150%; margin-top: 10px;}
.herologo img { width:100px; height:100px; }
.herofloatmenu .avatar {
height: 40px;
@ -404,7 +368,7 @@ th.dt-center, td.dt-center { text-align: center; }
.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;}
.grid-item-size-5 { width: 40%; margin-bottom: 0%;float:left;}
.grid-item-size-5 { width: 50%; margin-bottom: 0%;float:left;}
.grid-item-size-6 { width: 60%; margin-bottom: 0%;float:left;}
.grid-item-size-7 { width: 70%; margin-bottom: 0%;float:left;}
.grid-item-size-8 { width: 80%; margin-bottom: 0%;float:left;}
@ -412,9 +376,12 @@ 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 img{border-radius:100%;width:60px; height: 60px;}
@media (max-width: 980px) {
.grid-sizer { width: 50%; margin-bottom: 0%;}
.grid-sizer { width: 10%; margin-bottom: 0%;}
.grid-item-size { width: 50%; margin-bottom: 0%;}
.grid-item-size-small-3 { width: 30%}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

After

Width:  |  Height:  |  Size: 6.8 KiB

View File

@ -14,7 +14,7 @@ class HomeController extends AbstractController
$em = $this->getDoctrine()->getManager();
$users = $em->getRepository("App:User")->findBy([],["pseudo"=>"ASC"]);
$categorys = $em->getRepository("App:Category")->findBy(["user"=>null]);
$illustrations = $em->getRepository("App:Illustration")->findAll();
$links = $em->getRepository("App:Link")->findBy(["user"=>null]);
$webzines = $em->getRepository("App:Webzine")->findBy(["user"=>null], ['set' => 'ASC', 'order' => 'ASC']);
@ -23,7 +23,7 @@ class HomeController extends AbstractController
"usesidebar" => false,
"usemonocolor" => true,
"users" => $users,
"categorys" => $categorys,
"illustrations" => $illustrations,
"links" => $links,
"webzines" => $webzines
]);

View File

@ -24,26 +24,6 @@
transition: -webkit-filter 0.1s;
}
{% endif %}
{% for category in categorys|sort((a, b) => a.order <=> b.order) %}
{% if category.usecategoryconfig and category.appthumbfilter %}
.cssfilter-{{category.id}} {
filter: grayscale({{category.appthumbfiltergrayscale}}%) opacity({{category.appthumbfilteropacity}}%) sepia({{category.appthumbfiltersepia}}%);
transition: -webkit-filter 0.1s;
}
.cssfilter-{{category.id}}:hover {
filter: unset;
-webkit-filter: unset;
-moz-filter: unset;
-o-filter: unset;
-ms-filter: unset;
-webkit-transition: -webkit-filter 0.1s;
transition: -webkit-filter 0.1s;
}
{% endif %}
{% endfor %}
{% endblock %}
{% block body %}
@ -54,16 +34,12 @@
<a href="#top"><img src="/{{ appAlias }}/uploads/logo/{{ app.session.get("logodark") }}" class="logo"></a>
<div>
{% for category in categorys|sort((a, b) => a.order <=> b.order) %}
{% if not category.illustrations is empty %}
<i class="fa fa-circle fa-fw"></i> <a href="#{{ category.name }}">{{category.name}}</a>&nbsp;
{% endif %}
{% endfor %}
<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;
<i class="fa fa-circle fa-fw"></i> <a href="#contact">Contact</a>&nbsp;
</div>
<div class="float-right">
@ -173,11 +149,8 @@
</div>
<div class="catmenu">
{% for category in categorys|sort((a, b) => a.order <=> b.order) %}
{% if not category.illustrations is empty %}
<a href="#{{ category.name }}"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> {{category.name}}</a><br>
{% endif %}
{% endfor %}
<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 webzines is empty %}
<a href="#webzine"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Webzines</a><br>
@ -186,47 +159,83 @@
{% if not links is empty %}
<a href="#link"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Liens</a><br>
{% endif %}
<a href="#contact"><i class="fa fa-arrow-circle-right fa-fw facatmenu"></i> Contact</a><br>
</div>
</div>
</div>
<div class="herousers">
<h3>Membres</h3>
{% for user in users %}
<div class="herouser">
<a href="{{path("app_home_user",{userpseudo:user.slug})}}">
<img src="/{{ appAlias }}/uploads/avatar/{{ user.avatar }}" class="avatar"><br>
<h4>{{user.pseudo}}</h4>
</a>
</div>
{% endfor %}
</div>
<div class="herologo">
<img src="/{{ appAlias }}/uploads/logo/{{ app.session.get('logodark') }}">
</div>
<!-- GRID ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
{% set style="margin:30px" %}
{% if app.session.get("appmaxthumbwidth")!="0" %}
{% set style="max-width:"~app.session.get("appmaxthumbwidth")~"px; margin:30px auto;" %}
{% endif %}
<div class="grid" style="{{ style }}">
<div class="grid-sizer"></div>
<div class="gutter-sizer"></div>
{% for category in categorys|sort((a, b) => a.order <=> b.order) %}
{% if not category.illustrations is empty %}
<div id="{{ category.name }}" class="grid-item grid-item-full"><h1 class="mt-5">{{ category.name }}</h1></div>
{% for illustration in category.illustrations %}
<!-- GRID ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
<div style="max-width:1000px; margin:30px auto;">
<div class="grid" style="margin:30px">
<div class="grid-sizer"></div>
<div class="gutter-sizer"></div>
<!-- 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>
<div class="grid-item grid-item-size grid-item-size-6 grid-item-size-noresize" style="padding:0px 15px;">
<h1 style="border:none; padding:0px;">{{ app.session.get("appname")}}</h1>
{% if not app.session.get("appsubname") is empty %}
{{ app.session.get("appsubname")}}<br>
{%endif%}
{% if not app.session.get("appdescription") is empty %}
<br>{{ app.session.get("appdescription")|raw}}
{%endif%}
{% if app.session.get('email') is not empty or app.session.get('facebook') is not empty or app.session.get('instagram') is not empty or app.session.get('twitter') is not empty or app.session.get('google') is not empty or app.session.get('youtube') is not empty %}
<br><br>
{% endif %}
{% if app.session.get('email') is not empty %}
<i class="fas fa-envelope"></i> Email = <a href="mailto:{{ app.session.get('email') }}" target="_blank" title="Email">{{ app.session.get('email') }}</a><br>
{% endif %}
{% if app.session.get('facebook') is not empty %}
<i class="fab fa-facebook"></i> Facebook = <a href="{{ app.session.get('facebook') }}" target="_blank" title="Facebook">{{ app.session.get('facebook') }}</a><br>
{% endif %}
{% if app.session.get('instagram') is not empty %}
<i class="fab fa-instagram"></i> Instagram = <a href="{{ app.session.get('instagram') }}" target="_blank" title="Instagram">{{ app.session.get('instagram') }}</a><br>
{% endif %}
{% if app.session.get('twitter') is not empty %}
<i class="fab fa-twitter"></i> Twitter = <a href="{{ app.session.get('twitter') }}" target="_blank" title="Twitter">{{ app.session.get('twitter') }}</a><br>
{% endif %}
{% if app.session.get('google') is not empty %}
<i class="fab fa-google-plus"></i> Google = <a href="{{ app.session.get('google') }}" target="_blank" title="Google">{{ app.session.get('google') }}</a><br>
{% endif %}
{% if app.session.get('youtube') is not empty %}
<i class="fab fa-youtube"></i> Youtube = <a href="{{ app.session.get('youtube') }}" target="_blank" title="Youtube">{{ app.session.get('youtube') }}</a><br>
{% endif %}
</div>
</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>
<!-- ILLUSTRATION ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
<div>
<div id="illustration" class="grid-item grid-item-full"><h1 class="mt-5">Illustrations</h1></div>
{% for illustration in illustrations %}
{% set appthumbwidth=app.session.get("appthumbwidth") %}
{% set appthumbheight=app.session.get("appthumbheight") %}
{% if category.usecategoryconfig %}
{% set appthumbwidth=category.appthumbwidth %}
{% set appthumbheight=category.appthumbheight %}
{% endif %}
{% if appthumbwidth==0 %}
{% set class="" %}
@ -266,95 +275,59 @@
{% set source="thumbori_"~illustration.illustration %}
{% endif %}
<a href="{{ path("app_illustration_view",{"idcat":category.id,"id":illustration.id}) }}">
<div id="illustration{{illustration.id}}" class="grid-item grid-item-size {{class}} cssfilter cssfilter-{{category.id}} 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}}");">
<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 %}
{% endif %}
{% endfor %}
</div>
<!-- WEBZINE ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
{% if not webzines is empty %}
<div id="webzine" class="grid-item grid-item-full"><h1 class="mt-5">Webzines</h1></div>
{% endif %}
{% 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 %}
<div>
{% if not webzines is empty %}
<div id="webzine" class="grid-item grid-item-full"><h1 class="mt-5">Webzines</h1></div>
{% endif %}
{% 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 %}
{% 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 page=webzine.webzinepages[0] %}
{% set source="thumbori_"~page.illustration %}
{% set class=" grid-item-size-2 grid-item-size-page" %}
<!-- LINK ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
{% if not webzines is empty %}
<div id="link" class="grid-item grid-item-full"><h1 class="mt-5">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>
<div class="grid-item grid-item-size grid-item-size-6 grid-item-size-noresize linkurl" style="padding:0px 15px;">
{% for link in links|sort((a, b) => a.order <=> b.order) %}
<a href="{{link.url}}" target="_blank">{{ link.name }}</a>
<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 %}
<!-- CONTACT ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
<div id="contact" class="grid-item grid-item-full"><h1 class="mt-5">Contact</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")}});">
<!-- LINK ------------------------------------------------------------------------------------------------------------------------------------------------------!-->
<div>
{% if not webzines is empty %}
<div id="link" class="grid-item grid-item-full"><h1 class="mt-5">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>
</div>
<div class="grid-item grid-item-size grid-item-size-6 grid-item-size-noresize" style="padding:0px 15px;">
<h3>{{ app.session.get("appname")}}</h3>
{% if not app.session.get("appsubname") is empty %}
{{ app.session.get("appsubname")}}<br>
{%endif%}
{% if not app.session.get("appdescription") is empty %}
<small><br>{{ app.session.get("appdescription")|raw}}</small><br>
{%endif%}
<br>
{% if app.session.get('email') is not empty %}
<i class="fas fa-envelope"></i> Email = <a href="mailto:{{ app.session.get('email') }}" target="_blank" title="Email">{{ app.session.get('email') }}</a><br>
{% endif %}
{% if app.session.get('facebook') is not empty %}
<i class="fab fa-facebook"></i> Facebook = <a href="{{ app.session.get('facebook') }}" target="_blank" title="Facebook">{{ app.session.get('facebook') }}</a><br>
{% endif %}
{% if app.session.get('instagram') is not empty %}
<i class="fab fa-instagram"></i> Instagram = <a href="{{ app.session.get('instagram') }}" target="_blank" title="Instagram">{{ app.session.get('instagram') }}</a><br>
{% endif %}
{% if app.session.get('twitter') is not empty %}
<i class="fab fa-twitter"></i> Twitter = <a href="{{ app.session.get('twitter') }}" target="_blank" title="Twitter">{{ app.session.get('twitter') }}</a><br>
{% endif %}
{% if app.session.get('google') is not empty %}
<i class="fab fa-google-plus"></i> Google = <a href="{{ app.session.get('google') }}" target="_blank" title="Google">{{ app.session.get('google') }}</a><br>
{% endif %}
{% if app.session.get('youtube') is not empty %}
<i class="fab fa-youtube"></i> Youtube = <a href="{{ app.session.get('youtube') }}" target="_blank" title="Youtube">{{ app.session.get('youtube') }}</a><br>
{% endif %}
</div>
</div>
<div class="grid-item grid-item-size grid-item-size-6 grid-item-size-noresize linkurl" style="padding:0px 15px;">
{% for link in links|sort((a, b) => a.order <=> b.order) %}
<a href="{{link.url}}" target="_blank">{{ link.name }}</a>
{% endfor %}
</div>
{% endif %}
</div>
<div id="bottom" class="grid-item grid-item-full" style="height:300px">
</div>
</div>
{% endblock %}
@ -386,7 +359,8 @@ window.onload = function() {
$('body').imagesLoaded(function() {
height=Math.max(500,$(window).height());
$('.heroheader').height(height);
$('.herologo').css({ top: (height-250) +'px' });
himg=$('.herologo img').height();
$('.herologo').css({ top: (height-himg-50) +'px' });
$('.heroheader').slick({
slidesToShow: 1,
@ -431,9 +405,9 @@ window.onload = function() {
$(window).scroll();
height=Math.max(500,$(window).height());
$('.heroheader').height(height);
$('.herologo').css({ top: (height-250) +'px' });
himg=$('.herologo img').height();
$('.herologo').css({ top: (height-himg-50) +'px' });
resizeThumb();
});
$(window).scroll(function () {

View File

@ -381,7 +381,8 @@ window.onload = function() {
$('body').imagesLoaded(function() {
height=Math.max(500,$(window).height());
$('.heroheader').height(height);
$('.herologo').css({ top: (height-250) +'px' });
himg=$('.herologo img').height();
$('.herologo').css({ top: (height-himg-50) +'px' });
$('.heroheader').slick({
slidesToShow: 1,
@ -426,10 +427,10 @@ window.onload = function() {
$(window).scroll();
height=Math.max(500,$(window).height());
$('.heroheader').height(height);
$('.herologo').css({ top: (height-250) +'px' });
himg=$('.herologo img').height();
$('.herologo').css({ top: (height-himg-50) +'px' });
resizeThumb();
});
});
$(window).scroll(function () {
if($(window).width()>=980) {