Merge branch 'master' into add/attribute-sort

CHANGELOG.md

@@ -24,4 +24,8 @@ All notable, unreleased changes to this project will be documented in this file.
 - Add search bars - #172 by @dominik-zeglen
 - Add sorting to product list - #173 by @dominik-zeglen
 - Add Heroku integration - #175 by @bogdal
+- Fix navigation - #182 by @benekex2
+- Add testcafe tags to attributes, categories, collections and product types - #178 by @dominik-zeglen
+- Fix input error style - #183 by @benekex2
+- Fix staff return link - #190 by @dominik-zeglen
 - Allow sorting products by attribute - #180 by @dominik-zeglen

assets/images/logo-dark-small.svg

@@ -1,4 +1,4 @@
-<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M26.7216 5.23914L1.90735e-06 5.23914L5.27835 -4.00543e-05L32 -4.00543e-05L26.7216 5.23914Z" fill="#19C3BE"/>
 <path d="M15.3359 32.8964C21.9014 32.8964 23.5522 30.3032 23.5522 26.7507C23.5522 22.3812 19.5378 21.5641 16.1988 21.0313C13.6476 20.605 12.4846 20.3918 12.4846 18.8643C12.4846 17.7275 13.4975 17.3012 15.1483 17.3012C17.1742 17.3012 17.737 17.8696 17.9246 19.5392L23.2521 18.7577C22.8019 15.1697 20.7384 13.358 15.2984 13.358C9.33309 13.358 7.23211 15.7026 7.23211 19.4327C7.19459 24.264 11.8468 24.7613 15.2984 25.3297C17.4369 25.7205 18.2622 26.0757 18.2622 27.4612C18.2622 28.598 17.5494 29.0953 15.4109 29.0953C13.0473 29.0953 12.3345 28.7046 12.0343 26.8218L6.85693 27.5678C7.34466 31.3689 9.63322 32.8964 15.3359 32.8964Z" fill="white"/>
 </svg>

assets/images/logo-dark.svg

