vgaNAR6ta/drags-and-nerds
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

edit: ajout icon & bug fix infobulle timer

Browse Source
This commit is contained in:
Vega
2026-03-30 04:14:53 +02:00
parent a50c2d82c8
commit f5ed2a7d9c
25 changed files with 141 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
v1-com-officielle/src/assets/icons/contact.svg
+3 -2
View File
@@ -1,4 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 109.29 109.29"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 38.96 38.9">
<path d="M26.84,102.1c-8.31-4.79-14.87-11.36-19.66-19.72C2.4,74.02,0,64.76,0,54.58s2.4-19.42,7.19-27.74c4.79-8.31,11.34-14.86,19.66-19.66C35.16,2.4,44.44,0,54.71,0s19.42,2.4,27.73,7.19c8.31,4.79,14.86,11.34,19.66,19.66,4.79,8.31,7.19,17.56,7.19,27.74v42.75h-12.72v-7.89c-2.97,2.46-6.3,4.37-9.99,5.72-3.69,1.36-7.53,2.04-11.51,2.04-7.21,0-13.78-2.16-19.72-6.49l.64,18.45c-.34.08-.76.13-1.27.13-10.26,0-19.55-2.4-27.86-7.19ZM24.75,71.56c2.84,5.13,6.74,9.25,11.71,12.34,4.96,3.1,10.5,4.77,16.6,5.02-3.56-3.22-6.36-7.02-8.4-11.39-2.04-4.37-3.05-9.05-3.05-14.06,0-6.02,1.5-11.58,4.52-16.67,3.01-5.09,7.08-9.14,12.21-12.15,5.13-3.01,10.71-4.52,16.73-4.52.85,0,2.2.08,4.07.25-3.05-3.14-6.7-5.58-10.94-7.32-4.24-1.74-8.74-2.61-13.49-2.61-6.36,0-12.15,1.49-17.37,4.45-5.22,2.97-9.33,7.06-12.34,12.28-3.01,5.22-4.52,11.01-4.52,17.37s1.42,11.85,4.26,16.99ZM84.29,72.71c2.59-2.5,3.88-5.49,3.88-8.97s-1.29-6.59-3.88-9.1c-2.59-2.5-5.66-3.75-9.22-3.75s-6.57,1.25-9.03,3.75c-2.46,2.5-3.69,5.53-3.69,9.1s1.23,6.57,3.69,9.03c2.46,2.46,5.47,3.69,9.03,3.69s6.64-1.25,9.22-3.75Z"/> <path d="M7.99,22.5c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26,1.41-.94,2.31-.94,1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31-1.41.96-2.31.96-1.67-.32-2.31-.96ZM17.17,22.5c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26c.64-.63,1.41-.94,2.31-.94s1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31c-.64.64-1.41.96-2.31.96s-1.67-.32-2.31-.96ZM26.34,22.5c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26c.64-.63,1.41-.94,2.31-.94s1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31-1.41.96-2.31.96-1.67-.32-2.31-.96Z"/>
<path d="M36.39,9.59c-1.71-2.97-4.05-5.31-7.02-7.02-2.97-1.71-6.25-2.57-9.86-2.57s-6.94.86-9.91,2.57c-2.97,1.71-5.31,4.05-7.02,7C.86,12.52,0,15.81,0,19.45s.86,6.93,2.57,9.88c.04.07.08.13.12.19l-.86,5.81.03.03,5.31-.7c.76.6,1.56,1.16,2.43,1.66,2.97,1.71,6.27,2.57,9.91,2.57s6.89-.86,9.86-2.57c2.97-1.71,5.31-4.05,7.02-7.02,1.71-2.97,2.57-6.25,2.57-9.86s-.86-6.89-2.57-9.86ZM19.48,33.98c-3.73,0-7.12-1.42-9.69-3.72l-3.44.6-.03-.03.74-3.85c-1.34-2.2-2.12-4.77-2.12-7.53,0-8.03,6.51-14.53,14.53-14.53s14.53,6.51,14.53,14.53-6.51,14.53-14.53,14.53Z"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

v1-com-officielle/src/assets/icons/day.svg
+12
View File
@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34.01 34.53">
<path d="M10.91,27.58c-1.85-1.07-3.31-2.52-4.37-4.36-1.07-1.84-1.6-3.89-1.6-6.16s.53-4.32,1.6-6.15c1.07-1.84,2.52-3.29,4.37-4.36,1.85-1.07,3.91-1.6,6.17-1.6s4.29.53,6.14,1.6c1.85,1.07,3.3,2.52,4.37,4.37,1.07,1.85,1.6,3.89,1.6,6.14s-.53,4.29-1.6,6.14c-1.07,1.85-2.52,3.31-4.37,4.37-1.85,1.07-3.89,1.6-6.14,1.6s-4.32-.53-6.17-1.6ZM20.51,22.94c1.03-.59,1.85-1.41,2.44-2.44s.89-2.18.89-3.43-.3-2.4-.89-3.43-1.41-1.85-2.44-2.44c-1.04-.59-2.18-.89-3.43-.89s-2.43.3-3.46.89c-1.03.59-1.85,1.41-2.44,2.44-.59,1.03-.89,2.18-.89,3.43s.3,2.4.89,3.43c.59,1.03,1.41,1.85,2.44,2.44,1.03.59,2.19.89,3.46.89s2.4-.3,3.43-.89Z"/>
<path d="M15.29.08l3.31-.08-.15,3.71h-2.86s-.31-3.63-.31-3.63Z"/>
<path d="M19.13,34.43l-3.97.1.18-4.45h3.42s.37,4.35.37,4.35Z"/>
<path d="M30.95,28.29l-2.37,2.49-2.61-2.83,2.08-2.1,2.9,2.44Z"/>
<path d="M33.93,15.34l.08,3.31-3.71-.15v-2.86s3.63-.31,3.63-.31Z"/>
<path d="M28.48,3.38l2.47,2.35-2.81,2.59-2.08-2.07,2.42-2.87Z"/>
<path d="M5.79,30.92l-2.49-2.37,2.83-2.62,2.1,2.09-2.45,2.9Z"/>
<path d="M.08,18.76l-.08-3.35,3.76.15v2.89s-3.68.31-3.68.31Z"/>
<path d="M3.46,5.82l2.29-2.41,2.53,2.74-2.02,2.03-2.8-2.37Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

