{% extends "templates/web.html" %}

{% block title %}ERPNext Foundation - Memberships{% endblock %}

{% from "templates/includes/media.html" import media %}

{% macro card(title, body, badges, color) %}
<div class="col-sm mb-4">
	<a href="/members/details" class="card h-100">
	  <div class="card-body">
		  <h5>{{ title }}</h5>
	    <div class="card-text">{{ body }}</div>
	    <!-- <a href="{{ btnlink }}" class="btn btn-dark btn-sm">{{ btnlabel }}</a> -->
	  </div>
		<div class='card-footer'>
			{{ ', '.join(badges) }}
		</div>
	</a>
</div>
{% endmacro %}

{% block page_content %}
<section class="top-section">
	<div class='container'>
		<h1>Foundation Memberships</h1>
		<p class='lead'>Support ERPNext by becoming a foundation member and get a member listing on erpnext.org.</p>
	</div>
</section>
<section class='section-padding section-bg'>
	<div class='container'>
	<div class='row mt-4'>
	{{ card(
		"Gold Member",
		"By becoming a Gold Member, you show your leadership and a premium positioning for your brand.",
		["$5,000 / ₹3,00,000"],
		"blue")
	}}
	{{ card(
		"Silver Member",
		"Silver members get priority listing on the member list after the Gold Members.",
		["$1,500 / ₹1,00,000"],
		"gray")
	}}
	{{ card(
		"Individual Member",
		"Individual membership is ideal for users and freelancers who want to show their support.",
		["$200 / ₹10,000"],
		"light-gray")
	}}
	</div>
	</div>
</section>
<section class='section-padding'>
	<div class='container'>
	{{ media(
		"Deepak Pai",
		"Becoming a member was the easiest and quickest way of giving back to the community and the foundation. The fee helps fund documentation, development and advocacy. The money helps protect and promotes ERPNext core values of staying 100% free and open source and providing a modern, secure & stable system for all sort of business. Did not have to think twice about it.",
		"/assets/foundation/img/people/deepak-pai.jpg",
		"Grynn GmbH",
		"https://www.grynn.io"
	)}}
	<div class='text-center'>
		<p class='mt-5'>
			<a href="/members/details" class="btn btn-dark">Become A Member</a>
		</p>
		<p>
			<a href="/service-providers" class='text-muted'>See List of All Members</a>
		</p>
	</div>
	</div>
</section>
{% endblock %}