@@ -1,9 +1,9 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="95" height="32" viewBox="0 0 95 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M6.29798 0L0 6.36371H31.8841L38.1818 0H6.29798Z" fill="#13BEBB"/>
+<path d="M5.03838 0L0 5.09097H25.5072L30.5454 0H5.03838Z" fill="#13BEBB"/>
-<path d="M18.3033 39.9567C26.1372 39.9567 28.1071 36.8068 28.1071 32.4921C28.1071 27.1847 23.3171 26.1924 19.333 25.545C16.2888 25.0271 14.9011 24.7683 14.9011 22.913C14.9011 21.5323 16.1097 21.0144 18.0795 21.0144C20.4969 21.0144 21.1683 21.7049 21.3923 23.7328L27.749 22.7835C27.2115 18.4255 24.7495 16.2249 18.2585 16.2249C11.141 16.2249 8.63409 19.0727 8.63409 23.6033C8.58946 29.4717 14.1403 30.0756 18.2585 30.7658C20.81 31.2409 21.7952 31.6719 21.7952 33.3549C21.7952 34.7359 20.9447 35.34 18.3928 35.34C15.5726 35.34 14.7221 34.8653 14.364 32.5783L8.18652 33.4844C8.7684 38.1014 11.4991 39.9567 18.3033 39.9567Z" fill="white"/>
+<path d="M14.6423 31.9654C20.9094 31.9654 22.4853 29.4455 22.4853 25.9937C22.4853 21.7478 18.6533 20.9539 15.466 20.436C13.0307 20.0217 11.9205 19.8147 11.9205 18.3305C11.9205 17.2259 12.8873 16.8116 14.4632 16.8116C16.3972 16.8116 16.9342 17.3639 17.1134 18.9862L22.1988 18.2269C21.7688 14.7405 19.7992 12.9799 14.6064 12.9799C8.91239 12.9799 6.90688 15.2582 6.90688 18.8827C6.87118 23.5774 11.3118 24.0605 14.6064 24.6127C16.6476 24.9927 17.4358 25.3376 17.4358 26.684C17.4358 27.7887 16.7554 28.272 14.7138 28.272C12.4577 28.272 11.7773 27.8923 11.4908 26.0627L6.54883 26.7876C7.01433 30.4811 9.19886 31.9654 14.6423 31.9654Z" fill="white"/>
-<path d="M38.794 35.2108C35.7944 35.2108 34.7204 34.5635 34.7204 32.4061C34.7204 30.4644 35.7944 29.6877 39.0177 29.6877H42.2408V31.9315C42.2408 34.0889 41.1665 35.2108 38.794 35.2108ZM36.0184 39.9571C39.5101 39.9571 41.0771 38.8351 42.1962 37.1954V39.655H48.5078V24.0352C48.5078 18.8141 46.4933 16.1821 39.5101 16.1821C32.7505 16.1821 30.3782 18.0805 29.438 22.7406L35.7052 23.69C36.1079 21.7052 36.69 21.1009 39.2864 21.1009C41.7932 21.1009 42.1962 22.1365 42.1962 23.8626V25.4592H39.2415C31.2287 25.4592 28.4978 27.8755 28.4978 32.7943C28.4978 37.6269 30.9601 39.9571 36.0184 39.9571Z" fill="white"/>
+<path d="M31.0348 28.1685C28.6352 28.1685 27.7759 27.6506 27.7759 25.9248C27.7759 24.3714 28.6352 23.7501 31.2138 23.7501H33.7923V25.5451C33.7923 27.271 32.9328 28.1685 31.0348 28.1685ZM28.8144 31.9655C31.6077 31.9655 32.8613 31.068 33.7566 29.7562V31.7239H38.8058V19.228C38.8058 15.0512 37.1943 12.9456 31.6077 12.9456C26.2 12.9456 24.3022 14.4643 23.55 18.1924L28.5638 18.9519C28.8859 17.3641 29.3516 16.8806 31.4287 16.8806C33.4342 16.8806 33.7566 17.7091 33.7566 19.09V20.3672H31.3928C24.9826 20.3672 22.7979 22.3003 22.7979 26.2353C22.7979 30.1014 24.7677 31.9655 28.8144 31.9655Z" fill="white"/>
-<path d="M50.1196 39.6545H56.566V6.36353L50.1196 12.727V39.6545Z" fill="white"/>
+<path d="M40.0952 31.7237H45.2523V5.091L40.0952 10.1818V31.7237Z" fill="white"/>
-<path d="M64.4442 25.5879V24.4231C64.4442 22.3952 65.3844 21.0143 68.2046 21.0143C70.9352 21.0143 71.8308 22.1793 71.8308 24.4231V25.5879H64.4442ZM68.2046 39.9999C75.6357 39.9999 77.6054 36.548 78.0529 33.0961L71.9203 32.1899C71.6516 34.2609 71.2487 35.3398 68.2046 35.3398C65.116 35.3398 64.4442 33.8294 64.4442 31.8448V29.9462H78.0529V25.8038C78.0529 20.022 75.7698 16.1816 68.2046 16.1816C60.729 16.1816 58.1772 20.0651 58.1772 24.9841V31.1974C58.1772 35.9872 60.7736 39.9999 68.2046 39.9999Z" fill="white"/>
+<path d="M51.5551 20.4704V19.5386C51.5551 17.9163 52.3072 16.8115 54.5634 16.8115C56.7479 16.8115 57.4643 17.7436 57.4643 19.5386V20.4704H51.5551ZM54.5634 32C60.5083 32 62.084 29.2385 62.442 26.4769L57.5359 25.752C57.321 27.4088 56.9987 28.2719 54.5634 28.2719C52.0925 28.2719 51.5551 27.0636 51.5551 25.4759V23.957H62.442V20.6431C62.442 16.0177 60.6156 12.9454 54.5634 12.9454C48.5829 12.9454 46.5415 16.0521 46.5415 19.9874V24.958C46.5415 28.7898 48.6186 32 54.5634 32Z" fill="white"/>
-<path d="M90.0053 39.9999C97.3914 39.9999 100.435 36.2459 100.435 31.1974V24.9841C100.435 19.8494 97.3914 16.1816 90.0053 16.1816C82.6188 16.1816 79.6646 19.8494 79.6646 24.9841V31.1974C79.6646 36.2459 82.5742 39.9999 90.0053 39.9999ZM90.0053 34.9947C87.4088 34.9947 86.1107 33.6571 86.1107 31.4997V24.8548C86.1107 22.6542 87.4088 21.3165 90.0053 21.3165C92.6017 21.3165 93.9892 22.6542 93.9892 24.8548V31.4997C93.9892 33.6571 92.6017 34.9947 90.0053 34.9947Z" fill="white"/>
+<path d="M72.0036 32C77.9125 32 80.3476 28.9968 80.3476 24.958V19.9874C80.3476 15.8796 77.9125 12.9454 72.0036 12.9454C66.0943 12.9454 63.731 15.8796 63.731 19.9874V24.958C63.731 28.9968 66.0586 32 72.0036 32ZM72.0036 27.9958C69.9263 27.9958 68.8879 26.9257 68.8879 25.1998V19.884C68.8879 18.1234 69.9263 17.0533 72.0036 17.0533C74.0807 17.0533 75.1907 18.1234 75.1907 19.884V25.1998C75.1907 26.9257 74.0807 27.9958 72.0036 27.9958Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M111.948 22.767H108.493V39.5199H102.047V22.767L108.345 16.4033H118.246L111.948 22.767Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M89.5578 18.2135H86.7936V31.6158H81.6367V18.2135L86.6751 13.1226H94.5962L89.5578 18.2135Z" fill="white"/>
 </svg>

assets/images/menu-arrow-icon.svg