v1-com-officielle/src/assets/icons/folder.svg
+2 -2
View File
@@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 118.5 103.19"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.19 38.67">
<path d="M78.75,24.59c-1.86-.06-3.42-.72-4.65-1.99-1.3-1.33-1.95-2.97-1.95-4.9V0H10.95v24.59H0v78.6h118.5V24.59h-39.75ZM102.5,87.19H16v-46.29h11.55v-24.9h27.8v1.05c0,4.4,1.03,8.38,3.1,11.95,2.07,3.57,4.92,6.38,8.55,8.45,3.55,2.02,7.47,3.04,11.75,3.09v.05h23.75v46.6Z"/> <path d="M36,15.81c-.66,0-1.21-.22-1.63-.66-.43-.44-.64-.98-.64-1.62v-3.66L3.28,0v10.09H0v28.58h40.19V15.81h-4.18ZM32.3,33.39H5.28V15.37h2.33l-.03-.13h1.17v-7.59l19.43,5.85v.03c0,1.45.34,2.77,1.02,3.94.68,1.18,1.62,2.11,2.82,2.79.89.51,1.85.82,2.88.95v12.17h-2.61Z"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 420 B

After

Width:  |  Height:  |  Size: 417 B

v1-com-officielle/src/assets/icons/img.svg
+5
View File
@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.19 38.9">
<path d="M33.56,0H0v38.9h40.19V0h-6.62ZM6.2,33.62h-.92V5.28h2.61s24.41,0,24.41,0h0s2.61,0,2.61,0v19.57l-5.89-14.74-6.79,17.11-4.83-10.08h-.07l-7.87,16.48h-3.26ZM19.42,33.62h-4.08l2.03-4.6,2.05,4.6ZM25.3,33.62l-.02-.04,3.78-9.64,3.74,9.69h-7.5Z"/>
<path d="M11.89,14.3c.9,0,1.67-.31,2.31-.94s.96-1.38.96-2.26-.32-1.67-.96-2.31c-.64-.64-1.41-.96-2.31-.96s-1.67.32-2.31.96-.96,1.41-.96,2.31.32,1.63.96,2.26c.64.63,1.41.94,2.31.94Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 581 B

v1-com-officielle/src/assets/icons/insta.svg
+6
View File
@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.19 38.9">
<path d="M15.72,28.19c-1.34-.78-2.4-1.84-3.18-3.18-.78-1.34-1.17-2.81-1.17-4.39s.39-3.04,1.17-4.37c.78-1.33,1.84-2.39,3.18-3.17,1.34-.78,2.8-1.17,4.39-1.17s3.04.39,4.37,1.17c1.33.78,2.39,1.84,3.17,3.17.78,1.33,1.17,2.79,1.17,4.37s-.39,3.05-1.17,4.39-1.84,2.4-3.17,3.18c-1.33.78-2.79,1.17-4.37,1.17s-3.05-.39-4.39-1.17ZM22.54,23.05c.67-.68,1.01-1.5,1.01-2.44s-.34-1.75-1.01-2.43c-.67-.67-1.48-1.01-2.43-1.01s-1.76.34-2.44,1.01c-.68.67-1.02,1.48-1.02,2.43s.34,1.76,1.02,2.44c.68.68,1.5,1.02,2.44,1.02s1.75-.34,2.43-1.02Z"/>
<path d="M33.56,0H0v38.9h40.19V0h-6.62ZM32.3,33.62H5.28V5.28h2.61s24.41,0,24.41,0h0s2.61,0,2.61,0v28.34h-2.61Z"/>
<path d="M27.2,12.71c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26,1.41-.94,2.31-.94,1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31-1.41.96-2.31.96-1.67-.32-2.31-.96Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 967 B

