--- /dev/null
+.ribbon-wrapper {
+ width: 60px;
+ height: 60px;
+ z-index: 5;
+ overflow: hidden;
+ position: absolute;
+ top: 0;
+ right: 0;
+}
+
+.ribbon {
+ font: bold 13px Sans-Serif;
+ color: #404040;
+ text-align: center;
+ -webkit-transform: rotate(45deg);
+ -moz-transform: rotate(45deg);
+ -ms-transform: rotate(45deg);
+ -o-transform: rotate(45deg);
+ position: relative;
+ padding: 5px 0;
+ left: -4px;
+ top: 8px;
+ width: 90px;
+ -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
+ -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
+ box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
+}
+
+.ribbon.ribbon_Gold {
+ background-color: #FDE21B;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#E9CE0C), to(#FDE21B));
+ background-image: -webkit-linear-gradient(top, #E9CE0C, #FDE21B);
+ background-image: -moz-linear-gradient(top, #E9CE0C, #FDE21B);
+ background-image: -ms-linear-gradient(top, #E9CE0C, #FDE21B);
+ background-image: -o-linear-gradient(top, #E9CE0C, #FDE21B);
+}
+
+.ribbon.ribbon_Silver {
+ background-color: #CCCCCC;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#BBBBBB), to(#CCCCCC));
+ background-image: -webkit-linear-gradient(top, #BBBBBB, #CCCCCC);
+ background-image: -moz-linear-gradient(top, #BBBBBB, #CCCCCC);
+ background-image: -ms-linear-gradient(top, #BBBBBB, #CCCCCC);
+ background-image: -o-linear-gradient(top, #BBBBBB, #CCCCCC);
+}
+
+.ribbon.ribbon_Bronze {
+ background-color: #DB9141;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#C2792A), to(#DB9141));
+ background-image: -webkit-linear-gradient(top, #C2792A, #DB9141);
+ background-image: -moz-linear-gradient(top, #C2792A, #DB9141);
+ background-image: -ms-linear-gradient(top, #C2792A, #DB9141);
+ background-image: -o-linear-gradient(top, #C2792A, #DB9141);
+}
</template>
<template name="Sponsors" id="event_sponsor" inherit_option_id="website_event.layout" inherit_id="website_event.layout">
+ <xpath expr="//t[@t-call='website.layout']" position="inside">
+ <t t-set="head">
+ <link rel='stylesheet' href='/website_event_track/static/src/css/website_event_track.css'/>
+ <t t-raw="head or ''"/>
+ </t>
+ </xpath>
<xpath expr="//div[@id='wrap']" position="inside">
<div class="container mt32 mb16" t-if="event.sponsor_ids">
<section data-snippet-id="title">
</section>
<div class="row">
<div t-attf-class="col-md-#{(len(event.sponsor_ids) > 6) and 2 or (12/ len(event.sponsor_ids))} text-center" t-foreach="event.sponsor_ids" t-as="sponsor">
- <a href="sponsor.partner_id.website or '#'">
+ <a href="sponsor.partner_id.website or '#'" style="position: relative; display: inline-block;">
<span t-field="sponsor.partner_id.image"
t-field-options='{"widget": "image", "class": "shadow"}'/>
+ <div class="ribbon-wrapper">
+ <div t-field="sponsor.sponsor_type_id" t-attf-class="ribbon ribbon_#{sponsor.sponsor_type_id.name}"/>
+ </div>
</a>
- <span t-field="sponsor.sponsor_type_id"/>
</div>
</div>
</div>