@@ -1,3 +1,3 @@
-<svg width="17" height="8" viewBox="0 0 17 8" xmlns="http://www.w3.org/2000/svg">
+<svg width="10" height="15" viewBox="0 0 10 15" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M13.2626 4.96719L-1.32568e-07 4.96719L-2.17123e-07 3.03281L13.2626 3.03281L11.5821 1.36782L12.9627 -5.66617e-07L17 4L12.9627 8L11.5821 6.63218L13.2626 4.96719Z" />
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.21084 7.23279L0 1.46559L1.3609 0L9.15006 7.23279L1.3609 14.4656L0 13L6.21084 7.23279Z" fill="#06847B"/>
 </svg>

assets/images/menu-catalog-icon.svg

@@ -1,3 +1,3 @@
-<svg width="126" height="126" viewBox="0 0 126 126" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M22.1484 88.5938V100.413L5.90625 116.656V5.90625H22.1484V19.6875H15.75V25.5938H22.1484V35.4375H15.75V41.3438H22.1484V51.1875H15.75V57.0938H22.1484V66.9375H15.75V72.8438H22.1484V82.6875H15.75V88.5938H22.1484ZM28.0547 0H0V126H125.754V98.6836H28.0547V0ZM26.3248 104.59L10.8209 120.094H119.848V104.59H107.789V110.988H101.883V104.59H92.0391V110.988H86.1328V104.59H76.2891V110.988H70.3828V104.59H60.5391V110.988H54.6328V104.59H44.7891V110.988H38.8828V104.59H26.3248ZM77.4305 8.20797L117.141 21.4779V74.8355L77.4306 88.7689L37.4062 74.8413V21.4723L77.4305 8.20797ZM43.3125 27.6624V70.6429L74.4735 81.4862V37.7312L43.3125 27.6624ZM80.3797 37.7257V81.4748L111.234 70.6486V27.6728L80.3797 37.7257ZM104.764 23.5692L77.4228 32.4772L49.854 23.5691L77.4227 14.4327L104.764 23.5692Z" fill="#3D3D3D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 0L32 5.74429V26.5168L16 32L0 26.5168V5.74429L16 0ZM11.0139 3.1253L24.6012 7.682L29.4131 6.15075L16 1.3352L11.0139 3.1253ZM30.7451 7.04569L16.6275 11.5382V30.4565L30.7451 25.6184V7.04569ZM15.3726 30.4565V11.5382L1.2549 7.04569V25.6184L15.3726 30.4565ZM2.58688 6.15075L16 10.4191L22.5732 8.32736L9.10504 3.81061L2.58688 6.15075Z" fill="#3D3D3D"/>
 </svg>

assets/images/menu-customers-icon.svg