v1-com-officielle/src/assets/icons/like.svg
+4
View File
@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29.31 24.54">
<path d="M29.31,8.82c0-1.65-.39-3.14-1.16-4.49-.77-1.35-1.83-2.41-3.16-3.18-1.33-.77-2.82-1.16-4.47-1.16s-3.18.39-4.54,1.16c-.48.27-.92.6-1.33.95-.41-.35-.84-.67-1.33-.95-1.36-.77-2.87-1.16-4.54-1.16s-3.13.39-4.47,1.16c-1.33.77-2.39,1.83-3.16,3.18-.77,1.35-1.16,2.84-1.16,4.49s.39,3.15,1.16,4.51c.41.72.91,1.36,1.48,1.92l11.56,9.29h.17l12.62-9.63c.22-.24.43-.49.62-.76l.08-.1h-.01c.16-.24.33-.47.47-.72.77-1.36,1.16-2.86,1.16-4.51ZM22.36,10.66l-.28.33-7.18,6.34c-.35.31-.87.29-1.2-.03l-6.75-6.64h0c-.49-.48-.74-1.09-.74-1.83s.24-1.36.73-1.85,1.1-.73,1.85-.73,1.38.24,1.89.73c.11.11.21.26.3.44.46.92,1.36,1.53,2.39,1.53h2.59c1.03,0,1.93-.61,2.39-1.53.09-.18.19-.33.3-.44.51-.49,1.14-.73,1.89-.73s1.36.24,1.85.73.73,1.1.73,1.85-.25,1.35-.74,1.84h0Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 899 B

v1-com-officielle/src/assets/icons/link.svg
+3 -3
View File
@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 98.15 105.63"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 38.83 37.87">
<path d="M35.16,0h23.64L23.64,105.63H0L35.16,0Z"/> <path d="M16.91,30.56l1.95,3.36,5.02-2.9,3.97,6.85,9.94-5.75-3.97-6.85,5.02-2.9-1.95-3.36L12.5,0l4.41,30.56ZM33.34,21.05l-4.98,2.88.66,1.14h0s3.27,5.65,3.27,5.65l-2.95,1.68-1.98-3.41h.02s-1.95-3.37-1.95-3.37l-4.97,2.88-2.84-19.71,15.72,12.26Z"/>
<path d="M74.51,0h23.64l-35.16,105.63h-23.64L74.51,0Z"/> <path d="M3.53,12.35H0v-3.53h3.53v-3.47h3.53v3.47h3.45v3.53h-3.45v3.5h-3.53v-3.5Z"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 260 B

After

Width:  |  Height:  |  Size: 482 B

v1-com-officielle/src/assets/icons/msg.svg
+4
View File
@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.19 38.9">
<path d="M34.25,0H0v38.9h40.19V0h-5.94ZM31.49,5.28l-11.38,21.74L8.85,5.28h22.63ZM7.89,33.62h-2.61V9.97l12.1,23.65H7.89ZM32.3,33.62h-9.44l12.04-23.37v23.37h-2.61Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 313 B

v1-com-officielle/src/assets/icons/next.svg
+2 -2
View File
@@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80.03 53.1"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18.25 17.52">
<polygon points="24.73 0 24.73 17.46 0 17.46 0 35.64 24.73 35.64 24.73 53.1 80.03 26.6 80.03 26.4 24.73 0"/> <polygon points="12.97 .23 12.97 6.19 0 0 0 5.94 6.37 8.75 0 11.58 0 17.52 12.97 11.31 12.97 17.29 18.25 17.29 18.25 8.78 18.25 8.71 18.25 .23 12.97 .23"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 257 B

After

Width:  |  Height:  |  Size: 305 B

v1-com-officielle/src/assets/icons/night.svg
+5
View File
@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31.8 30.75">
<path d="M4.06,8.45l-2.47,1.39-1.58-2.84,2.41-1.39-2.41-1.39L1.58,1.39l2.47,1.35V0h3.23v2.74l2.51-1.35,1.55,2.84-2.38,1.39,2.38,1.39-1.55,2.84-2.51-1.39v2.8h-3.23v-2.8Z"/>
<path d="M31.8,18.58c0-2.12-.52-4.11-1.57-5.97-1.03-1.8-2.48-3.26-4.36-4.39-.06-.03-.1-.07-.16-.11-1.64-.96-3.35-1.5-5.11-1.67,0,1.22-.12,2.45-.42,3.71-.13.54-.28,1.07-.45,1.6-.49,1.51-1.16,3.01-2.03,4.49-1.18,2.01-2.55,3.73-4.1,5.15-.04.04-.09.07-.13.11-1.41,1.26-2.93,2.21-4.58,2.86.11.21.22.42.34.62.88,1.38,2.03,2.54,3.43,3.5.26.18.52.37.8.53,1.96,1.14,4,1.72,6.13,1.74,2.13.01,4.13-.5,5.97-1.55,1.85-1.05,3.35-2.55,4.49-4.5s1.72-4,1.73-6.12ZM22.95,24.51c-1.04.59-2.15.88-3.34.87-.68,0-1.34-.13-1.98-.34,2-1.74,3.67-3.72,4.97-5.94.9-1.55,1.62-3.2,2.15-4.95.3.34.57.69.79,1.08.59,1.03.88,2.15.87,3.34-.01,1.19-.33,2.33-.97,3.41s-1.47,1.92-2.5,2.51Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 977 B

v1-com-officielle/src/assets/icons/pause.svg
+5
View File
@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13.67 16.63">
<path d="M5.28,0v16.63H0V0h5.28Z"/>
<path d="M13.67,0v16.63h-5.28V0h5.28Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 228 B

