From 7d6023315c4a6e821825346d3a4cdde8d0e2321e Mon Sep 17 00:00:00 2001
From: Raghavendra Kamath <raghu@raghukamath.com>
Date: Thu, 19 Apr 2018 12:35:36 +0530
Subject: [PATCH] Add media object style

---
 foundation/hooks.py                       |  2 +-
 foundation/public/css/style.css           |  3 +
 foundation/templates/base.html            | 92 +++++++++++------------
 foundation/templates/includes/macros.html |  7 +-
 foundation/www/service-providers.html     |  8 +-
 5 files changed, 55 insertions(+), 57 deletions(-)
 create mode 100644 foundation/public/css/style.css

diff --git a/foundation/hooks.py b/foundation/hooks.py
index cf78bfc4..07d6433a 100644
--- a/foundation/hooks.py
+++ b/foundation/hooks.py
@@ -19,7 +19,7 @@ app_license = "MIT"
 # app_include_js = "/assets/foundation/js/foundation.js"
 
 # include js, css files in header of web template
-# web_include_css = "/assets/foundation/css/style.css"
+web_include_css = "/assets/foundation/css/style.css"
 # web_include_js = "/assets/foundation/js/foundation.js"
 
 # include js in page
diff --git a/foundation/public/css/style.css b/foundation/public/css/style.css
new file mode 100644
index 00000000..4ea1dc07
--- /dev/null
+++ b/foundation/public/css/style.css
@@ -0,0 +1,3 @@
+.media-img {
+	max-width: 200px;
+}
diff --git a/foundation/templates/base.html b/foundation/templates/base.html
index f38fb7aa..b92583d2 100644
--- a/foundation/templates/base.html
+++ b/foundation/templates/base.html
@@ -6,63 +6,59 @@
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<title>{% block title %} {{ title | striptags }} {% endblock %}</title>
 	<meta name="generator" content="frappe">
-    {% block favicon %}
+	{% block favicon %}
 	<link rel="shortcut icon"
-		href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
-		type="image/x-icon">
+	href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
+	type="image/x-icon">
 	<link rel="icon"
-		href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
-		type="image/x-icon">
-    {% endblock %}
+	href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
+	type="image/x-icon">
+	{% endblock %}
 	{%- block head -%}
-		{% block meta_block %}{% endblock %}
-        <link href="/assets/bootstrap-4/css/bootstrap.min.css" rel="stylesheet">
-        {% if path != '' %}
-			<link type="text/css" rel="stylesheet" href="/assets/frappe/css/hljs.css">
-			<link type="text/css" rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
-			<link type="text/css" rel="stylesheet" href="/assets/frappe/css/octicons/octicons.css">
-        {% endif %}
+	{% block meta_block %}{% endblock %}
+	<link href="/assets/bootstrap-4/css/bootstrap.min.css" rel="stylesheet">
+	<link href="/assets/foundation/css/style.css" rel="stylesheet">
 	{%- endblock -%}
 	{%- block head_include %}{{ head_include or "" }}{% endblock -%}
 	{%- block style %}{%- endblock -%}
-    <script>
-		window.frappe = {};
-		frappe.ready_events = [];
-		frappe.ready = function(fn) {
-			frappe.ready_events.push(fn);
-		}
-		window.dev_server = {{ dev_server }};
-    </script>
+	<script>
+	window.frappe = {};
+	frappe.ready_events = [];
+	frappe.ready = function(fn) {
+	frappe.ready_events.push(fn);
+	}
+	window.dev_server = {{ dev_server }};
+	</script>
 </head>
 <body data-path="{{ path }}">
-    <div class="container">
-        {%- block navbar -%}{% include "templates/includes/navbar/navbar.html" %}{%- endblock -%}
-        {% block content %}
-            {{ content }}
-        {% endblock %}
-        {%- block footer -%}{% include "templates/includes/footer/footer.html" %}{%- endblock -%}
-    </div>
-        {% block base_scripts %}
-        <!-- js should be loaded in body! -->
-        <script type="text/javascript"
-            src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
-        <script type="text/javascript"
-            src="/assets/js/frappe-web.min.js"></script>
+	<div class="container">
+		{%- block navbar -%}{% include "templates/includes/navbar/navbar.html" %}{%- endblock -%}
+		{% block content %}
+		{{ content }}
+		{% endblock %}
+		{%- block footer -%}{% include "templates/includes/footer/footer.html" %}{%- endblock -%}
+	</div>
+	{% block base_scripts %}
+	<!-- js should be loaded in body! -->
+	<script type="text/javascript"
+	src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
+	<script type="text/javascript"
+	src="/assets/js/frappe-web.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
 <script src="assets/bootstrap-4/js/bootstrap.min.js"></script>
