feat: add call to action component
parent
39cda06aeb
commit
0cf7bdbf78
GPG Key ID:
AD9F0F08E855ED88
|
|
@ -1,4 +1,5 @@
|
|||
@import "./card-main";
|
||||
@import "./service-card-main";
|
||||
@import "./vision";
|
||||
|
||||
$heading-letter-spacing: 20px;
|
||||
|
|
@ -52,10 +53,47 @@ $heading-letter-spacing: 20px;
|
|||
border: none;
|
||||
}
|
||||
|
||||
.index-banner__main-action-link{
|
||||
.index-banner__main-action-link {
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
.index-banner__main-action-btn:hover {
|
||||
background-color: lightgray;
|
||||
}
|
||||
|
||||
.home__features {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.home__features-title {
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
$page-content-width: 80%;
|
||||
.index__group-content {
|
||||
.page__container {
|
||||
width: $page-content-width;
|
||||
}
|
||||
}
|
||||
|
||||
.action-call__container {
|
||||
background: #1f5818;
|
||||
width: 100%;
|
||||
padding: 60px 0;
|
||||
}
|
||||
|
||||
.action-call__margin-container {
|
||||
display: flex;
|
||||
width: $page-content-width;
|
||||
margin: auto;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.action-call__prompt {
|
||||
color: white;
|
||||
font-weight: 400;
|
||||
font-size: 1.7rem;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
@import "./card-mobile";
|
||||
@import "./vision-mobile";
|
||||
|
||||
.home__container {
|
||||
max-height: 100vh;
|
||||
|
|
@ -18,3 +19,10 @@
|
|||
font-size: 2.5rem;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
|
||||
.index__group-content {
|
||||
.page__container {
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,81 @@
|
|||
.service__features {
|
||||
margin: 20px 0px;
|
||||
}
|
||||
|
||||
.service-card__group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 0px auto;
|
||||
}
|
||||
.service-card__conatiner {
|
||||
// background-color: #eee;
|
||||
margin: 10px 0px;
|
||||
// wpadding: 10px;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
// height: 250px;
|
||||
height: 100vh;
|
||||
border-top: 1px solid grey;
|
||||
}
|
||||
|
||||
.service-card__conatiner:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.service-card__icon {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: auto;
|
||||
flex: 2;
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
.service-card__title {
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.service-card__text {
|
||||
// font-size: 0.7rem;
|
||||
text-align: center;
|
||||
margin-bottom: 30px !important;
|
||||
}
|
||||
|
||||
.service-card__text-container {
|
||||
flex: 2;
|
||||
margin: auto !important;
|
||||
}
|
||||
|
||||
.service-card__aciton-btn {
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
display: block;
|
||||
font-weight: 400;
|
||||
border: none;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.service__features {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.service__features-title {
|
||||
margin: 10px auto !important;
|
||||
}
|
||||
|
||||
.service-card__icon-container {
|
||||
width: 30%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.service-card__aciton-btn--inactive {
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
display: block;
|
||||
font-weight: 400;
|
||||
border: none;
|
||||
background-color: lightgrey;
|
||||
color: #000;
|
||||
}
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
.home__vision-container{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 320px;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
{% import "macros.html" as macros %}
|
||||
{% import "home/components/home-card.html" as card_macro %}
|
||||
{% import "home/components/home-card-new.html" as card_macro2 %}
|
||||
|
||||
{% extends "base.html" %} {% block meta %}
|
||||
{% set description = "Hostea: Dedicated managed Gitea hosting, including CI/CD
|
||||
|
|
@ -7,15 +8,28 @@ and static pages with upgrades, backups and 24/7 monitoring" %} {% set title =
|
|||
"Home" %} {{ macros::get_meta_tags(title=title, description=description) }} {%
|
||||
endblock meta %} {% block content %}
|
||||
|
||||
{% include "home/components/_banner.html" %}
|
||||
{% include "home/components/_banner-new.html" %}
|
||||
<div class="index__container">
|
||||
<div class="index__group-content">
|
||||
<div class="page__container">
|
||||
<div class="page__group-content">
|
||||
<div class="page__container">
|
||||
{% include "home/components/_vision.html" %}
|
||||
|
||||
</div>
|
||||
<div class="action-call__container">
|
||||
<div class="action-call__margin-container">
|
||||
<p class="action-call__prompt">Need an indepandent forge? Talk to an expert!</p>
|
||||
<button class="action-call__button"><a href="/contact" class="action-call_link">Contact Us</a></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page__container">
|
||||
{% include "home/components/_services-new.html" %}
|
||||
</div>
|
||||
<div class="page__container">
|
||||
{% include "home/components/_features.html" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue