Incentive (E1): "So funktioniert die Challenge" und Live-Ranking ueber die volle Breite, Titelbild buendig

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
Kevin 2026-09-22 13:15:06 +00:00
parent b83b43ef4c
commit 7bdc670d36

View file

@ -3,7 +3,8 @@
@section('styles') @section('styles')
<style> <style>
.incentive-hero { .incentive-hero {
margin: 0 -1.5rem 0 -1.5rem; margin: 0;
border-radius: .75rem;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
min-height: 520px; min-height: 520px;
@ -155,6 +156,20 @@
text-align: center; text-align: center;
} }
.points-section-wide {
padding: 1.5rem;
}
.points-section-wide .points-heading {
text-align: left;
margin-bottom: 1rem;
}
.points-section-wide .point-card {
width: 100%;
height: auto;
}
.point-card { .point-card {
background: #fff; background: #fff;
border-radius: .75rem; border-radius: .75rem;
@ -914,6 +929,8 @@
border-radius: .75rem; border-radius: .75rem;
overflow: hidden; overflow: hidden;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
background: #fff;
width: 100%;
} }
.inc-ranking-card .card-header { .inc-ranking-card .card-header {
@ -922,6 +939,15 @@
padding: 1.2rem 1.5rem; padding: 1.2rem 1.5rem;
} }
.inc-ranking-card .card-body {
background: #fff;
}
.inc-ranking-card .inc-ranking-table {
width: 100%;
margin-bottom: 0;
}
.inc-ranking-card .ranking-title { .inc-ranking-card .ranking-title {
font-weight: 700; font-weight: 700;
font-size: 1.35rem; font-size: 1.35rem;
@ -1443,13 +1469,13 @@
{{-- ===== SO FUNKTIONIERT DIE CHALLENGE (Geldpraemie) / PUNKTE-DETAIL ===== --}} {{-- ===== SO FUNKTIONIERT DIE CHALLENGE (Geldpraemie) / PUNKTE-DETAIL ===== --}}
@if ($incentive->hasCashPayout() && $incentive->ranksByPartnerCount()) @if ($incentive->hasCashPayout() && $incentive->ranksByPartnerCount())
<div class="points-section mb-5" id="incentive-how-it-works"> <div class="points-section points-section-wide mb-5" id="incentive-how-it-works">
<h4 class="points-heading"> <h4 class="points-heading text-left">
<i class="ion ion-md-cash text-warning mr-1"></i> <i class="ion ion-md-cash text-warning mr-1"></i>
{{ __('incentive.section_how_it_works') }} {{ __('incentive.section_how_it_works') }}
</h4> </h4>
<div class="row"> <div class="row no-gutters">
<div class="col-md-12"> <div class="col-12">
<div class="point-card point-card-partner"> <div class="point-card point-card-partner">
<h6 class="font-weight-bold mb-2"> <h6 class="font-weight-bold mb-2">
<i class="ion ion-md-person-add mr-1"></i> <i class="ion ion-md-person-add mr-1"></i>
@ -1553,16 +1579,13 @@
============================================================ --}} ============================================================ --}}
<div class="inc-ranking-card mt-2 mb-4" id="ranking"> <div class="inc-ranking-card mt-2 mb-4" id="ranking">
<div class="card-header"> <div class="card-header">
<div class="d-flex align-items-center justify-content-between flex-wrap"> <div class="d-flex align-items-center flex-wrap">
<div class="d-flex align-items-center"> <i class="ion ion-md-list mr-2" style="font-size: 1.3rem; color: #6b7758;"></i>
<i class="ion ion-md-list mr-2" style="font-size: 1.2rem; color: #6b7758;"></i> <span class="ranking-title">{{ __('incentive.section_ranking') }}</span>
<span class="ranking-title">{{ __('incentive.section_ranking') }}</span> <span class="badge-top ml-2">{{ __('incentive.ranking_all_active') }}</span>
<span class="badge-top ml-2">{{ __('incentive.ranking_all_active') }}</span>
</div>
<span
class="hint-text">{{ __('incentive.ranking_winners_hint', ['n' => $incentive->max_winners]) }}</span>
</div> </div>
<div class="hint-text mt-2"> <div class="hint-text mt-2">
{{ __('incentive.ranking_winners_hint', ['n' => $incentive->max_winners]) }}
{{ __('incentive.ranking_extended_hint', ['n' => $incentive->max_winners]) }} {{ __('incentive.ranking_extended_hint', ['n' => $incentive->max_winners]) }}
<br>{{ __('incentive.ranking_anonymous_hint') }} <br>{{ __('incentive.ranking_anonymous_hint') }}
</div> </div>