-        {% endblock %}
-        {%- if js_globals is defined %}
-        <script>
-        {%- for key, value in js_globals.iteritems() %}
-        window.{{ key }} = "{{ value[0] }}";
-        {%- endfor -%}
-        </script>
-        {% endif -%}
-        {%- for link in web_include_js %}
-        <script type="text/javascript" src="{{ link|abs_url }}"></script>
-        {%- endfor -%}
-        {%- block script %}{%- endblock %}
-        <!-- csrf_token -->
-        {%- block body_include %}{{ body_include or "" }}{% endblock -%}
+{% endblock %}
+{%- if js_globals is defined %}
+<script>
+	{%- for key, value in js_globals.iteritems() %}
+window.{{ key }} = "{{ value[0] }}";
+{%- endfor -%}
+</script>
+{% endif -%}
+{%- for link in web_include_js %}
+<script type="text/javascript" src="{{ link|abs_url }}"></script>
+{%- endfor -%}
+{%- block script %}{%- endblock %}
+<!-- csrf_token -->
+{%- block body_include %}{{ body_include or "" }}{% endblock -%}
 </body>
 </html>
diff --git a/foundation/templates/includes/macros.html b/foundation/templates/includes/macros.html
index 09b92c4f..f40caab8 100644
--- a/foundation/templates/includes/macros.html
+++ b/foundation/templates/includes/macros.html
@@ -1,11 +1,10 @@
 {% macro media(title, content, image, link) %}
-	<div class="media centered {% if link %}clickable{% endif %}"
+	<div class="media {% if link %}clickable{% endif %}"
 		{% if link %}style="cursor: pointer;"{% endif %}
 		{% if link %}onclick="location.href='{{ link }}'"{% endif %}>
 		<a class="mr-3" href="{{ link or "#" }}">
-			<img class="img-thumbnail"
-			src="{% if image %}{% if not '/' in image %}/assets/foundation/img/{% endif %}{{ image }}{% else %}/assets/foundation/img/frappe-bird-grey.svg{% endif %}"
-			style="{% if image and not '/' in image %}opacity: 0.4{% endif %}">
+			<img class="media-img img-thumbnail" src="{% if image %}{% if not '/' in image %}/assets/foundation/img/{% endif %}{{ image }}{% else %}/assets/foundation/img/frappe-bird-grey.svg{% endif %}"
+>
 		</a>
 		<div class="media-body">
 			{% if title %}<h4>{{ title }}</h4>{% endif %}
diff --git a/foundation/www/service-providers.html b/foundation/www/service-providers.html
index f10c3c93..0c054f08 100644
--- a/foundation/www/service-providers.html
+++ b/foundation/www/service-providers.html
@@ -5,7 +5,7 @@
 {% macro gold_member(m) %}
 <div class="media {{ 'text-muted' if m.placeholder else '' }}" style="cursor: pointer;" onclick="location.href='{{ m.route }}'">
 	<a class="mr-3" href="{{ m.route }}">
-		<img class="img-thumbnail" src="{{ m.image or '/assets/foundation/img/gold.png' }}">
+		<img class="media-img img-thumbnail" src="{{ m.image or '/assets/foundation/img/gold.png' }}">
 	</a>
 	<div class="media-body">
 		<h4 class="media-heading">{{ m.title }}</h4>
@@ -36,7 +36,7 @@
 {% endmacro %}
 
 {% block page_content %}
-<section class="gold bottom-spacer-4">
+<section class="my-5 px-3">
 	<h2>Gold Members</h2>
 	{% for m in gold_members %}
 	{{ gold_member(m) }}
@@ -47,7 +47,7 @@
 	{% endif %}
 </section>
 
-<section class="silver bottom-spacer-4">
+<section class="my-5 px-3">
 	<h2>Silver Members</h2>
 	<div class="row">
 		{% for m in silver_members %}
@@ -59,7 +59,7 @@
 		Become a Silver Member and get your company featured here</a></p>
 	{% endif %}
 </section>
-<section class="bottom-spacer-4">
+<section class="my-5 px-3">
 	<h2>Individual Members</h2>
 	<div class="row page-padding">
 		{% for s in individual_members %}