Add media object style

This commit is contained in:
Raghavendra Kamath
2018-04-19 12:35:36 +05:30
parent 18f578c724
commit 7d6023315c
5 changed files with 55 additions and 57 deletions

View File

@@ -19,7 +19,7 @@ app_license = "MIT"
# app_include_js = "/assets/foundation/js/foundation.js" # app_include_js = "/assets/foundation/js/foundation.js"
# include js, css files in header of web template # 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" # web_include_js = "/assets/foundation/js/foundation.js"
# include js in page # include js in page

View File

@@ -0,0 +1,3 @@
.media-img {
max-width: 200px;
}

View File

@@ -6,63 +6,59 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %} {{ title | striptags }} {% endblock %}</title> <title>{% block title %} {{ title | striptags }} {% endblock %}</title>
<meta name="generator" content="frappe"> <meta name="generator" content="frappe">
{% block favicon %} {% block favicon %}
<link rel="shortcut icon" <link rel="shortcut icon"
href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}" href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
type="image/x-icon"> type="image/x-icon">
<link rel="icon" <link rel="icon"
href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}" href="{{ (favicon or "/assets/frappe/images/favicon.png") | abs_url }}"
type="image/x-icon"> type="image/x-icon">
{% endblock %} {% endblock %}
{%- block head -%} {%- block head -%}
{% block meta_block %}{% endblock %} {% block meta_block %}{% endblock %}
<link href="/assets/bootstrap-4/css/bootstrap.min.css" rel="stylesheet"> <link href="/assets/bootstrap-4/css/bootstrap.min.css" rel="stylesheet">
{% if path != '' %} <link href="/assets/foundation/css/style.css" rel="stylesheet">
<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 %}
{%- endblock -%} {%- endblock -%}
{%- block head_include %}{{ head_include or "" }}{% endblock -%} {%- block head_include %}{{ head_include or "" }}{% endblock -%}
{%- block style %}{%- endblock -%} {%- block style %}{%- endblock -%}
<script> <script>
window.frappe = {}; window.frappe = {};
frappe.ready_events = []; frappe.ready_events = [];
frappe.ready = function(fn) { frappe.ready = function(fn) {
frappe.ready_events.push(fn); frappe.ready_events.push(fn);
} }
window.dev_server = {{ dev_server }}; window.dev_server = {{ dev_server }};
</script> </script>
</head> </head>
<body data-path="{{ path }}"> <body data-path="{{ path }}">
<div class="container"> <div class="container">
{%- block navbar -%}{% include "templates/includes/navbar/navbar.html" %}{%- endblock -%} {%- block navbar -%}{% include "templates/includes/navbar/navbar.html" %}{%- endblock -%}
{% block content %} {% block content %}
{{ content }} {{ content }}
{% endblock %} {% endblock %}
{%- block footer -%}{% include "templates/includes/footer/footer.html" %}{%- endblock -%} {%- block footer -%}{% include "templates/includes/footer/footer.html" %}{%- endblock -%}
</div> </div>
{% block base_scripts %} {% block base_scripts %}
<!-- js should be loaded in body! --> <!-- js should be loaded in body! -->
<script type="text/javascript" <script type="text/javascript"
src="/assets/frappe/js/lib/jquery/jquery.min.js"></script> src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
<script type="text/javascript" <script type="text/javascript"
src="/assets/js/frappe-web.min.js"></script> 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="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> <script src="assets/bootstrap-4/js/bootstrap.min.js"></script>
{% endblock %} {% endblock %}
{%- if js_globals is defined %} {%- if js_globals is defined %}
<script> <script>
{%- for key, value in js_globals.iteritems() %} {%- for key, value in js_globals.iteritems() %}
window.{{ key }} = "{{ value[0] }}"; window.{{ key }} = "{{ value[0] }}";
{%- endfor -%} {%- endfor -%}
</script> </script>
{% endif -%} {% endif -%}
{%- for link in web_include_js %} {%- for link in web_include_js %}
<script type="text/javascript" src="{{ link|abs_url }}"></script> <script type="text/javascript" src="{{ link|abs_url }}"></script>
{%- endfor -%} {%- endfor -%}
{%- block script %}{%- endblock %} {%- block script %}{%- endblock %}
<!-- csrf_token --> <!-- csrf_token -->
{%- block body_include %}{{ body_include or "" }}{% endblock -%} {%- block body_include %}{{ body_include or "" }}{% endblock -%}
</body> </body>
</html> </html>

View File

@@ -1,11 +1,10 @@
{% macro media(title, content, image, link) %} {% 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 %}style="cursor: pointer;"{% endif %}
{% if link %}onclick="location.href='{{ link }}'"{% endif %}> {% if link %}onclick="location.href='{{ link }}'"{% endif %}>
<a class="mr-3" href="{{ link or "#" }}"> <a class="mr-3" href="{{ link or "#" }}">
<img class="img-thumbnail" <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 %}"
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 %}">
</a> </a>
<div class="media-body"> <div class="media-body">
{% if title %}<h4>{{ title }}</h4>{% endif %} {% if title %}<h4>{{ title }}</h4>{% endif %}

View File

@@ -5,7 +5,7 @@
{% macro gold_member(m) %} {% macro gold_member(m) %}
<div class="media {{ 'text-muted' if m.placeholder else '' }}" style="cursor: pointer;" onclick="location.href='{{ m.route }}'"> <div class="media {{ 'text-muted' if m.placeholder else '' }}" style="cursor: pointer;" onclick="location.href='{{ m.route }}'">
<a class="mr-3" 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> </a>
<div class="media-body"> <div class="media-body">
<h4 class="media-heading">{{ m.title }}</h4> <h4 class="media-heading">{{ m.title }}</h4>
@@ -36,7 +36,7 @@
{% endmacro %} {% endmacro %}
{% block page_content %} {% block page_content %}
<section class="gold bottom-spacer-4"> <section class="my-5 px-3">
<h2>Gold Members</h2> <h2>Gold Members</h2>
{% for m in gold_members %} {% for m in gold_members %}
{{ gold_member(m) }} {{ gold_member(m) }}
@@ -47,7 +47,7 @@
{% endif %} {% endif %}
</section> </section>
<section class="silver bottom-spacer-4"> <section class="my-5 px-3">
<h2>Silver Members</h2> <h2>Silver Members</h2>
<div class="row"> <div class="row">
{% for m in silver_members %} {% for m in silver_members %}
@@ -59,7 +59,7 @@
Become a Silver Member and get your company featured here</a></p> Become a Silver Member and get your company featured here</a></p>
{% endif %} {% endif %}
</section> </section>
<section class="bottom-spacer-4"> <section class="my-5 px-3">
<h2>Individual Members</h2> <h2>Individual Members</h2>
<div class="row page-padding"> <div class="row page-padding">
{% for s in individual_members %} {% for s in individual_members %}