Merge pull request #10 from WDI-Ideas/development

html web view
This commit is contained in:
rizwanisready
2024-05-24 17:45:31 +05:30
committed by GitHub
2 changed files with 766 additions and 745 deletions

View File

@@ -1,5 +1,3 @@
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap') @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap') * {
margin: 0;
padding: 0;
@@ -327,13 +325,12 @@
.common-btn {
background: linear-gradient(90.02deg, #CDA34C 0.02%, #F1D6A0 52%, #D1A956 98.68%);
width: 252px;
/* height: 50px; */
font-weight: 500;
border: none;
font-size: 18px;
font-weight: 600;
padding: 12px 0;
padding: 10px 40px;
border-radius: 5px;
}
@@ -597,15 +594,31 @@
margin-top: 90px;
}
.card_design {
background: #000;
padding: 40px 0;
}
.gold-text {
color: rgb(209 170 88);
margin: 0;
padding: 12px;
}
.bg_color {
background-color: #e5e2e2;
border: none;
color: #000;
font-weight: 600;
border-radius: 5px;
}
.feat-card {
border: 1px solid #d1aa588c;
padding: 18px;
width: 300px;
padding: 35px;
border-radius: 6px;
background-color: #00000080;
text-align: center;
}
/* mediascreen */

View File

@@ -52,7 +52,13 @@
<!-- baner -->
<section class="baner-section">
<div class="row message">
{% for message in messages %}
<div class="alert {{ message.tags }} alert-dismissible messgae-alert mt-3" role="alert">
{{ message }}
</div>
{% endfor %}
</div>
<div class="container">
<div class="row">
<div class="col-md-6">
@@ -91,7 +97,7 @@
</section>
<section class="section card_design">
<section class="card_design">
<div class="container">
<div class="row">
{% for subscription in subscriptions %}
@@ -99,13 +105,13 @@
<div class="feat-card">
<div class="card text-center mb-2">
<!-- Dark card with gold border -->
<h5 class="gold-text mb-0 p-1" style="background-color: #f1d59f6e;">{{ subscription.title }}
<h5 class="gold-text bg_color">{{ subscription.title }}
</h5>
{% if subscription.image %}
<img src="{{ subscription.image.url }}" alt="{{ subscription.title }}" class="card-img-top">
{% endif %}
</div>
<div class="card-body mb-2 text-center"> <!-- Golden text for the body -->
<div class="card-body"> <!-- Golden text for the body -->
{% if subscription.short_description %}
<p class="gold-text">{{ subscription.short_description }}</p>
{% endif %}
@@ -114,16 +120,16 @@
{% endif %}
<h5 class="card-title gold-text">Subscription Amount</h5>
{% if subscription.high_amount and subscription.high_amount > subscription.amount %}
<p class="gold-text mb-0"><s>£ {{ subscription.high_amount }}</s> £ {{ subscription.amount
<p class="gold-text"><s>£ {{ subscription.high_amount }}</s> £ {{ subscription.amount
}}
</p>
{% else %}
<p class="gold-text mb-0">£ {{ subscription.amount }}</p>
<p class="gold-text">£ {{ subscription.amount }}</p>
{% endif %}
{% if subscription.plan.days %}
<p class="gold-text mb-0">Days of Subscription: {{ subscription.plan.days }}</p>
<p class="gold-text">Days of Subscription: {{ subscription.plan.days }}</p>
{% else %}
<p class="gold-text mb-0">Days of Subscription: Not available</p>
<p class="gold-text">Days of Subscription: Not available</p>
{% endif %}
</div>
@@ -133,10 +139,12 @@
now</button>
</div>
</div>
</div>
<hr>
{% empty %}
<p>No subscriptions available.</p>
</div>
{% endfor %}
</div>