@@ -1,3 +1,3 @@
-<svg width="126" height="126" viewBox="0 0 126 126" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M54.966 18.0156L60.1699 17.079L62.5078 12.6506L64.8458 17.079L70.0496 18.0156L66.2335 21.8424L67.0007 26.8435L62.5455 24.5459L57.9645 26.8428L58.8477 21.9081L54.966 18.0156ZM42.8203 14.2005L56.2907 11.776L62.5078 0L68.7249 11.776L82.1953 14.2005L72.5243 23.8984L74.5966 37.4062L62.5078 31.1719L50.0736 37.4062L52.4914 23.8984L42.8203 14.2005ZM19.0363 31.3047L24.2402 30.3681L26.5781 25.9397L28.9161 30.3681L34.12 31.3047L30.3038 35.1315L31.0711 40.1326L26.6158 37.835L22.0348 40.1319L22.918 35.1972L19.0363 31.3047ZM6.89062 27.4896L20.361 25.0651L26.5781 13.2891L32.7952 25.0651L46.2656 27.4896L36.5946 37.1875L38.6669 50.6953L26.5781 44.4609L14.1439 50.6953L16.5617 37.1875L6.89062 27.4896ZM15.7227 86.1328H36.4219L34.6279 92.0391H20.2071L10.8281 126H4.42969L15.7227 86.1328ZM110.277 86.1328H89.5781L91.372 92.0391H105.793L115.172 126H121.57L110.277 86.1328ZM94.623 30.3681L89.4191 31.3047L93.3008 35.1972L92.4176 40.1319L96.9986 37.835L101.454 40.1326L100.687 35.1315L104.503 31.3047L99.2989 30.3681L96.9609 25.9397L94.623 30.3681ZM90.7438 25.0651L77.2734 27.4896L86.9445 37.1875L84.5267 50.6953L96.9609 44.4609L109.05 50.6953L106.977 37.1875L116.648 27.4896L103.178 25.0651L96.9609 13.2891L90.7438 25.0651ZM31.0078 126H94.2539L84.1641 81.2109H41.3438L31.0078 126ZM38.4323 120.094H86.8691L79.4403 87.1172H46.0422L38.4323 120.094ZM71.3672 62.0156C71.3672 66.9085 67.4007 70.875 62.5078 70.875C57.6149 70.875 53.6484 66.9085 53.6484 62.0156C53.6484 57.1227 57.6149 53.1562 62.5078 53.1562C67.4007 53.1562 71.3672 57.1227 71.3672 62.0156ZM77.2734 62.0156C77.2734 70.1705 70.6626 76.7812 62.5078 76.7812C54.353 76.7812 47.7422 70.1705 47.7422 62.0156C47.7422 53.8608 54.353 47.25 62.5078 47.25C70.6626 47.25 77.2734 53.8608 77.2734 62.0156ZM96.9609 75.3047C101.854 75.3047 105.82 71.3382 105.82 66.4453C105.82 61.5524 101.854 57.5859 96.9609 57.5859C92.068 57.5859 88.1016 61.5524 88.1016 66.4453C88.1016 71.3382 92.068 75.3047 96.9609 75.3047ZM96.9609 81.2109C105.116 81.2109 111.727 74.6001 111.727 66.4453C111.727 58.2905 105.116 51.6797 96.9609 51.6797C88.8061 51.6797 82.1953 58.2905 82.1953 66.4453C82.1953 74.6001 88.8061 81.2109 96.9609 81.2109ZM36.9141 68.9062C36.9141 73.7991 32.9476 77.7656 28.0547 77.7656C23.1618 77.7656 19.1953 73.7991 19.1953 68.9062C19.1953 64.0134 23.1618 60.0469 28.0547 60.0469C32.9476 60.0469 36.9141 64.0134 36.9141 68.9062ZM42.8203 68.9062C42.8203 77.0611 36.2095 83.6719 28.0547 83.6719C19.8999 83.6719 13.2891 77.0611 13.2891 68.9062C13.2891 60.7514 19.8999 54.1406 28.0547 54.1406C36.2095 54.1406 42.8203 60.7514 42.8203 68.9062Z" fill="#3D3D3D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M23.5 9C23.5 13.1421 20.1421 16.5 16 16.5C11.8579 16.5 8.5 13.1421 8.5 9C8.5 4.85786 11.8579 1.5 16 1.5C20.1421 1.5 23.5 4.85786 23.5 9ZM25 9C25 13.9706 20.9706 18 16 18C11.0294 18 7 13.9706 7 9C7 4.02944 11.0294 0 16 0C20.9706 0 25 4.02944 25 9ZM1.60633 30.5C2.33418 25.4116 6.71029 21.5 12 21.5H20C25.2897 21.5 29.6658 25.4116 30.3937 30.5H1.60633ZM20 20C26.1194 20 31.169 24.5805 31.9072 30.5C31.9684 30.9914 32 31.492 32 32H0C0 31.492 0.031565 30.9914 0.0928406 30.5C0.830988 24.5805 5.88057 20 12 20H20Z" fill="#3D3D3D"/>
 </svg>

assets/images/menu-discounts-icon.svg

@@ -1,3 +1,3 @@
-<svg width="126" height="126" viewBox="0 0 126 126" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M0 70.6383L59.0625 126L126 51.9998V14.7656L110.742 0H72.8438L0 70.6383ZM12.8816 66.3739L8.55895 70.5657L58.7154 117.579L62.9906 112.853L12.8816 66.3739ZM66.953 108.473L17.1276 62.2565L75.2372 5.90625H108.352L120.094 17.269V49.7249L66.953 108.473ZM61.5234 89.5781V35.4375H67.4297V89.5781H61.5234ZM105.328 25.1016C105.328 28.0917 102.904 30.5156 99.9141 30.5156C96.924 30.5156 94.5 28.0917 94.5 25.1016C94.5 22.1115 96.924 19.6875 99.9141 19.6875C102.904 19.6875 105.328 22.1115 105.328 25.1016ZM111.234 25.1016C111.234 31.3536 106.166 36.4219 99.9141 36.4219C93.662 36.4219 88.5938 31.3536 88.5938 25.1016C88.5938 18.8495 93.662 13.7812 99.9141 13.7812C106.166 13.7812 111.234 18.8495 111.234 25.1016ZM80.9648 66.9375C83.2754 66.9375 85.1484 65.0644 85.1484 62.7539C85.1484 60.4434 83.2754 58.5703 80.9648 58.5703C78.6543 58.5703 76.7812 60.4434 76.7812 62.7539C76.7812 65.0644 78.6543 66.9375 80.9648 66.9375ZM80.9648 72.8438C86.5373 72.8438 91.0547 68.3264 91.0547 62.7539C91.0547 57.1814 86.5373 52.6641 80.9648 52.6641C75.3924 52.6641 70.875 57.1814 70.875 62.7539C70.875 68.3264 75.3924 72.8438 80.9648 72.8438ZM51.6797 62.7539C51.6797 65.0644 49.8066 66.9375 47.4961 66.9375C45.1856 66.9375 43.3125 65.0644 43.3125 62.7539C43.3125 60.4434 45.1856 58.5703 47.4961 58.5703C49.8066 58.5703 51.6797 60.4434 51.6797 62.7539ZM57.5859 62.7539C57.5859 68.3264 53.0686 72.8438 47.4961 72.8438C41.9236 72.8438 37.4062 68.3264 37.4062 62.7539C37.4062 57.1814 41.9236 52.6641 47.4961 52.6641C53.0686 52.6641 57.5859 57.1814 57.5859 62.7539Z" fill="#3D3D3D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15 32L0 17.9399L18.5 0H28.125L32 3.75V13.2063L15 32ZM2.1737 17.9214L3.27153 16.8569L15.9976 28.6611L14.9118 29.8614L2.1737 17.9214ZM4.34987 15.8112L17.0039 27.5486L30.5 12.6285V4.38577L27.518 1.5H19.1079L4.34987 15.8112ZM26.75 6.375C26.75 7.13439 26.1344 7.75 25.375 7.75C24.6156 7.75 24 7.13439 24 6.375C24 5.61561 24.6156 5 25.375 5C26.1344 5 26.75 5.61561 26.75 6.375ZM28.25 6.375C28.25 7.96282 26.9628 9.25 25.375 9.25C23.7872 9.25 22.5 7.96282 22.5 6.375C22.5 4.78718 23.7872 3.5 25.375 3.5C26.9628 3.5 28.25 4.78718 28.25 6.375Z" fill="#3D3D3D"/>
 </svg>

