Skip to content

Commit

Permalink
Merge pull request #35 from mkpjapan/user/lunardog/css-figma-match
Browse files Browse the repository at this point in the history
CSS Figma match: Benefits and FAQs
  • Loading branch information
lunardog authored Nov 3, 2023
2 parents bd8414f + f93ba6e commit 65985cc
Show file tree
Hide file tree
Showing 10 changed files with 211 additions and 145 deletions.
4 changes: 2 additions & 2 deletions _data/template.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,5 @@ color:

# Font Families
font:
primary: 'Montserrat, "Helvetica Neue",Helvetica,Arial,sans-serif'
secondary: '"Droid Serif", "Helvetica Neue", Helvetica,Arial,sans-serif'
primary: '"Helvetica Neue",Helvetica,Arial,sans-serif'
secondary: '"Roboto Slab", "Helvetica Neue", Helvetica,Arial,sans-serif'
40 changes: 17 additions & 23 deletions _includes/benefits.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,32 @@ <h2 class="section-heading text-center">What We Offer</h2>
<h3 class="section-subheading text-muted text-center">We believe in building "better" men</h3>
</div>
<div class="col-md-6">
<div class="benefits-text-header">
<div class="benefits-text-header-text">
🤗 Support and Connection
</div>
</div>
<div>
<div class="benefit">
<h3>
<i>🤗</i> Support and Connection
</h3>
<ul>
<li>You are <b>heard and respected</b>. Everyone listens to your words. What you say is confidential</li>
<li>You are <b>valued</b> and <b>respected</b>by a circle of men who help each other in realizing their dreams</li>
<li>You are <b>heard and respected</b>. Everyone listens to your words. What you say is confidential.</li>
<li>You are <b>valued</b> and <b>respected</b>by a circle of men who help each other in realizing their dreams.</li>
</ul>
</div>
<div class="benefits-text-header">
<div class="benefits-text-header-text">
🌱 Growth and Belonging
</div>
</div>
<div>
<div class="benefit">
<h3>
<i>🌱</i> Growth and Belonging
</h3>
<ul>
<li><b>Break free</b> from <b>limiting and sabotaging beliefs</b>.</li>
<li><b>Find brotherhood</b> and <b>insight</b></li>
<li><b>Find brotherhood</b> and <b>insight</b>.</li>
<li>Access your <b>inner leader</b>.</li>
</ul>
</div>
<div class="benefits-text-header">
<div class="benefits-text-header-text">
🏡 Leadership and Accountability
</div>
</div>
<div>
<div class="benefit">
<h3>
<i>🏡</i> Leadership and Accountability
</h3>
<ul>
<li>Men <b>remind</b> you of your <b>commitments</b> without judgment</li>
<li>Men <b>hold you accountable</b> and keep you focused on your goals</li>
<li>Men <b>remind</b> you of your <b>commitments</b> without judgment.</li>
<li>Men <b>hold you accountable</b> and keep you focused on your goals.</li>
</ul>
</div>
</div>
Expand Down
90 changes: 6 additions & 84 deletions _includes/faqs.html
Original file line number Diff line number Diff line change
@@ -1,93 +1,15 @@
<section id="faqs">
<div class="container">
<h2 class="section-heading text-center">FAQs</h2>
<!-- Agency theme hacked a bunch of the other themes so if I try to update them to something newer, the current
stuff breaks. I don't have time to debug why now so just using the hacked bootstrap theme agency is using. -->
<div class="row">
<div class="col-6 col-md-6">
{% for faq in page.faqs %}
<div class="card">
<div class="card container">
<h4><b>What is Mankind Project Japan?</b></h4>
<p>Mankind Project Japan is a <b>men's support group</b> based in <b>Tokyo</b> that hosts <b>weekly
online gatherings.</b></p>
<div class="container">
<h4>{{ faq.q }}</h4>
<p>{{ faq.a | markdownify }}</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>What are the benefits of joining?</b></h4>
<p>You'll gain <b>support, insights, and connections</b> with like-minded men.
It's an opportunity for <b>personal growth</b> and <b>self-discovery</b>.
</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>Does it cost any money to join?</b></h4>
<p><b>No</b>. Joining Mankind Project Japan's online gatherings is <b>completely free</b>.
We believe in making our support accessible to all men.<br/><br/>

<b>Note</b>: We do ask for <b>voluntary donations</b> from time to time in order to cover overheads and grow
the group. But these donations are <b>not a condition</b> for continued participation.
</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>How can I join?</b></h4>
<p><a href="#join">Sign up here.</a>
It's free and open to all men.
</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>How often are the gatherings?</b></h4>
<p>We host <b>weekly</b> online gatherings. First Tuesdays of the month for <b>new members</b>.
These ensure regular <b>support and connection</b> for our participants.
</p>
</div>
</div>
</div>
<div class="col-6 col-md-6">
<div class="card">
<div class="card container">
<h4><b>What topics are discussed?</b></h4>
<p>We cover a wide range of topics that includes <b>personal growth</b>, <b>relationships</b>, and
<b>emotional well-being</b>.
Each gathering is facilitated by experienced leaders.
</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>Can I share my story?</b></h4>
<p><b>Absolutely</b>. Our gatherings provide a space for men to share their stories, experiences,
and challenges. We encourage open and honest communication.</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>Are the gatherings confidential?</b></h4>
<p>Yes, we <b>prioritize confidentiality</b> and create a safe and supportive environment for all participants.
What is shared in the gatherings <b>stays within the group</b>.
</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>How can I contact you?</b></h4>
<p>For further questions or assistance, please feel free to contact us at tokyo[α𝐭]mkpjapan.org.</p>
</div>
</div>
<div class="card">
<div class="card container">
<h4><b>Can I attend anonymously?</b></h4>
<p><b>Absolutely!</b> We respect everyone's privacy and understand that some participants may prefer to attend anonymously.
You can choose to use a <b>pseudonym</b> during the gatherings.
</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
</section>
3 changes: 0 additions & 3 deletions _includes/head.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,6 @@

