From 07f93f35ff86d7eed3190356971d6e337fb476dc Mon Sep 17 00:00:00 2001 From: realaravinth Date: Sun, 24 Apr 2022 20:52:06 +0530 Subject: [PATCH 01/10] feat: docs to publish new talk --- docs/new-talk.md | 65 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 docs/new-talk.md diff --git a/docs/new-talk.md b/docs/new-talk.md new file mode 100644 index 0000000..1387956 --- /dev/null +++ b/docs/new-talk.md @@ -0,0 +1,65 @@ +# Add new blog post + +1. Create new directory at + `/content/talks/yyyy-mm-dd-talk-title-event-name` and `index.md` in + the same directory and populate with the following metadata: + +```toml ++++ +title = "title of the talk" +date = "yyyy-mm-dd" +description = "description of talk, will be displayed in talk listing" + +[taxonomies] +tags = ['hostea'] + +[extra] +# **Only use author nicks in blog post Markdown files, it is used to lookup author details.** +author = 'imbatman' # speaker nickname ++++ +``` + +2. Add author details in [`config.toml`](../config.toml) in `authors` + under `extra` section: + + ```toml + [extra] + # Put all your custom variables here + authors = [ + { "nick"="imbatman", name="Batman", "website"="https://batman.example.org" }, + { "nick"="superman", name="Superman", "website" ="https://superman.example.org" } + ] + ``` + +This information is used to render speaker and author information in +talks and blog posts respectively. **Only use author nicks in talks post +Markdown files, it is used to lookup author details.** + +3. Add content to about the talk to the file created in step 1. + +4. Add talk-related resources like slides and related material in the + directory created in step 1. They will be accessible via relative + URLs. For instance: + +```bash +➜ website git:(master) ✗ tree content/talks/22-04-2022-hostea-introducing-hostea-forgefriends-monthly-meet +content/talks/22-04-2022-hostea-introducing-hostea-forgefriends-monthly-meet +├── index.md +└── slides + ├── 2022-04-22-forgefriends-introducing-hostea.odp + └── 2022-04-22-forgefriends-introducing-hostea.pdf + +1 directory, 3 files +``` + +```markdown +## Resources + +- [slides(ODP)](./slides/2022-04-22-forgefriends-introducing-hostea.odp) +- [slides(PDF)](./slides/2022-04-22-forgefriends-introducing-hostea.pdf) +``` + +**WARNING: Don't storing large images or videos in Git repositories, +using content hosting services and link to them** + +5. Commit and push to deploy talk details! 🎉 From d46ef58f811b1d9fde204f23ca3002125cb04b49 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Sun, 24 Apr 2022 21:21:03 +0530 Subject: [PATCH 02/10] fix: home card title should be h3 for better semantics since the immediate parent is h2 --- templates/home/components/home-card.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/home/components/home-card.html b/templates/home/components/home-card.html index 65c88a5..feecd3a 100644 --- a/templates/home/components/home-card.html +++ b/templates/home/components/home-card.html @@ -5,7 +5,7 @@ alt="Temporary card icon" class="home-card__icon" /> -

{{ title }}

+

{{ title }}

{{ description }}

