mirror of
https://github.com/KevinMidboe/leifsopplevelser.git
synced 2025-10-29 09:40:21 +00:00
Input images have nice alignment with background image center. Also disabled more debugging outputs to the DOM.
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
<event-form></event-form>
|
||||
</div>
|
||||
|
||||
<div class="image-grid">
|
||||
<!-- <div class="image-grid">
|
||||
<grid-layout
|
||||
ref="imageGrid"
|
||||
:layout.sync="layout"
|
||||
@@ -36,13 +36,13 @@
|
||||
</div>
|
||||
</grid-item>
|
||||
</grid-layout>
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
|
||||
<!--
|
||||
<div class="tools">
|
||||
<button class="button" @click="reorder = !reorder" v-bind:class="{ active: reorder }">{{reorder ? 'submit' : 'reoder' }}</button>
|
||||
</div>
|
||||
{{ reorder }}
|
||||
</div> -->
|
||||
<!-- {{ reorder }} -->
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="form-item required" style="overflow: hidden">
|
||||
{{ highlightedLocation }}
|
||||
<!-- {{ highlightedLocation }} -->
|
||||
|
||||
<label class="title">sted<span class="required">*</span></label>
|
||||
<input
|
||||
|
||||
@@ -6,7 +6,8 @@
|
||||
<div class="previewWindow" v-if="files.length">
|
||||
<p class="previewWindow--title">{{ files.length }} bilder lagt til</p>
|
||||
<div class="previewWindow--image">
|
||||
<img v-for="file in files" :src="file.url" @click="popOver(file)"/>
|
||||
<!-- <img v-for="file in files" :src="file.url" @click="popOver(file)"/> -->
|
||||
<div class="img" v-for="file in files" v-bind:style="{ 'background-image': `url(${file.url}`}" @click="popOver(file)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -98,13 +99,17 @@ export default {
|
||||
|
||||
&--image {
|
||||
width: 100%;
|
||||
margin-left: 0.1rem;
|
||||
|
||||
& img {
|
||||
padding: 0.2rem;
|
||||
width: calc(25% - 0.4rem);
|
||||
height: auto;
|
||||
& .img {
|
||||
display: inline-block;
|
||||
margin: 0.1rem;
|
||||
width: calc(25% - 0.3rem);
|
||||
height: 100px;
|
||||
background-size: cover;
|
||||
background-origin: content-box;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
vertical-align: middle;
|
||||
// max-width: 250px;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user