<!-- Custom Fonts -->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700' rel='stylesheet' type='text/css'>

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
Expand Down
11 changes: 7 additions & 4 deletions _includes/join.html
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
<section id="join">
<div class="row">
<div class="join-container">
<div class="join-container-intro-text">
<section class="join-container has-background-dark">
<h2 class="section-heading">
Sit in on our next group
</div>
</h2>
<h3 class="section-subheading">
No commitment, come sit in and see how you feel.
</h3>
<a href="https://forms.gle/L64N8goVx42bHz7F7" class="btn btn-xl mx-auto" style="margin:5px">Join</a>
</div>
</section>
</div>
</section>
20 changes: 15 additions & 5 deletions _includes/testimonials.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,20 @@ <h2 class="section-heading text-center">Testimonials</h2>
<h3 class="section-subheading text-muted text-center">For confidentiality, some details are omitted</h3>
</div>

<div id="testimonials-carousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#testimonials-carousel" data-slide-to="0" class="active"></li>
<li data-target="#testimonials-carousel" data-slide-to="1"></li>
<li data-target="#testimonials-carousel" data-slide-to="2"></li>
</ol>

<div class="testimonials-carousel">
<div>
<div class="testimonial">
<h4>Testimonial</h4>
<p>This is some testimonial text for this month's CodePen challenge! This is some testimonial text for this month's CodePen challenge!</p>
<div class="source">
<div class="source">
<span>Testimonial Source</span>
</div>
</div>
Expand All @@ -19,7 +27,7 @@ <h4>Testimonial</h4>
<div class="testimonial">
<h4>Testimonial</h4>
<p>This is some testimonial text for this month's CodePen challenge! This is some testimonial text for this month's CodePen challenge!</p>
<div class="source">
<div class="source">
<span>Testimonial Source</span>
</div>
</div>
Expand All @@ -29,7 +37,7 @@ <h4>Testimonial</h4>
<div class="testimonial">
<h4>Testimonial</h4>
<p>This is some testimonial text for this month's CodePen challenge! This is some testimonial text for this month's CodePen challenge!</p>
<div class="source">
<div class="source">
<span>Testimonial Source</span>
</div>
</div>
Expand All @@ -39,12 +47,14 @@ <h4>Testimonial</h4>
<div class="testimonial">
<h4>Testimonial</h4>
<p>This is some testimonial text for this month's CodePen challenge! This is some testimonial text for this month's CodePen challenge!</p>
<div class="source">
<div class="source">
<span>Testimonial Source</span>
</div>
</div>
</div>
</div>
</section>

<div style="text-align:right;margin-right:25px;margin-top:25;">
<span class="prev glyphicon glyphicon-chevron-left"></span>
<span class="next glyphicon glyphicon-chevron-right"></span>
Expand Down Expand Up @@ -87,4 +97,4 @@ <h4>Testimonial</h4>
]
});
</script>
</section>
</section>
4 changes: 3 additions & 1 deletion _layouts/home.html
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
---
layout: default


---
{% include header.html %}
{% include benefits.html %}
{% include testimonials.html %}
{% include join.html %}
{% include faqs.html %}
{% include faqs.html %}
5 changes: 0 additions & 5 deletions index.html

This file was deleted.

42 changes: 42 additions & 0 deletions index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,48 @@
linktitle: Welcome
layout: home
navbarClass: 'navbar-shrinkable'
faqs:
- q: What is Mankind Project Japan?
a: |
Mankind Project Japan is a **men's support group** based in **Tokyo** that hosts **weekly online gatherings.**
- q: What are the benefits of joining?
a: |
You'll gain **support, insights, and connections** with like-minded men. It's an opportunity for **personal growth** and **self-discovery**.
- q: Does it cost any money to join?
a: |
**No**. Joining Mankind Project Japan's online gatherings is **completely free**. We believe in making our support accessible to all men.
**Note**\: We do ask for **voluntary donations** from time to time in order to cover overheads and grow the group. But these donations are **not a condition** for continued participation."
- q: How can I join?
a: |
[Sign up here.](#join) It's free and open to all men.
- q: How often are the gatherings?
a: |
We host **weekly** online gatherings. First Tuesdays of the month for **new members**. These ensure regular **support and connection** for our participants.
- q: What topics are discussed?
a: |
We cover a wide range of topics that includes **personal growth**, **relationships**, and **emotional well-being**. Each gathering is facilitated by experienced leaders.
- q: Can I share my story?
a: |
**Absolutely**. Our gatherings provide a space for men to share their stories, experiences, and challenges. We encourage open and honest communication.
- q: Are the gatherings confidential?
a: |
Yes, we **prioritize confidentiality** and create a safe and supportive environment for all participants. What is shared in the gatherings **stays within the group**.
- q: How can I contact you?
a: |
For further questions or assistance, please feel free to contact us at tokyo[α𝐭]mkpjapan.org.
- q: Can I attend anonymously?
a: |
**Absolutely!** We respect everyone's privacy and understand that some participants may prefer to attend anonymously. You can choose to use a **pseudonym** during the gatherings.
---

# Imagine
Expand Down
Loading

0 comments on commit 65985cc

Please sign in to comment.