toolshed/coopcloud.tech
toolshed/coopcloud.tech
1
0
Fork 2
Code Issues 1 Pull Requests Projects Releases Activity

sexy shadows for the case studies thumbnails

Browse Source
This commit is contained in:
femmefaytale 2022-04-29 15:58:09 +01:00
parent 87034b965a
commit f128430566
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
themes/coopcloud.tech/assets/scss/main.scss
View File

@ -309,3 +309,13 @@ hr.divider {
height: 1px; height: 1px;
padding: 0; padding: 0;
} }
// Styling for img thumbnails
div.thumbnail {
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
-moz-box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
-webkit-box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
-o-box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
border-radius: 999px;
}

4
themes/coopcloud.tech/layouts/partials/index/case_studies.html
View File

@ -14,7 +14,7 @@
<div class="columns my-6 is-vcentered"> <div class="columns my-6 is-vcentered">
{{ if eq (mod $index 2) 0 }} {{ if eq (mod $index 2) 0 }}
<div class="column is-one-quarter is-offset-1"> <div class="column is-one-quarter is-offset-1">
<div class="image mx-4"> <div class="image thumbnail mx-4">
{{ with $item.thumbnail }} {{ with $item.thumbnail }}
<img src="{{ $item.thumbnail }}" class="is-rounded"> <img src="{{ $item.thumbnail }}" class="is-rounded">
{{ else }} {{ else }}
@ -32,7 +32,7 @@
<p>{{ $item.content | markdownify }}</p> <p>{{ $item.content | markdownify }}</p>
</div> </div>
<div class="column is-one-quarter is-offset-1"> <div class="column is-one-quarter is-offset-1">
<div class="image mx-4"> <div class="image thumbnail mx-4">
{{ with $item.thumbnail }} {{ with $item.thumbnail }}
<img src="{{ $item.thumbnail }}" class="is-rounded"> <img src="{{ $item.thumbnail }}" class="is-rounded">
{{ else }} {{ else }}