remove useless <style> replaced by :deep()

This commit is contained in:
Theophyl Hoguet committed 2023-03-27 01:19:46 +02:00
1 parent 522bbc73cf
commit e5371353f0
2 files changed
+7 -9

No files matched your search

+3 -4
View File
@@ -19,7 +19,7 @@ export default defineComponent({
<div class="flex" v-if="images.size > 0"> <div class="flex" v-if="images.size > 0">
<div v-for="[id, image] in images" :key="id" class="image"> <div v-for="[id, image] in images" :key="id" class="image">
<label>{{ image.name }}</label> <label>{{ image.name }}</label>
<Image class="gallery" :id="id" :images="images" redirect="home" /> <Image :id="id" :images="images" redirect="home" />
</div> </div>
</div> </div>
<h1 v-else>Aucune image trouvée</h1> <h1 v-else>Aucune image trouvée</h1>
@@ -59,9 +59,8 @@ label {
font-size: 1.5em; font-size: 1.5em;
color: white; color: white;
} }
</style>
<style> :deep(.imageContainer) {
.gallery.imageContainer {
margin: 2vw; margin: 2vw;
max-height: min(33vh, 33vw); max-height: min(33vh, 33vw);
max-width: min(33vw, 33vh); max-width: min(33vw, 33vh);
+4 -5
View File
@@ -73,7 +73,7 @@ export default defineComponent({
<HomeEditor v-else @apply-filter="(newFilter) => filter = newFilter"></HomeEditor> <HomeEditor v-else @apply-filter="(newFilter) => filter = newFilter"></HomeEditor>
<h5 v-if="!editor">Restez sur l'image pour passer en mode éditeur</h5> <h5 v-if="!editor">Restez sur l'image pour passer en mode éditeur</h5>
<h5 v-else>Restez sur l'image pour passer en mode selection</h5> <h5 v-else>Restez sur l'image pour passer en mode selection</h5>
<Image @mouseleave="clearTimer()" @mouseenter="startTimer()" class="home" <Image @mouseleave="clearTimer()" @mouseenter="startTimer()"
v-if="imageSelectedId !== undefined && imageSelectedId !== -1" :id="imageSelectedId" :images="images" v-if="imageSelectedId !== undefined && imageSelectedId !== -1" :id="imageSelectedId" :images="images"
:filter="filter"> :filter="filter">
</Image> </Image>
@@ -107,9 +107,8 @@ html {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
</style>
<style> :deep(.imageContainer) {
.home.imageContainer {
max-width: 60%; max-width: 60%;
width: auto; width: auto;
height: auto; height: auto;
@@ -117,7 +116,7 @@ html {
margin: 0 0 2vw 0; margin: 0 0 2vw 0;
} }
div.home.imageContainer:hover { :deep(.imageContainer:hover) {
animation: zoom-in-zoom-out 2s cubic-bezier(1, 0, 0.51, 1.01); animation: zoom-in-zoom-out 2s cubic-bezier(1, 0, 0.51, 1.01);
transform: none; transform: none;
} }