assets/images/menu-home-icon.svg

@@ -1,3 +1,3 @@
-<svg width="111" height="126" viewBox="0 0 111 126" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M104.219 5.90625H6.27344V28.5469H104.219V5.90625ZM6.27344 0H0.367188V5.90625V28.5469V34.4531H6.27344H104.219H110.125V28.5469V5.90625V0H104.219H6.27344ZM45.1562 47.7422H6.27344V120.094H45.1562V47.7422ZM6.27344 41.8359H0.367188V47.7422V120.094V126H6.27344H45.1562H51.0625V120.094V47.7422V41.8359H45.1562H6.27344ZM65.3359 47.7422H104.219V59.0625H65.3359V47.7422ZM59.4297 41.8359H65.3359H104.219H110.125V47.7422V59.0625V64.9688H104.219H65.3359H59.4297V59.0625V47.7422V41.8359ZM104.219 108.773H65.3359V120.094H104.219V108.773ZM65.3359 102.867H59.4297V108.773V120.094V126H65.3359H104.219H110.125V120.094V108.773V102.867H104.219H65.3359ZM65.3359 78.2578H104.219V89.5781H65.3359V78.2578ZM59.4297 72.3516H65.3359H104.219H110.125V78.2578V89.5781V95.4844H104.219H65.3359H59.4297V89.5781V78.2578V72.3516Z" fill="#3D3D3D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M27.8049 0H4.19513L0 8.9457V9.11158C0 12.3944 1.44708 14.6199 3.375 15.6208V32H28.75V15.6154C30.617 14.5943 32 12.3699 32 9.11158V8.9457L27.8049 0ZM4.875 30.5058V16.1355C5.14409 16.1849 5.41713 16.2136 5.69211 16.2214C7.14186 16.2621 8.59031 15.705 9.6709 14.5647C10.0776 14.1355 10.4264 13.6302 10.7034 13.0527C11.0076 13.6455 11.3916 14.1633 11.8384 14.6023C13.002 15.7461 14.5468 16.3113 16.0801 16.3113C17.6133 16.3113 19.1581 15.7461 20.3217 14.6023C20.7652 14.1665 21.1469 13.6531 21.45 13.0657C21.7212 13.6389 22.0617 14.1415 22.4584 14.5697C23.5212 15.7169 24.95 16.2864 26.3852 16.2513C26.6768 16.2442 26.9658 16.2128 27.25 16.1575V30.5058H21.625V18.179H10.5V30.5058H4.875ZM12 30.5058H20.125V19.6731H12V30.5058ZM9.92301 9.83658H1.52765C1.78923 13.1794 3.86009 14.6752 5.73439 14.7278C6.76627 14.7568 7.79945 14.3629 8.58008 13.5391C9.3228 12.7553 9.87435 11.5402 9.92301 9.83658ZM1.9385 8.34241L5.15002 1.49416H26.85L30.0615 8.34241H1.9385ZM30.4734 9.83658H22.237C22.2849 11.544 22.8289 12.7664 23.5608 13.5564C24.3292 14.3858 25.342 14.7822 26.3484 14.7576C28.1717 14.713 30.2183 13.2302 30.4734 9.83658ZM20.7298 9.83658H11.4303C11.4832 11.5221 12.0764 12.7372 12.8919 13.5387C13.7545 14.3866 14.9116 14.8171 16.0801 14.8171C17.2485 14.8171 18.4056 14.3866 19.2682 13.5387C20.0837 12.7372 20.6769 11.5221 20.7298 9.83658Z" fill="#3D3D3D"/>
 </svg>

