home responsive issues
diff --git a/_layouts/home.html b/_layouts/home.html
index 1a57f49..5d005fc 100644
--- a/_layouts/home.html
+++ b/_layouts/home.html
@@ -57,33 +57,27 @@
</p>
</div>
</div>
-{% assign col = 1 %}
<div class="container">
- <div class="container-circle mb-3">
- <div class="row">
-{% for item in site.data.features %}
- <div class="col-md-4" style="text-align: center">
- <div class="circle">
- <i class="{{item.icon}} fa-8x"></i>
- <h4>{{item.title}}</h4>
- <div class="hide">
- {{item.description-short}}
+ {% assign col = 1 %}
+ <div class="row mb-3">
+ {% for item in site.data.features %}
+ <div class="col d-flex align-items-stretch mb-2">
+ <div class="card text-center">
+ <div class="card-body">
+ <i class="{{item.icon}} fa-8x"></i>
+ <h5 class="card-title">{{item.title}}</h5>
+ <p class="card-text">{{item.description-short}}</p>
</div>
</div>
</div>
- {% if col == 3 %}
+ {% if col == 3 %}
</div>
- </div>
- </div>
- <div class="container-circle mb-3">
- <div class="container">
- <div class="row">
- {% assign col = 0 %}
- {% else %}
- {% assign col = col | plus: 1 %}
- {% endif %}
-{% endfor %}
- </div>
+ <div class="row mb-3">
+ {% assign col = 0 %}
+ {% else %}
+ {% assign col = col | plus: 1 %}
+ {% endif %}
+ {% endfor %}
</div>
</div>
</section>
diff --git a/assets/css/home.css b/assets/css/home.css
index 5a884a4..2a9f1ff 100644
--- a/assets/css/home.css
+++ b/assets/css/home.css
@@ -3,7 +3,7 @@
#full-screen
{
- height: 100vh;
+ min-height: 100vh;
width: 100vw;
background-image: url('{{ "assets/img/wayang-banner.png" | absolute_url }}');
background-repeat: no-repeat;
@@ -12,11 +12,10 @@
}
#full-screen-2
{
- height: 100vh;
+ min-height: 100vh;
width: 100vw;
background-repeat: no-repeat;
background-size: cover;
-
}
canvas{
@@ -113,7 +112,7 @@
}
.container-circle {
- min-height: 25em;
+ min-height: 25em !important;
}
.circle {