v1-com-officielle/src/assets/icons/people.svg
+11
View File
@@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.92 39.51">
<path d="M16.09,24.94c-.54-.92-1.27-1.64-2.21-2.17-.94-.53-1.98-.79-3.14-.79s-2.15.26-3.08.79c-.93.53-1.66,1.26-2.2,2.19-.54.93-.81,1.95-.81,3.05v11.5h12.24v-11.5c0-1.13-.27-2.15-.81-3.07ZM8.83,35.39v-7.3c0-.51.19-.97.57-1.35.38-.39.83-.58,1.34-.58.55,0,1.01.19,1.4.57.39.38.58.84.58,1.37v7.3h-3.9Z"/>
<path d="M31.13,35.3l-2.72-17.3h-6.16l-2.72,17.3h-.04v4.12h11.67v-4.12h-.04ZM25.33,22.42l1.56,12.88h-3.12l1.56-12.88Z"/>
<g>
<polygon points="38.56 29.52 38.56 22.21 38.36 22.21 34.76 22.21 32.47 22.21 32.47 26.16 34.76 26.16 34.76 29.52 32.54 29.52 32.54 33.47 40.92 33.47 40.92 29.52 38.56 29.52"/>
<path d="M36.73,20.99c.63,0,1.17-.22,1.59-.65.43-.44.64-.97.64-1.61s-.22-1.12-.65-1.56-.96-.65-1.58-.65-1.13.22-1.57.67-.67.96-.67,1.55c0,.63.22,1.17.67,1.61.44.44.97.65,1.57.65Z"/>
</g>
<path d="M17.29,11.84s-.01,0-.02-.01c.08-.24.13-.5.13-.77,0-.22-.04-.43-.09-.63.05-.21.09-.42.09-.64,0-.43-.11-.82-.32-1.17.2-.36.32-.75.32-1.19,0-.66-.24-1.23-.72-1.7-.34-.33-.73-.54-1.17-.64-.08-.49-.3-.93-.68-1.31-.48-.47-1.06-.71-1.74-.71-.32,0-.62.06-.89.16-.47-.43-1.02-.65-1.67-.65-.61,0-1.13.2-1.58.58-.41-.3-.89-.46-1.43-.46-.68,0-1.26.24-1.74.71-.22.21-.38.45-.49.7-.2-.05-.4-.08-.62-.08-.68,0-1.26.24-1.74.71-.48.47-.72,1.04-.72,1.7-.26.12-.5.28-.72.49-.48.47-.72,1.04-.72,1.7,0,.33.06.63.17.91-.07.06-.15.11-.22.18C.24,10.18,0,10.75,0,11.41s.24,1.26.72,1.74c.02.02.04.03.06.05-.21.35-.32.75-.32,1.18,0,.68.24,1.26.72,1.74.41.41.89.63,1.43.69.12.33.3.63.57.9.39.39.86.62,1.38.69.57.9,1.31,1.63,2.24,2.16,1.01.59,2.11.88,3.3.88s2.29-.29,3.29-.88c1-.59,1.8-1.39,2.38-2.4.44-.75.71-1.56.82-2.41.24-.12.47-.27.68-.48.48-.48.72-1.06.72-1.74s-.24-1.23-.72-1.7ZM10.09,19c-1.97,0-3.56-1.6-3.56-3.56s1.6-3.56,3.56-3.56,3.56,1.6,3.56,3.56-1.6,3.56-3.56,3.56Z"/>
<path d="M31.69,12.54l4.65-3.36v-.02s-4.89-1.01-4.89-1.01l2.43-4.54v-.02s-5.27,1.35-5.27,1.35L29.74.01h-.02s-5.93,4.41-5.93,4.41l-1.13-2.82h-.02s-2.56,5.33-2.56,5.33c-.16.21-.31.43-.45.66-.59,1-.88,2.1-.88,3.29s.29,2.29.88,3.3c.59,1.01,1.39,1.81,2.4,2.4,1.01.59,2.11.88,3.3.88s2.29-.29,3.29-.88c.37-.22.71-.48,1.03-.76l5.11-.61v-.02s-3.08-2.65-3.08-2.65c0,0,0,0,0,0ZM31.89,10.12l-.04.03s0-.02,0-.03h.04ZM25.33,15.46c-1.97,0-3.56-1.6-3.56-3.56,0-1.73,1.24-3.18,2.88-3.49.22-.06.45-.1.69-.1s.48.04.7.1c.01,0,.02,0,.03,0,.09.03.18.05.27.08,1.47.44,2.55,1.79,2.55,3.4,0,1.97-1.6,3.56-3.56,3.56Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

