Commit e3eb76f5 authored by Matěj Lang's avatar Matěj Lang
Browse files

New approved icon in gallery.

parent c55b9669

src/components/image-dialog/Gallery.vue

+15 −5
Original line number Original line Diff line number Diff line
@@ -6,14 +6,18 @@ 
      class="image-container"

      class="image-container"

    >

    >

      <delete-icon

      <delete-icon

        class="discardedIcon"

        class="gallery-icon"

        v-if="$store.getters.flagImageDiscardedByUser(cameraID, imageName)"

        v-if="$store.getters.flagImageDiscardedByUser(cameraID, imageName)"

      />

      />

      <check-icon

        class="gallery-icon approved-icon"

        v-if="$store.getters.flagImageApprovedByUser(cameraID, imageName)"

      />

      <img

      <img

        :src="image"

        :src="image"

        :class="{

        :class="{

          selectedImage: activeImageName === imageName,

          selectedImage: activeImageName === imageName,

          discardedImage: chartData[imageName].discardedByUser,

          'discarded-image': chartData[imageName].discardedByUser,

          image

          image

        }"

        }"

        width="133px"

        width="133px"
@@ -27,11 +31,13 @@ 




<script>

<script>

import DeleteIcon from 'icons/Delete'

import DeleteIcon from 'icons/Delete'

import CheckIcon from 'icons/Check'





export default {

export default {

  name: 'Gallery',

  name: 'Gallery',

  components: {

  components: {

    DeleteIcon

    DeleteIcon,

    CheckIcon

  },

  },

  data() {

  data() {

    return {

    return {
@@ -108,7 +114,7 @@ export default { 
  border-radius: 5px;

  border-radius: 5px;

}

}





.discardedImage {

.discarded-image {

  opacity: 20%;

  opacity: 20%;

}

}
@@ -118,9 +124,13 @@ export default { 
  height: 94px;

  height: 94px;

}

}





.discardedIcon {

.gallery-icon {

  position: absolute;

  position: absolute;

  left: 113px;

  left: 113px;

  bottom: 25px;

  bottom: 25px;

}

}



.approved-icon svg {

  fill: var(--color-stick);

}

</style>
 
</style>