Commander1024/lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Made Image more responsive

Browse Source
This commit is contained in:
reverend 2020-08-02 23:02:06 +02:00
parent 0bb23d6a71
commit aa2a5cf3cc
3 changed files with 8 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/01_Atoms/image/_image.scss
View File

@ -1,4 +1,6 @@
.LP-Image{
max-width:100%;
max-height:100%;
object-fit: cover;
width: 100%;
height: auto;
vertical-align: top;
}

4
components/01_Atoms/image/image.config.json
View File

@ -1,3 +1,5 @@
{
"context":{
"source": "/images/photo_2020-05-02_18-11-21.jpg"
}
}

24
components/01_Atoms/image/image.hbs
View File

@ -1,23 +1 @@
<img src="/images/photo_2020-05-02_18-11-21.jpg" class="LP-Image"/>
<div style="height: 80px;width: 40px; background-color: green;">
<img src="/images/photo_2020-05-02_18-11-21.jpg" class="LP-Image"/>
</div>
<p></p>
<div style="height: 40px;width: 80px;background-color: green;">
<img src="/images/photo_2020-05-02_18-11-21.jpg" class="LP-Image"/>
</div>
<p></p>
<div style="height: 80px;width: 40px;background-color: green;">
<img src="/images/ice-vertical-panorama.jpg" class="LP-Image"/>
</div>
<p></p>
<div style="height: 40px;width: 80px;background-color: green;">
<img src="/images/ice-vertical-panorama.jpg" class="LP-Image"/>
</div>
<img src="{{source}}" class="LP-Image"/>