assets/images/menu-orders-icon.svg

@@ -1,3 +1,3 @@
-<svg width="126" height="126" viewBox="0 0 126 126" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M105.328 0.492188H16.7344V125.508H105.328V107.789H99.4219V119.602H22.6406V6.39844H99.4219V68.9062H105.328V0.492188ZM91.3008 102.86L125.135 69.0257L120.959 64.8493L91.3008 94.5072L79.8538 83.0602L75.6774 87.2366L91.3008 102.86ZM32.4844 54.6328H38.3906V60.5391H32.4844V54.6328ZM89.5781 54.6328H45.2812V60.5391H89.5781V54.6328ZM32.4844 42.8203H38.3906V48.7266H32.4844V42.8203ZM89.5781 42.8203H45.2812V48.7266H89.5781V42.8203ZM32.4844 31.0078H38.3906V36.9141H32.4844V31.0078ZM89.5781 31.0078H45.2812V36.9141H89.5781V31.0078ZM32.4844 19.1953H38.3906V25.1016H32.4844V19.1953ZM89.5781 19.1953H45.2812V25.1016H89.5781V19.1953Z" fill="#3D3D3D"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5.712 3.5H0V2H6.913L7.78154 5.875H32L28.0625 21.375H10.3559H9.5625H9.23912L8.44877 23H28V24.5H6.05121L8.30067 19.875H9.24194L6.36634 6.4194L5.712 3.5ZM10.3125 28.75C10.9683 28.75 11.5 28.2183 11.5 27.5625C11.5 26.9067 10.9683 26.375 10.3125 26.375C9.65666 26.375 9.125 26.9067 9.125 27.5625C9.125 28.2183 9.65666 28.75 10.3125 28.75ZM10.3125 30.25C11.7968 30.25 13 29.0468 13 27.5625C13 26.0782 11.7968 24.875 10.3125 24.875C8.82823 24.875 7.625 26.0782 7.625 27.5625C7.625 29.0468 8.82823 30.25 10.3125 30.25ZM26 27.5625C26 28.2183 25.4683 28.75 24.8125 28.75C24.1567 28.75 23.625 28.2183 23.625 27.5625C23.625 26.9067 24.1567 26.375 24.8125 26.375C25.4683 26.375 26 26.9067 26 27.5625ZM27.5 27.5625C27.5 29.0468 26.2968 30.25 24.8125 30.25C23.3282 30.25 22.125 29.0468 22.125 27.5625C22.125 26.0782 23.3282 24.875 24.8125 24.875C26.2968 24.875 27.5 26.0782 27.5 27.5625ZM30.0713 7.375L26.8959 19.875H10.7758L8.10444 7.375H30.0713Z" fill="#3D3D3D"/>
 </svg>

src/attributes/components/AttributeList/AttributeList.tsx

@@ -13,7 +13,7 @@ import Skeleton from "@saleor/components/Skeleton";
 import TableHead from "@saleor/components/TableHead";
 import TablePagination from "@saleor/components/TablePagination";
 import { translateBoolean } from "@saleor/intl";
-import { renderCollection } from "@saleor/misc";
+import { maybe, renderCollection } from "@saleor/misc";
 import { ListActions, ListProps } from "@saleor/types";
 import { AttributeList_attributes_edges_node } from "../../types/AttributeList";
 
