Use background images for experience items.

This commit is contained in:
Oliver Davies 2017-02-21 18:48:34 +00:00
parent 2dbee9e739
commit 034b7375e8
2 changed files with 13 additions and 11 deletions

View file

@ -27,8 +27,14 @@
max-width: 15%
.experience.has-logo
display: flex
justify-content: flex-start
background:
position: 100% (20px + 3px)
repeat: no-repeat
size: 90px
+tablet
background-size: 120px
.inner
flex: 1
.experience.has-logo .inner
padding-right: calc(90px + 1em)
+tablet
padding-right: calc(120px + 1em)

View file

@ -4,7 +4,9 @@
experience.featured ? 'is-featured',
] %}
<div class="{{ classes|sort|join(' ') }}">
{% set logo_path = company.logo ? site.images_url ~ '/assets/images/experience/' ~ company.logo : null %}
<div class="{{ classes|sort|join(' ')|trim }}"{% if logo_path %} style="background-image: url('{{ logo_path }}')"{% endif %}>
<div class="inner">
<h2>{{ company.name }}</h2>
@ -27,10 +29,4 @@
{{ experience.description|raw }}
</div>
</div>{# /.inner #}
{% if company.logo %}
<div class="experience__logo">
<img src="{{ site.images_url }}/assets/images/experience/{{ company.logo }}" alt="{{ company.name }} logo">
</div>
{% endif %}
</div>