v1-com-officielle/src/assets/icons/play.svg
+2 -2
View File
@@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 73.5 73.4"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18.25 17.52">
<path d="M18.1,68.55c-5.6-3.23-10.02-7.63-13.25-13.2C1.62,49.78,0,43.57,0,36.7s1.62-13.08,4.85-18.65c3.23-5.57,7.65-9.97,13.25-13.2C23.7,1.62,29.93,0,36.8,0s13,1.62,18.6,4.85c5.6,3.23,10.02,7.65,13.25,13.25,3.23,5.6,4.85,11.8,4.85,18.6s-1.62,13-4.85,18.6c-3.23,5.6-7.65,10.02-13.25,13.25-5.6,3.23-11.8,4.85-18.6,4.85s-13.1-1.62-18.7-4.85ZM47.2,54.5c3.13-1.8,5.6-4.27,7.4-7.4,1.8-3.13,2.7-6.6,2.7-10.4s-.9-7.27-2.7-10.4c-1.8-3.13-4.27-5.6-7.4-7.4-3.13-1.8-6.6-2.7-10.4-2.7s-7.37.9-10.5,2.7c-3.13,1.8-5.6,4.27-7.4,7.4-1.8,3.13-2.7,6.6-2.7,10.4s.9,7.27,2.7,10.4c1.8,3.13,4.27,5.6,7.4,7.4,3.13,1.8,6.63,2.7,10.5,2.7s7.27-.9,10.4-2.7Z"/> <path d="M0,17.52v-5.94l6.37-2.84L0,5.94V0l18.25,8.71v.07L0,17.52Z"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 780 B

After

Width:  |  Height:  |  Size: 219 B

v1-com-officielle/src/assets/icons/prev.svg
+2 -2
View File
@@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80.03 53.1"> <svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18.25 17.52">
<polygon points="55.3 53.1 55.3 35.64 80.03 35.64 80.03 17.46 55.3 17.46 55.3 0 0 26.5 0 26.7 55.3 53.1"/> <polygon points="18.25 0 5.28 6.21 5.28 .23 0 .23 0 8.75 0 8.81 0 17.29 5.28 17.29 5.28 11.33 18.25 17.52 18.25 11.58 11.88 8.78 18.25 5.94 18.25 0"/>
</svg> </svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 255 B

After

Width:  |  Height:  |  Size: 300 B

v1-com-officielle/src/assets/icons/text.svg
+5
View File
@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.19 38.9">
<path d="M8.61,30.26c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26,1.41-.94,2.31-.94,1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31-1.41.96-2.31.96-1.67-.32-2.31-.96ZM17.78,30.26c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26c.64-.63,1.41-.94,2.31-.94s1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31c-.64.64-1.41.96-2.31.96s-1.67-.32-2.31-.96ZM26.96,30.26c-.64-.64-.96-1.41-.96-2.31s.32-1.63.96-2.26c.64-.63,1.41-.94,2.31-.94s1.67.31,2.31.94c.64.63.96,1.38.96,2.26s-.32,1.67-.96,2.31-1.41.96-2.31.96-1.67-.32-2.31-.96Z"/>
<path d="M34.91,7.2l-1.92-1.92L27.71,0H0v38.9h40.19V12.48l-5.28-5.28ZM32.3,33.62H5.28V5.28h2.61s17.64,0,17.64,0v9.84h9.38v18.5h-2.61Z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 825 B

