admin/37733-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

banner update

Browse Source
This commit is contained in:
Flatlogic Bot 2026-01-24 16:59:04 +00:00
parent 20bcc52b21
commit ae4d7ea450
3 changed files with 14 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
core/templates/core/index.html
View File

@ -7,7 +7,7 @@
{% if banners %}
<!-- Carousel Section -->
<section class="banner-carousel mb-4 mt-n1">
<div id="mainBannerCarousel" class="carousel slide" data-bs-pause="hover">
<div id="mainBannerCarousel" class="carousel slide" data-bs-ride="carousel" data-bs-pause="hover" data-bs-interval="{% if CURRENT_LANG == 'ar' %}15000{% else %}10000{% endif %}">
<div class="carousel-indicators">
{% for banner in banners %}
<button type="button" data-bs-target="#mainBannerCarousel" data-bs-slide-to="{{ forloop.counter0 }}" {% if forloop.first %}class="active" aria-current="true"{% endif %} aria-label="Slide {{ forloop.counter }}"></button>
@ -15,7 +15,7 @@
</div>
<div class="carousel-inner">
{% for banner in banners %}
<div class="carousel-item {% if forloop.first %}active{% endif %}">
<div class="carousel-item {% if forloop.first %}active{% endif %}" data-bs-interval="{% if CURRENT_LANG == 'ar' %}15000{% else %}10000{% endif %}">
<div class="banner-wrapper position-relative" style="height: 450px; overflow: hidden;">
<img src="{{ banner.image.url }}" class="d-block w-100 h-100" style="object-fit: cover;" alt="{{ banner.display_title }}">
<div class="carousel-caption d-none d-md-block text-start start-0 bottom-0 mb-5 ms-5 p-4 rounded" style="background: rgba(0,0,0,0.5); backdrop-filter: blur(5px); max-width: 600px;">
@ -49,27 +49,6 @@
{% endif %}
</div>
</section>
<script>
document.addEventListener('DOMContentLoaded', function() {
var myCarouselElement = document.querySelector('#mainBannerCarousel');
if (myCarouselElement) {
// Set higher interval for Arabic to allow more reading time
var interval = {% if CURRENT_LANG == 'ar' %}15000{% else %}10000{% endif %};
var carousel = new bootstrap.Carousel(myCarouselElement, {
interval: interval,
wrap: true,
pause: 'hover'
});
// Manually trigger the cycle to ensure it starts even if ride was false
carousel.cycle();
console.log('Carousel initialized with interval:', interval);
}
});
</script>
{% endif %}
<!-- Hero Section (Only show if no banners) -->

17
static/css/custom.css
View File

@ -80,21 +80,16 @@ body {
margin-bottom: 40px;
}
/* Carousel Adjustments */
/* Carousel Adjustments - Minimalist */
.carousel-item {
transition: transform 0.8s ease-in-out, opacity 0.8s ease-in-out;
transition: transform 1.2s ease-in-out; /* Slightly slower for elegance */
}
.carousel-item.active {
display: block !important;
opacity: 1 !important;
}
/* Ensure captions are visible in RTL */
/* Fix for captions in RTL if needed, but B5 RTL usually handles it */
[dir="rtl"] .carousel-caption {
right: 5% !important;
left: auto !important;
text-align: right !important;
text-align: right;
right: 5%;
left: auto;
}
.carousel-caption {

17
staticfiles/css/custom.css
View File

@ -80,21 +80,16 @@ body {
margin-bottom: 40px;
}
/* Carousel Adjustments */
/* Carousel Adjustments - Minimalist */
.carousel-item {
transition: transform 0.8s ease-in-out, opacity 0.8s ease-in-out;
transition: transform 1.2s ease-in-out; /* Slightly slower for elegance */
}
.carousel-item.active {
display: block !important;
opacity: 1 !important;
}
/* Ensure captions are visible in RTL */
/* Fix for captions in RTL if needed, but B5 RTL usually handles it */
[dir="rtl"] .carousel-caption {
right: 5% !important;
left: auto !important;
text-align: right !important;
text-align: right;
right: 5%;
left: auto;
}
.carousel-caption {