@@ -139,6 +139,11 @@ const AttributeList: React.StatelessComponent<AttributeListProps> = ({
                 key={attribute ? attribute.id : "skeleton"}
                 onClick={attribute && onRowClick(attribute.id)}
                 className={classes.link}
+                data-tc="id"
+                data-tc-id={maybe(() => attribute.id)}
+                data-tc-values={JSON.stringify(
+                  maybe(() => attribute.values, [])
+                )}
               >
                 <TableCell padding="checkbox">
                   <Checkbox
@@ -148,27 +153,43 @@ const AttributeList: React.StatelessComponent<AttributeListProps> = ({
                     onChange={() => toggle(attribute.id)}
                   />
                 </TableCell>
-                <TableCell className={classes.colSlug}>
+                <TableCell className={classes.colSlug} data-tc="slug">
                   {attribute ? attribute.slug : <Skeleton />}
                 </TableCell>
-                <TableCell className={classes.colName}>
+                <TableCell className={classes.colName} data-tc="name">
                   {attribute ? attribute.name : <Skeleton />}
                 </TableCell>
-                <TableCell className={classes.colVisible}>
+                <TableCell
+                  className={classes.colVisible}
+                  data-tc="visible"
+                  data-tc-visible={maybe(() => attribute.visibleInStorefront)}
+                >
                   {attribute ? (
                     translateBoolean(attribute.visibleInStorefront, intl)
                   ) : (
                     <Skeleton />
                   )}
                 </TableCell>
-                <TableCell className={classes.colSearchable}>
+                <TableCell
+                  className={classes.colSearchable}
+                  data-tc="searchable"
+                  data-tc-searchable={maybe(
+                    () => attribute.filterableInDashboard
+                  )}
+                >
                   {attribute ? (
                     translateBoolean(attribute.filterableInDashboard, intl)
                   ) : (
                     <Skeleton />
                   )}
                 </TableCell>
-                <TableCell className={classes.colFaceted}>
+                <TableCell
+                  className={classes.colFaceted}
+                  data-tc="use-in-faceted-search"
+                  data-tc-use-in-faceted-search={maybe(
+                    () => attribute.filterableInStorefront
+                  )}
+                >
                   {attribute ? (
                     translateBoolean(attribute.filterableInStorefront, intl)
                   ) : (

src/attributes/queries.ts

@@ -72,6 +72,11 @@ const attributeList = gql`
       edges {
         node {
           ...AttributeFragment
+          values {
+            id
+            name
+            slug
+          }
         }
       }
       pageInfo {

src/attributes/types/AttributeList.ts

@@ -8,6 +8,13 @@ import { AttributeFilterInput } from "./../../types/globalTypes";
 // GraphQL query operation: AttributeList
 // ====================================================
 
+export interface AttributeList_attributes_edges_node_values {
+  __typename: "AttributeValue";
+  id: string;
+  name: string | null;
+  slug: string | null;
+}
+
 export interface AttributeList_attributes_edges_node {
   __typename: "Attribute";
   id: string;
@@ -16,6 +23,7 @@ export interface AttributeList_attributes_edges_node {
   visibleInStorefront: boolean;
   filterableInDashboard: boolean;
   filterableInStorefront: boolean;
+  values: (AttributeList_attributes_edges_node_values | null)[] | null;
 }
 
 export interface AttributeList_attributes_edges {

src/categories/components/CategoryList/CategoryList.tsx

@@ -17,7 +17,7 @@ import Checkbox from "@saleor/components/Checkbox";
 import Skeleton from "@saleor/components/Skeleton";
 import TableHead from "@saleor/components/TableHead";
 import TablePagination from "@saleor/components/TablePagination";
-import { renderCollection } from "@saleor/misc";
+import { maybe, renderCollection } from "@saleor/misc";
 import { ListActions, ListProps } from "@saleor/types";
 
 const styles = (theme: Theme) =>
@@ -126,6 +126,8 @@ const CategoryList = withStyles(styles, { name: "CategoryList" })(
                 onClick={category ? onRowClick(category.id) : undefined}
                 key={category ? category.id : "skeleton"}
                 selected={isSelected}
+                data-tc="id"
+                data-tc-id={maybe(() => category.id)}
               >
                 <TableCell padding="checkbox">
                   <Checkbox
@@ -135,7 +137,7 @@ const CategoryList = withStyles(styles, { name: "CategoryList" })(
                     onChange={() => toggle(category.id)}
                   />
                 </TableCell>
-                <TableCell className={classes.colName}>
+                <TableCell className={classes.colName} data-tc="name">
                   {category && category.name ? category.name : <Skeleton />}
                 </TableCell>
                 <TableCell className={classes.colSubcategories}>

src/collections/components/CollectionList/CollectionList.tsx

@@ -122,6 +122,8 @@ const CollectionList = withStyles(styles, { name: "CollectionList" })(
                   onClick={collection ? onRowClick(collection.id) : undefined}
                   key={collection ? collection.id : "skeleton"}
                   selected={isSelected}
+                  data-tc="id"
+                  data-tc-id={maybe(() => collection.id)}
                 >
                   <TableCell padding="checkbox">
                     <Checkbox
@@ -131,7 +133,7 @@ const CollectionList = withStyles(styles, { name: "CollectionList" })(
                       onChange={() => toggle(collection.id)}
                     />
                   </TableCell>
-                  <TableCell className={classes.colName}>
+                  <TableCell className={classes.colName} data-tc="name">
                     {maybe<React.ReactNode>(
                       () => collection.name,
                       <Skeleton />
@@ -143,7 +145,11 @@ const CollectionList = withStyles(styles, { name: "CollectionList" })(
                       <Skeleton />
                     )}
                   </TableCell>
-                  <TableCell className={classes.colAvailability}>
+                  <TableCell
+                    className={classes.colAvailability}
+                    data-tc="published"
+                    data-tc-published={maybe(() => collection.isPublished)}
+                  >
                     {maybe(
                       () => (
                         <StatusLabel

src/components/AppLayout/AppLayout.tsx

@@ -88,7 +88,7 @@ const styles = (theme: Theme) =>
         margin: "0 8px"
       },
       "& svg": {
-        marginTop: 12,
+        marginTop: 8,
         transform: "rotate(180deg)"
       },
       "&:hover": {
@@ -115,17 +115,21 @@ const styles = (theme: Theme) =>
     },
     isMenuSmallHide: {
       "& svg": {
+        marginLeft: "3px",
         transform: "rotate(0deg)"
       }
     },
     logo: {
       "& svg": {
-        padding: "20px 50px",
+        left: "50%",
-        width: "256px"
+        position: "absolute",
+        top: "50%",
+        transform: "translate(-50%,-50%)"
       },
       background: theme.palette.secondary.main,
       display: "block",
-      height: 80
+      height: 80,
+      position: "relative"
     },
     logoDark: {
       "& path": {
@@ -135,7 +139,7 @@ const styles = (theme: Theme) =>
     },
     logoSmall: {
       "& svg": {
-        margin: "20px 0",
+        margin: 0,
         padding: 0,
         width: "80px"
       }
@@ -143,7 +147,7 @@ const styles = (theme: Theme) =>
     menu: {
       background: theme.palette.background.paper,
       height: "100vh",
-      padding: 25
+      padding: "25px 20px"
     },
     menuIcon: {
       "& span": {

src/components/AppLayout/MenuList.tsx

@@ -40,14 +40,24 @@ const styles = (theme: Theme) =>
         fill: theme.palette.common.white
       }
     },
+    menuIconSmall: {
+      left: -5
+    },
     menuIsActive: {
       boxShadow: "0px 0px 12px 1px rgba(0,0,0,0.2)"
     },
     menuItemHover: {
+      "& p": {
+        fontSize: 14,
+        transition: "color 0.5s ease, opacity 0.3s ease-out"
+      },
       "& path": {
         transition: "fill 0.5s ease"
       },
       "&:hover": {
+        "& p": {
+          color: theme.palette.primary.main
+        },
         "& path": {
           fill: theme.palette.primary.main
         },
@@ -55,7 +65,7 @@ const styles = (theme: Theme) =>
           borderLeft: `solid 2px ${theme.palette.primary.main}`,
           content: "''",
           height: 33,
-          left: -25,
+          left: -20,
           position: "absolute",
           top: 8
         },
@@ -101,25 +111,36 @@ const styles = (theme: Theme) =>
         top: 15,
         width: 0
       },
+      "&:before": {
+        borderLeft: `solid 2px ${theme.palette.primary.main}`,
+        content: "''",
+        height: 33,
+        left: -20,
+        position: "absolute",
+        top: 8
+      },
       position: "relative"
     },
     menuListItemText: {
       "&:hover": {
         color: theme.palette.primary.main
       },
+      bottom: 0,
       cursor: "pointer",
-      display: "inline-block",
       fontSize: "1rem",
       fontWeight: 500,
+      left: 30,
       opacity: 1,
       paddingLeft: 16,
+      position: "absolute",
       textTransform: "uppercase",
-      transition: `opacity  ${theme.transitions.duration.shorter}ms ease 0.1s`
+      transition: "opacity 0.5s ease"
     },
     menuListItemTextHide: {
+      bottom: 0,
+      left: 30,
       opacity: 0,
-      position: "absolute",
+      position: "absolute"
-      transition: `opacity  ${theme.transitions.duration.shorter}ms ease`
     },
     subMenu: {
       padding: "0 15px"
@@ -249,7 +270,8 @@ const MenuList = withStyles(styles, { name: "MenuList" })(
                 >
                   <SVG
                     className={classNames(classes.menuIcon, {
-                      [classes.menuIconDark]: isDark
+                      [classes.menuIconDark]: isDark,
+                      [classes.menuIconSmall]: !isMenuSmall
                     })}
                     src={menuItem.icon}
                   />
@@ -294,7 +316,8 @@ const MenuList = withStyles(styles, { name: "MenuList" })(
               <div className={classes.menuItemHover}>
                 <SVG
                   className={classNames(classes.menuIcon, {
-                    [classes.menuIconDark]: isDark
+                    [classes.menuIconDark]: isDark,
+                    [classes.menuIconSmall]: !isMenuSmall
                   })}
                   src={menuItem.icon}
                 />
@@ -319,7 +342,8 @@ const MenuList = withStyles(styles, { name: "MenuList" })(
             <div className={classes.menuItemHover}>
               <SVG
                 className={classNames(classes.menuIcon, {
-                  [classes.menuIconDark]: isDark
+                  [classes.menuIconDark]: isDark,
+                  [classes.menuIconSmall]: !isMenuSmall
                 })}
                 src={configureIcon}
               />

src/components/AppLayout/ResponsiveDrawer.tsx

@@ -18,7 +18,7 @@ const styles = (theme: Theme) =>
       overflow: "visible",
       padding: 0,
       position: "fixed" as "fixed",
-      transition: "width 0.2s ease",
+      transition: "width 0.3s ease",
       width: drawerWidthExpanded
     },
     drawerDesktopSmall: {