v1-com-officielle/src/assets/style.css
+4 -4
View File
@@ -38,11 +38,11 @@
/*===================Animation*/ /*===================Animation*/
@keyframes blink { @keyframes blink {
0% { color: var(--accent-color);} 0% { color: var(--accent-color);}
15% { color: var(--back-color);} 15% { color: #000000;}
35% { color: var(--back-color);} 35% { color: #000000;}
50% { color: var(--accent-color);} 50% { color: var(--accent-color);}
65% { color: var(--back-color);} 65% { color: #000000;}
85% { color: var(--back-color);} 85% { color: #000000;}
100% { color: var(--accent-color);} 100% { color: var(--accent-color);}
} }
v1-com-officielle/src/indieComponents/ArtistPannel.vue
+14 -12
View File
@@ -1,9 +1,9 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import CloseIcon from '../assets/icons/close.svg'
import FolderIcon from '../assets/icons/folder.svg' import FolderIcon from '../assets/icons/folder.svg'
import FileIcon from '../assets/icons/file.svg' import TextIcon from '../assets/icons/text.svg'
import ReloadIcon from '../assets/icons/reload.svg' import ImgIcon from '../assets/icons/img.svg'
import AboutIcon from '../assets/icons/about.svg' import LinkIcon from '../assets/icons/link.svg'
import BackIcon from '../assets/icons/back.svg' import BackIcon from '../assets/icons/back.svg'
import { loadPeopleData } from '@/data/peopleData.js' import { loadPeopleData } from '@/data/peopleData.js'
</script> </script>
@@ -36,14 +36,14 @@
<p id="emptyFolderText" v-show="emptyFolder">Oops! There is nothing to display here...</p> <p id="emptyFolderText" v-show="emptyFolder">Oops! There is nothing to display here...</p>
<div v-show="gridDisplay" class="theMatrix" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll"> <div v-show="gridDisplay" class="theMatrix" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
<div class="itemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)"> <div class="itemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)">
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? FileIcon : item.type === 'link'? AboutIcon : CloseIcon" class="icon"/> <component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
<p class="itemCaption">{{item.caption}}</p> <p class="itemCaption">{{item.caption}}</p>
</div> </div>
</div> </div>
<div v-show="listDisplay" class="nevrEndingList" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll"> <div v-show="listDisplay" class="nevrEndingList" @mousedown.stop @touchstart.stop @reload="dataFirstLoad" @click="deselectAll">
<div class="listItemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)"> <div class="listItemStyle" v-for="item in displayedItems" :class="{selectedItemStyle:item.isSelected, displayStyle: !item.isSelected}" :key="item.caption" @click.stop="itemIsClicked(item)">
<component :is="item.type==='folder'? FolderIcon : item.type === 'text'? FileIcon : item.type === 'link'? AboutIcon : CloseIcon" class="icon"/> <component :is="item.type==='folder'? FolderIcon : item.type === 'text'? TextIcon : item.type === 'link'? LinkIcon : ImgIcon" class="icon"/>
<p class="itemCaption">{{item.caption}}</p> <p class="itemCaption" id="listTitle">{{item.caption}}</p>
<p class="itemCaption">*auteurice*</p> <p class="itemCaption">*auteurice*</p>
<p class="itemCaption">{{item.date}}</p> <p class="itemCaption">{{item.date}}</p>
</div> </div>
@@ -258,6 +258,7 @@
border-width: thin; border-width: thin;
border-color: transparent; border-color: transparent;
border-radius: 16.1px; border-radius: 16.1px;
overflow-x: hidden;
} }
.listItemStyle:hover{ .listItemStyle:hover{
@@ -278,7 +279,7 @@
font-size: 16.1px; font-size: 16.1px;
pointer-events: none; pointer-events: none;
cursor:inherit; cursor:inherit;
width: 30%; width: 20%;
height: 100%; height: 100%;
text-align: left; text-align: left;
display: flex; display: flex;
@@ -288,6 +289,9 @@
user-select: none; user-select: none;
} }
#listTitle{
width: 50%;
}
</style> </style>
@@ -378,13 +382,11 @@
} }
console.log(dataStorage.selectedLink); console.log(dataStorage.selectedLink);
} }
if (e.type === 'text'){
this.selectFile(e); this.selectFile(e);
}
}, },
selectFile(e){ selectFile(e){
this.$emit('focus');
this.displayedItems.forEach(it => { this.displayedItems.forEach(it => {
it.isSelected = false; it.isSelected = false;
}) })
@@ -420,8 +422,6 @@
backToRoot(){ backToRoot(){
this.displayedItems = this.rootFolderContent.at(-1).content; this.displayedItems = this.rootFolderContent.at(-1).content;
this.fileName = this.rootFolderContent.at(-1).directory; this.fileName = this.rootFolderContent.at(-1).directory;
this.displayedDescription = this.rootFolderContent.at(-1).description;
this.rootFolderContent.splice(this.rootFolderContent.length-1,1);
this.rootDepth = this.rootFolderContent.length this.rootDepth = this.rootFolderContent.length
if (this.rootDepth === 0){ if (this.rootDepth === 0){
this.isNotRoot = false; this.isNotRoot = false;
@@ -431,6 +431,8 @@
this.listDisplay = false; this.listDisplay = false;
this.gridDisplay = true; this.gridDisplay = true;
} }
this.deselectAll();
this.rootFolderContent.splice(this.rootFolderContent.length-1,1);
}, },
closeClicked(){ closeClicked(){
this.dataFirstLoad(); this.dataFirstLoad();
v1-com-officielle/src/indieComponents/Infobulle.vue
+9 -3
View File
@@ -28,7 +28,7 @@
} }
#infoBulleContainer div{ #infoBulleContainer div{
visibility: hidden; visibility: visible;
text-align: center; text-align: center;
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -70,11 +70,12 @@
isActive: false, isActive: false,
posX: 0, posX: 0,
posY: 0, posY: 0,
bubbleContent:"" bubbleContent:"",
hideTimer: null
} }
}, },
methods:{ methods:{
loadBubble(event){ async loadBubble(event){
let item = event.target let item = event.target
if (!item.dataset.tooltip) { if (!item.dataset.tooltip) {
this.hideBubble(); this.hideBubble();
@@ -87,6 +88,11 @@
} }
this.posY = event.clientY + 13.12; this.posY = event.clientY + 13.12;
this.isActive = true; this.isActive = true;
clearTimeout(this.hideTimer)
this.hideTimer = setTimeout(() => {
this.hideBubble();
}, 3333)
}, },
hideBubble(){ hideBubble(){
this.isActive = false this.isActive = false
v1-com-officielle/src/indieComponents/MessagePannel.vue
+2 -1
View File
@@ -1,5 +1,6 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import CloseIcon from '../assets/icons/close.svg'
import LikeIcon from '../assets/icons/like.svg'
</script> </script>
<template> <template>
@@ -25,7 +26,7 @@
<div class="reactBar"> <div class="reactBar">
<p class="reactStatStyle">{{selectedMsg.like}}</p> <p class="reactStatStyle">{{selectedMsg.like}}</p>
<button data-tooltip="j'aime bien" type="button" class="iconBtnStyle" :class="{reactedStyle: selectedMsg.isLiked}" @mousedown.capture="likeMsg" @touchstart.capture="likeMsg"> <button data-tooltip="j'aime bien" type="button" class="iconBtnStyle" :class="{reactedStyle: selectedMsg.isLiked}" @mousedown.capture="likeMsg" @touchstart.capture="likeMsg">
<CloseIcon name="test" class="icon"/> <LikeIcon name="test" class="icon"/>
</button> </button>
<p v-show="selectedMsg.isEvent" class="reactStatStyle">{{selectedMsg.going}}</p> <p v-show="selectedMsg.isEvent" class="reactStatStyle">{{selectedMsg.going}}</p>
<button v-show="selectedMsg.isEvent" type="button" class="textBtnStyle" :class="{reactedStyle: selectedMsg.isGoing}" @mousedown.capture="goingToEvent" @touchstart.capture="goingToEvent"> <button v-show="selectedMsg.isEvent" type="button" class="textBtnStyle" :class="{reactedStyle: selectedMsg.isGoing}" @mousedown.capture="goingToEvent" @touchstart.capture="goingToEvent">
v1-com-officielle/src/indieComponents/VisualizerPannel.vue
+2 -1
View File
@@ -1,5 +1,6 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import CloseIcon from '../assets/icons/close.svg'
import LikeIcon from '../assets/icons/like.svg'
</script> </script>
<template> <template>
@@ -25,7 +26,7 @@
<div class="reactBar"> <div class="reactBar">
<p class="reactStatStyle">{{selectedImg.like}}</p> <p class="reactStatStyle">{{selectedImg.like}}</p>
<button data-tooltip="j'aime bien" type="button" class="iconBtnStyle" :class="{reactedStyle: selectedImg.isLiked}" @mousedown.capture="likeImg" @touchstart.capture="likeImg"> <button data-tooltip="j'aime bien" type="button" class="iconBtnStyle" :class="{reactedStyle: selectedImg.isLiked}" @mousedown.capture="likeImg" @touchstart.capture="likeImg">
<CloseIcon name="test" class="icon"/> <LikeIcon name="test" class="icon"/>
</button> </button>
</div> </div>
</div> </div>
v1-com-officielle/src/infoComponents/InboxContent.vue
+12 -5
View File
@@ -1,5 +1,6 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import MsgIcon from '../assets/icons/msg.svg'
import LikeIcon from '../assets/icons/like.svg'
import { loadMsgData } from '@/data/msgData.js' import { loadMsgData } from '@/data/msgData.js'
</script> </script>
@@ -10,6 +11,7 @@
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p> <p>Lorem ipsum dolor sit amet consectetur adipiscing elit.</p>
</div> </div>
<div id="msgNumberStyle" data-tooltip="message.s non lu.s"> <div id="msgNumberStyle" data-tooltip="message.s non lu.s">
<MsgIcon name="msg" class="icon"/>
<p>{{msgNumber}}</p> <p>{{msgNumber}}</p>
</div> </div>
</div> </div>
@@ -21,7 +23,7 @@
</div> </div>
<div class="msgReact"> <div class="msgReact">
<p class="reactStatStyle">{{item.like}}</p> <p class="reactStatStyle">{{item.like}}</p>
<CloseIcon name="testLike" class="icon" :class="{reactedStyle: item.isLiked}"/> <LikeIcon name="testLike" class="icon" :class="{reactedStyle: item.isLiked}"/>
<p class="reactStatStyle"v-show="item.isEvent">{{item.going}}</p> <p class="reactStatStyle"v-show="item.isEvent">{{item.going}}</p>
<p v-show="item.isEvent && !item.isGoing" >PARTICIPAN.X.S</p> <p v-show="item.isEvent && !item.isGoing" >PARTICIPAN.X.S</p>
<p v-show="item.isEvent && item.isGoing" class="reactedStyle">JE PARTICIPE!</p> <p v-show="item.isEvent && item.isGoing" class="reactedStyle">JE PARTICIPE!</p>
@@ -58,8 +60,8 @@
width: 100%; width: 100%;
height: 20%; height: 20%;
position: relative; position: relative;
background-color: var(--main-color); background-color: var(--accent-color);
color: var(--back-color); color: black;
font-size: 16.1px; font-size: 16.1px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -75,7 +77,12 @@
#msgNumberStyle{ #msgNumberStyle{
font-family: 'lineal'; font-family: 'lineal';
font-size: 33px; font-size: 33px;
padding-right: 44px; padding-right: 50px;
width: 44px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
} }
#msgNumberStyle p{ #msgNumberStyle p{
v1-com-officielle/src/infoComponents/InfoMenu.vue
+7 -5
View File
@@ -1,5 +1,7 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import PeopleIcon from '../assets/icons/people.svg'
import InstaIcon from '../assets/icons/insta.svg'
import ContactIcon from '../assets/icons/contact.svg'
</script> </script>
<template> <template>
@@ -15,16 +17,16 @@
</div> </div>
<div id="btnColumn"> <div id="btnColumn">
<button type="button" class="iconBtnStyle" id="btnArtist" @click="openPannel('artist')" data-tooltip="à propos de nous"> <button type="button" class="iconBtnStyle" id="btnArtist" @click="openPannel('artist')" data-tooltip="à propos de nous">
<CloseIcon name="test" class="icon"/> <PeopleIcon name="people" class="icon"/>
</button> </button>
<!--<button type="button" class="iconBtnStyle" id="btnNews" @click="openPannel('news')" data-tooltip="newsletter"> <!--<button type="button" class="iconBtnStyle" id="btnNews" @click="openPannel('news')" data-tooltip="newsletter">
<CloseIcon name="test" class="icon"/> <CloseIcon name="test" class="icon"/>
</button>--> </button>-->
<button type="button" class="iconBtnStyle" id="btnInsta" @click="openPannel('insta')" data-tooltip="instagram"> <button type="button" class="iconBtnStyle" id="btnInsta" @click="openPannel('insta')" data-tooltip="instagram">
<CloseIcon name="test" class="icon"/> <InstaIcon name="insta" class="icon"/>
</button> </button>
<button type="button" class="iconBtnStyle" id="btnContact" @click="openPannel('contact')" data-tooltip="nous contacter"> <button type="button" class="iconBtnStyle" id="btnContact" @click="openPannel('contact')" data-tooltip="nous contacter">
<CloseIcon name="test" class="icon"/> <ContactIcon name="contact" class="icon"/>
</button> </button>
</div> </div>
</div> </div>
@@ -126,7 +128,7 @@
} }
#btnColumn .icon{ #btnColumn .icon{
width: 33px; width: 50px;
} }
#welcomeTextContainer{ #welcomeTextContainer{
v1-com-officielle/src/titleComponents/ColorBtn.vue
+6 -3
View File
@@ -1,15 +1,16 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import DayIcon from '../assets/icons/day.svg'
import NightIcon from '../assets/icons/night.svg'
</script> </script>
<template> <template>
<div id="colorBtnContainer"> <div id="colorBtnContainer">
<CloseIcon name="cyber" class="icon" :class="{checkedIcon: isChecked}"/> <NightIcon name="cyber" class="icon" :class="{checkedIcon: isChecked}"/>
<label class="switch"> <label class="switch">
<input type="checkbox" @click="toggleTheme"> <input type="checkbox" @click="toggleTheme">
<span class="slider" data-tooltip="thème"></span> <span class="slider" data-tooltip="thème"></span>
</label> </label>
<CloseIcon name="solar" class="icon" :class="{checkedIcon: !isChecked}"/> <DayIcon name="solar" class="icon" :class="{checkedIcon: !isChecked}"/>
</div> </div>
</template> </template>
@@ -79,6 +80,7 @@
-webkit-transition: .4s; -webkit-transition: .4s;
transition: .4s; transition: .4s;
border-radius: 34px; border-radius: 34px;
cursor: cell;
} }
.slider:before { .slider:before {
@@ -92,6 +94,7 @@
-webkit-transition: .4s; -webkit-transition: .4s;
transition: .4s; transition: .4s;
border-radius: 50%; border-radius: 50%;
cursor: cell;
} }
input:checked + .slider { input:checked + .slider {
v1-com-officielle/src/titleComponents/MusicPlayer.vue
+12 -4
View File
@@ -1,5 +1,8 @@
<script setup> <script setup>
import CloseIcon from '../assets/icons/close.svg' import PlayIcon from '../assets/icons/play.svg'
import PauseIcon from '../assets/icons/pause.svg'
import NextIcon from '../assets/icons/next.svg'
import PrevIcon from '../assets/icons/prev.svg'
import { loadAudioData } from '@/data/audioData.js' import { loadAudioData } from '@/data/audioData.js'
</script> </script>
@@ -9,13 +12,13 @@
<p>{{audioCredits}}</p> <p>{{audioCredits}}</p>
</div> </div>
<button type="button" class="iconBtnStyle" @click="prevTrack" data-tooltip="précédente"> <button type="button" class="iconBtnStyle" @click="prevTrack" data-tooltip="précédente">
<CloseIcon name="prev" class="icon"/> <PrevIcon name="prev" class="icon"/>
</button> </button>
<button type="button" class="iconBtnStyle" @click="toggleAudio" data-tooltip="lancer"> <button type="button" class="iconBtnStyle" @click="toggleAudio" data-tooltip="lancer">
<CloseIcon name="toggle" class="icon"/> <component :is="isPlaying? PauseIcon : PlayIcon" class="icon"/>
</button> </button>
<button type="button" class="iconBtnStyle" @click="nextTrack" data-tooltip="suivante"> <button type="button" class="iconBtnStyle" @click="nextTrack" data-tooltip="suivante">
<CloseIcon name="next" class="icon"/> <NextIcon name="next" class="icon"/>
</button> </button>
</div> </div>
<audio ref="selectedAudio" @ended="nextTrack"> <audio ref="selectedAudio" @ended="nextTrack">
@@ -57,6 +60,11 @@
margin-left: 16.1px; margin-left: 16.1px;
} }
#playerContainer .iconBtnStyle .icon{
pointer-events: none;
cursor: inherit;
}
#playerCreditStyle{ #playerCreditStyle{
width: 50%; width: 50%;
height: 50px; height: 50px;
v1-com-officielle/src/titleComponents/TitleText.vue
+1 -1
View File
@@ -76,7 +76,7 @@
margin-left: 285px; margin-left: 285px;
margin-top: -99px; margin-top: -99px;
animation: blink 3.33s infinite; animation: blink 3.33s infinite;
mix-blend-mode: difference; mix-blend-mode: exclusion;
} }
/*================ PC HAUT/IPAD*/ /*================ PC HAUT/IPAD*/