{% endmacro home_card %} From 39cda06aeba02480d43d9609106cae84bae7d564 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Mon, 25 Apr 2022 23:00:39 +0530 Subject: [PATCH 03/10] feat: resize homepage content width and show vision in width --- sass/home/vision-mobile.scss | 3 +++ sass/home/vision.scss | 6 ++++++ templates/home/components/_vision.html | 21 +++++++++++---------- 3 files changed, 20 insertions(+), 10 deletions(-) create mode 100644 sass/home/vision-mobile.scss diff --git a/sass/home/vision-mobile.scss b/sass/home/vision-mobile.scss new file mode 100644 index 0000000..9c7b7d2 --- /dev/null +++ b/sass/home/vision-mobile.scss @@ -0,0 +1,3 @@ +.home__vision-container { + flex-direction: column; +} diff --git a/sass/home/vision.scss b/sass/home/vision.scss index 8d98e70..8a7c43c 100644 --- a/sass/home/vision.scss +++ b/sass/home/vision.scss @@ -1,3 +1,9 @@ +.home__vision-container{ + display: flex; + align-items: center; +} + + .home__vision-text-line { font-size: 0.8rem; font-style: italic; diff --git a/templates/home/components/_vision.html b/templates/home/components/_vision.html index 2f737c6..ddf7f96 100644 --- a/templates/home/components/_vision.html +++ b/templates/home/components/_vision.html @@ -1,6 +1,6 @@
- Imagine a world...

+ Imagine a world...
...where the services that you use for are not only reliable but also radically transparent.
@@ -25,14 +25,15 @@

-

Meet Hostea

-

- Where sustainable free homes are created for free software development -

-
- - +
+

Meet Hostea

+

+ Where sustainable free homes are created for free software development +

+
+ +
From 0cf7bdbf78fd28548da89fede3b727f91957170a Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 00:00:38 +0530 Subject: [PATCH 04/10] feat: add call to action component --- sass/home/main.scss | 40 +++++++++++++++- sass/home/mobile.scss | 8 ++++ sass/home/service-card-main.scss | 81 ++++++++++++++++++++++++++++++++ sass/home/vision.scss | 1 + templates/index.html | 20 ++++++-- 5 files changed, 146 insertions(+), 4 deletions(-) create mode 100644 sass/home/service-card-main.scss diff --git a/sass/home/main.scss b/sass/home/main.scss index 0437340..92d5e3d 100644 --- a/sass/home/main.scss +++ b/sass/home/main.scss @@ -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; +} diff --git a/sass/home/mobile.scss b/sass/home/mobile.scss index 7235205..9f15718 100644 --- a/sass/home/mobile.scss +++ b/sass/home/mobile.scss @@ -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%; + } + } diff --git a/sass/home/service-card-main.scss b/sass/home/service-card-main.scss new file mode 100644 index 0000000..a6e9d28 --- /dev/null +++ b/sass/home/service-card-main.scss @@ -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; +} diff --git a/sass/home/vision.scss b/sass/home/vision.scss index 8a7c43c..9c8fb42 100644 --- a/sass/home/vision.scss +++ b/sass/home/vision.scss @@ -1,6 +1,7 @@ .home__vision-container{ display: flex; align-items: center; + height: 320px; } diff --git a/templates/index.html b/templates/index.html index edff6d3..2e81073 100644 --- a/templates/index.html +++ b/templates/index.html @@ -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" %}
-
+
{% include "home/components/_vision.html" %} + +
+
+
+

Need an indepandent forge? Talk to an expert!

+ +
+
+ +
+ {% include "home/components/_services-new.html" %} +
+
{% include "home/components/_features.html" %}
-
+
From bcf3372b204987f3eb7f97f1f27506da1e9ff561 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 00:01:16 +0530 Subject: [PATCH 05/10] fix: rm italics on takline --- templates/home/components/_vision.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/home/components/_vision.html b/templates/home/components/_vision.html index ddf7f96..af3d1b6 100644 --- a/templates/home/components/_vision.html +++ b/templates/home/components/_vision.html @@ -26,7 +26,7 @@

-

Meet Hostea

+

Meet Hostea

Where sustainable free homes are created for free software development

