Fix icons card's weight (#190)

- Use responsive width + max-width instead of a fixed-set amount.
- Resolves #86

Co-authored-by: Freddy <freddy@decypher.pw>
This commit is contained in:
Gusted 2021-10-26 11:47:11 +02:00 committed by GitHub
parent 1d47ccba0b
commit d685ca54d5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -61,7 +61,7 @@ layout: default
<div class="row mb-5"> <div class="row mb-5">
<div class="col-6 col-sm-4 col-md-3 mt-3"> <div class="col-6 col-sm-4 col-md-3 mt-3">
<a href="/browsers/"> <a href="/browsers/">
<div class="card text-center mx-auto" style="width: 160px;"> <div class="card text-center mx-auto" style="width: 95%; max-width: 160px;">
<div class="card-body"> <div class="card-body">
<span class="card-title display-4"><i class="fal fa-compass mb-3" aria-hidden="true"></i></span> <span class="card-title display-4"><i class="fal fa-compass mb-3" aria-hidden="true"></i></span>
<p class="card-subtitle">Browsers</p> <p class="card-subtitle">Browsers</p>
@ -71,7 +71,7 @@ layout: default
</div> </div>
<div class="col-6 col-sm-4 col-md-3 mt-3"> <div class="col-6 col-sm-4 col-md-3 mt-3">
<a href="/software/"> <a href="/software/">
<div class="card text-center mx-auto" style="width: 160px;"> <div class="card text-center mx-auto" style="width: 95%; max-width: 160px;">
<div class="card-body"> <div class="card-body">
<span class="card-title display-4"><i class="fal fa-file-code mb-3" aria-hidden="true"></i></span> <span class="card-title display-4"><i class="fal fa-file-code mb-3" aria-hidden="true"></i></span>
<p class="card-subtitle">Software</p> <p class="card-subtitle">Software</p>
@ -81,7 +81,7 @@ layout: default
</div> </div>
<div class="col-6 col-sm-4 col-md-3 mt-3"> <div class="col-6 col-sm-4 col-md-3 mt-3">
<a href="/operating-systems/"> <a href="/operating-systems/">
<div class="card text-center mx-auto" style="width: 160px;"> <div class="card text-center mx-auto" style="width: 95%; max-width: 160px;">
<div class="card-body"> <div class="card-body">
<span class="card-title display-4"><i class="fal fa-desktop mb-3" aria-hidden="true"></i></span> <span class="card-title display-4"><i class="fal fa-desktop mb-3" aria-hidden="true"></i></span>
<p class="card-subtitle">OS</p> <p class="card-subtitle">OS</p>
@ -91,7 +91,7 @@ layout: default
</div> </div>
<div class="col-6 col-sm-4 col-md-3 mt-3"> <div class="col-6 col-sm-4 col-md-3 mt-3">
<a href="/providers/"> <a href="/providers/">
<div class="card text-center mx-auto" style="width: 160px;"> <div class="card text-center mx-auto" style="width: 95%; max-width: 160px;">
<div class="card-body"> <div class="card-body">
<span class="card-title display-4"><i class="fal fa-cloud mb-3" aria-hidden="true"></i></span> <span class="card-title display-4"><i class="fal fa-cloud mb-3" aria-hidden="true"></i></span>
<p class="card-subtitle">Providers</p> <p class="card-subtitle">Providers</p>