From 5436f96cbdd2423e9b27732110753b7fc7b99746 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 00:46:32 +0530 Subject: [PATCH 06/10] fix: nav links are colored black --- sass/nav/main.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/sass/nav/main.scss b/sass/nav/main.scss index 1d3cabf..da0c61b 100644 --- a/sass/nav/main.scss +++ b/sass/nav/main.scss @@ -64,6 +64,9 @@ .nav__link { text-decoration: none; + color: black !important; + font-weight: 600; + font-size: 14px; } .nav__link:hover { From 39701c516bfe86d511341d40d57dbbd510a4a652 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 01:23:37 +0530 Subject: [PATCH 07/10] feat: add bottom border to nav element --- sass/nav/main.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/sass/nav/main.scss b/sass/nav/main.scss index da0c61b..91b9b09 100644 --- a/sass/nav/main.scss +++ b/sass/nav/main.scss @@ -7,6 +7,7 @@ box-sizing: border-box; width: 100%; padding-top: 5px; + border-bottom: 1px solid rgb(211, 211, 211); } .nav__home-btn { From 1411d177451deaf86735ae64a0a86f7ea15b87f6 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 14:56:30 +0530 Subject: [PATCH 08/10] feat: make nav sticky --- sass/nav/main.scss | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/sass/nav/main.scss b/sass/nav/main.scss index 91b9b09..9e157ae 100644 --- a/sass/nav/main.scss +++ b/sass/nav/main.scss @@ -1,5 +1,12 @@ @import "../components/_link"; +header { + z-index: 5; + position: sticky; + top: 0; + background-color: #fff; +} + .nav__container { display: flex; flex-direction: row; @@ -12,7 +19,7 @@ .nav__home-btn { font-weight: bold; -// font-family: monospace, monospace; + // font-family: monospace, monospace; margin: auto; margin-left: -10px; } From e5ba11643dbc415676339674cf2c44bdf98eca62 Mon Sep 17 00:00:00 2001 From: realaravinth Date: Tue, 26 Apr 2022 14:58:08 +0530 Subject: [PATCH 09/10] feat: add service section and refresh features sections on homepage --- sass/home/card-main.scss | 4 +- sass/home/service-card-main.scss | 46 ++++++++++++++---- sass/home/service-card-mobile.scss | 17 +++++++ sass/home/vision-mobile.scss | 3 ++ sass/home/vision.scss | 20 ++++++-- templates/home/components/_features.html | 36 +++++++++++--- templates/home/components/_services-new.html | 51 ++++++++++++++++++++ templates/home/components/_services.html | 8 +++ templates/home/components/home-card-new.html | 28 +++++++++++ 9 files changed, 193 insertions(+), 20 deletions(-) create mode 100644 sass/home/service-card-mobile.scss create mode 100644 templates/home/components/_services-new.html create mode 100644 templates/home/components/_services.html create mode 100644 templates/home/components/home-card-new.html diff --git a/sass/home/card-main.scss b/sass/home/card-main.scss index ebb36da..5390558 100644 --- a/sass/home/card-main.scss +++ b/sass/home/card-main.scss @@ -1,6 +1,8 @@ .home-card__group { display: flex; - margin: 50px auto; + //margin: 50px auto; + margin: 0px auto; + width: 80%; } .home-card__conatiner { diff --git a/sass/home/service-card-main.scss b/sass/home/service-card-main.scss index a6e9d28..998703e 100644 --- a/sass/home/service-card-main.scss +++ b/sass/home/service-card-main.scss @@ -1,25 +1,46 @@ +@import "../components/fullscreen"; + .service__features { margin: 20px 0px; + @include fullscreen; + display: flex; + flex-direction: column; + justify-content: space-between; +} +.service__features--split { + margin: 20px 0px; + @include fullscreen; + display: flex; + flex-direction: column; + justify-content: space-between; + max-height: 1300px; } .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; + // height: 250px; + // border-top: 1px solid #cacaca; + width: 80%; + margin: 0 auto; } -.service-card__conatiner:first-child { - border-top: none; +.line-border { + width: 80%; + display: block; + border-bottom: 1px solid #cacaca; + margin: auto; +} + +.service-card__conatiner:last-child { + // border-top: none; } .service-card__icon { @@ -30,14 +51,19 @@ border-radius: 100px; } +.service-card__service-name { + color: rgb(0, 128, 0); + font-weight: 600; +} + .service-card__title { margin: auto; - text-align: center; + //text-align: center; } .service-card__text { // font-size: 0.7rem; - text-align: center; + // text-align: center; margin-bottom: 30px !important; } @@ -47,7 +73,7 @@ } .service-card__aciton-btn { - margin: auto; + margin: auto 0; padding: 10px; display: block; font-weight: 400; diff --git a/sass/home/service-card-mobile.scss b/sass/home/service-card-mobile.scss new file mode 100644 index 0000000..c283fd0 --- /dev/null +++ b/sass/home/service-card-mobile.scss @@ -0,0 +1,17 @@ +.service-card__conatiner { + width: 85%; + flex-direction: column-reverse; + margin: 50px auto; +} + +.service__features--split, +.service__features { + height: auto !important; + min-height: auto !important; + max-height: none !important; + flex-direction: column; +} + +.line-border { + width: 95%; +} diff --git a/sass/home/vision-mobile.scss b/sass/home/vision-mobile.scss index 9c7b7d2..fdbe60e 100644 --- a/sass/home/vision-mobile.scss +++ b/sass/home/vision-mobile.scss @@ -1,3 +1,6 @@ .home__vision-container { flex-direction: column; + height: auto !important; + min-height: auto !important; + max-height: auto !important; } diff --git a/sass/home/vision.scss b/sass/home/vision.scss index 9c8fb42..18720b2 100644 --- a/sass/home/vision.scss +++ b/sass/home/vision.scss @@ -1,10 +1,11 @@ -.home__vision-container{ +@import "../components/fullscreen"; + +.home__vision-container { display: flex; align-items: center; - height: 320px; + height: 200px; } - .home__vision-text-line { font-size: 0.8rem; font-style: italic; @@ -38,3 +39,16 @@ .home__vision-action-link { color: white !important; } + +.page__container--split { + width: 50%; + margin: auto; + padding: 50px 0; + width: 80%; + @include fullscreen; + max-height: 1300px; + height: 90vh !important; + display: flex; + flex-direction: column; + justify-content: space-around; +} diff --git a/templates/home/components/_features.html b/templates/home/components/_features.html index 2cf8a16..42e1a19 100644 --- a/templates/home/components/_features.html +++ b/templates/home/components/_features.html @@ -1,13 +1,37 @@ +
+
+ +
+
+

Gitea Hosting

+

Run indepandent software forge

+

Dedicated Gitea hosting with Woodpecker, flat monthly price, unlimited bandwidth and users. All upgrades included. Fully self-hostable. ETA July 1st, 2022.

+
    +
  • Tested software releases
    • +
  • Infrastructure as Code Software
    • +
  • Woodpecker CI, Librepages and GitPad integrations
    • +
  • Payments manager included: become a service provider!
    • +
+ +
+ +
+ Temporary card icon +
+
+ + -
-
- {{ card_macro::home_card(title="Radically Transparent", description="Hostea is radically transparent, we hold discussions in the open and publish all expenses down to the last penny") }} - {{ card_macro::home_card(title="100% Free Software", description="All Hostea components are Free, you are welcome to download and even sell Hostea!") }} - {{ card_macro::home_card(title="Towards Forge Federation 🚀", description="Hostea developers are also leading the charge in implementing ecosystem-wide federation, we really care about software development :)") }}
+ {{ card_macro::home_card(title="Towards Forge Federation 🚀", description="Hostea developers are also leading the charge in implementing ecosystem-wide federation, we really care about software development :)") }} {{ card_macro::home_card(title="Observable and Reliable", description="All Hostea software come with monitoring and backups configured for high, observable reliability") }} {{ card_macro::home_card(title="Fully Self-Hostable ", description="Like to get your hands dirty? We got you covered! Hostea comes with infrastructure as code and documentation to make self-hostable a first class experience") }} - {{ card_macro::home_card(title="Horizontal Community", description="Hostea development is lead by a horizontal community minded individuals and organisations with a common goal to advance Free Software.") }}
diff --git a/templates/home/components/_services-new.html b/templates/home/components/_services-new.html new file mode 100644 index 0000000..ca136c9 --- /dev/null +++ b/templates/home/components/_services-new.html @@ -0,0 +1,51 @@ +
+
+
+ + + +
+
+

Gitea Clinic

+

Debug and Recover Self-Hosted Gitea Instances

+

Having issues upgrading your self-hosted Gitea? Upload it to Hostea and a doctor will help out. Once it feels better you can bring it home or decide it becomes a permanent resident.

+
    +
  • Consult Gitea experts
    • +
  • Upload your sick Gitea
    • +
  • Once it gets better bring it back home
    • +
  • Optionally, decide it should get a permanent residence at hostea
    • +
+ +
+ +
+ Temporary card icon +
+
+ + + + +
+
+
+

Stuck with a broken Gitea instance? Talk to a Hostea Doctor!

+ +
+
+ +
diff --git a/templates/home/components/_services.html b/templates/home/components/_services.html new file mode 100644 index 0000000..5ca7555 --- /dev/null +++ b/templates/home/components/_services.html @@ -0,0 +1,8 @@ +
+

Services Offered

+
+ {{ card_macro::home_card(title="Gitea Hosting", description="Dedicated Gitea hosting with Woodpecker, flat monthly price, unlimited bandwidth and users. All upgrades included. Fully self-hostable. ETA July 1st, 2022.") }} + {{ card_macro::home_card(title="Gitea Clinic", description="Having issues upgrading your self-hosted Gitea? Upload it to Hostea and a doctor will help out. Once it feels better you can bring it home or decide it becomes a permanent resident.") }} + {{ card_macro::home_card(title="Towards Forge Federation 🚀", description="Hostea is leading the charge in implementing forge federation. It will be made available to all hosted Gitea instance as soon as it is available.") }} +
+
diff --git a/templates/home/components/home-card-new.html b/templates/home/components/home-card-new.html new file mode 100644 index 0000000..1e27f20 --- /dev/null +++ b/templates/home/components/home-card-new.html @@ -0,0 +1,28 @@ +{% macro home_card2(title, description, action_link=false, template=false) %} +
+
+

{{ title }}

+

{{ description }}

+ {% if action_link %} + + {% else %} + + {% endif %} +
+ +
+ Temporary card icon +
+ + + {% if template %} +
-
- {% include "home/components/_vision.html" %} - -
-
-
-

Need an indepandent forge? Talk to an expert!

- +
+
+

Need an indepandent forge? Talk to an expert!

+ +
-
- -
- {% include "home/components/_services-new.html" %} -
-
+
+ {% include "home/components/_vision.html" %} +
+
+ {{ card_macro::home_card(title="Radically Transparent", description="Hostea is radically transparent, we hold discussions in the open and publish all expenses down to the last penny") }} + {{ card_macro::home_card(title="100% Free Software", description="All Hostea components are Free, you are welcome to download and even sell Hostea!") }} + {{ card_macro::home_card(title="Horizontal Community", description="Hostea development is lead by a horizontal community minded individuals and organisations with a common goal to advance Free Software.") }} +
+
+
+ {% include "home/components/_services-new.html" %} {% include "home/components/_features.html" %} -
-
+
-
+ {% endblock content %}