mirror of
https://github.com/logto-io/logto.git
synced 2024-12-16 20:26:19 -05:00
feat(console): update the application darkmode icon (#5329)
update the application darkmode icon
This commit is contained in:
simeng-li
GitHub
parent
e2d8ce542a
commit
1b0602708a
11 changed files with 166 additions and 112 deletions
|
|
@ -1,36 +1,37 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#3A3B59"/>
|
||||
<path d="M17 6C17 4.89543 17.8954 4 19 4H33C34.1046 4 35 4.89543 35 6V16C35 17.1046 34.1046 18 33 18H19C17.8954 18 17 17.1046 17 16V6Z" fill="url(#paint0_linear_1091_20373)"/>
|
||||
<rect x="17" y="8" width="18" height="1" fill="#D361E7"/>
|
||||
<rect x="27" y="6" width="6" height="1" rx="0.5" fill="#B545CA"/>
|
||||
<rect x="19" y="6" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="27" y="11" width="6" height="1" rx="0.5" fill="#B545CA"/>
|
||||
<rect x="19" y="11" width="1" height="1" rx="0.5" fill="#7958FF"/>
|
||||
<rect x="21" y="11" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="27" y="16" width="6" height="1" rx="0.5" fill="#B545CA"/>
|
||||
<rect x="19" y="16" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="21" y="16" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="17" y="13" width="18" height="1" fill="#D361E7"/>
|
||||
<path d="M5 24C5 22.8954 5.89543 22 7 22H21C22.1046 22 23 22.8954 23 24V34C23 35.1046 22.1046 36 21 36H7C5.89543 36 5 35.1046 5 34V24Z" fill="url(#paint1_linear_1091_20373)"/>
|
||||
<rect x="5" y="26" width="18" height="1" fill="#947DFF"/>
|
||||
<rect x="15" y="24" width="6" height="1" rx="0.5" fill="#7958FF"/>
|
||||
<rect x="7" y="24" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="15" y="29" width="6" height="1" rx="0.5" fill="#7958FF"/>
|
||||
<rect x="7" y="29" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="9" y="29" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="15" y="34" width="6" height="1" rx="0.5" fill="#7958FF"/>
|
||||
<rect x="7" y="34" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="9" y="34" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="5" y="31" width="18" height="1" fill="#947DFF"/>
|
||||
<path opacity="0.4" d="M20 27C24.4183 27 28 23.4183 28 19M12 20C12 15.5817 15.5817 12 20 12" stroke="#C9C5D0" stroke-width="2"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20373" x1="12.5" y1="13.3333" x2="36.4143" y2="9.97917" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#E4A3FB"/>
|
||||
<stop offset="1" stop-color="#EC78FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_1091_20373" x1="3.52143" y1="30.0208" x2="21.3627" y2="21.5511" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="40" height="41" viewBox="0 0 40 41" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.5" width="40" height="40" rx="8" fill="#F7F8F8" fill-opacity="0.12"/>
|
||||
<path d="M17 6.5C17 5.39543 17.8954 4.5 19 4.5H33C34.1046 4.5 35 5.39543 35 6.5V16.5C35 17.6046 34.1046 18.5 33 18.5H19C17.8954 18.5 17 17.6046 17 16.5V6.5Z" fill="url(#paint0_linear_4270_17368)"/>
|
||||
<rect x="17" y="8.5" width="18" height="1" fill="#D361E7"/>
|
||||
<path d="M27 7C27 6.72386 27.2239 6.5 27.5 6.5H32.5C32.7761 6.5 33 6.72386 33 7C33 7.27614 32.7761 7.5 32.5 7.5H27.5C27.2239 7.5 27 7.27614 27 7Z" fill="#B545CA"/>
|
||||
<rect x="19" y="6.5" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<path d="M27 12C27 11.7239 27.2239 11.5 27.5 11.5H32.5C32.7761 11.5 33 11.7239 33 12C33 12.2761 32.7761 12.5 32.5 12.5H27.5C27.2239 12.5 27 12.2761 27 12Z" fill="#B545CA"/>
|
||||
<rect x="19" y="11.5" width="1" height="1" rx="0.5" fill="#7958FF"/>
|
||||
<rect x="21" y="11.5" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<path d="M27 17C27 16.7239 27.2239 16.5 27.5 16.5H32.5C32.7761 16.5 33 16.7239 33 17C33 17.2761 32.7761 17.5 32.5 17.5H27.5C27.2239 17.5 27 17.2761 27 17Z" fill="#B545CA"/>
|
||||
<rect x="19" y="16.5" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="21" y="16.5" width="1" height="1" rx="0.5" fill="#F4E560"/>
|
||||
<rect x="17" y="13.5" width="18" height="1" fill="#D361E7"/>
|
||||
<path d="M5 24.5C5 23.3954 5.89543 22.5 7 22.5H21C22.1046 22.5 23 23.3954 23 24.5V34.5C23 35.6046 22.1046 36.5 21 36.5H7C5.89543 36.5 5 35.6046 5 34.5V24.5Z" fill="url(#paint1_linear_4270_17368)"/>
|
||||
<rect x="5" y="26.5" width="18" height="1" fill="#947DFF"/>
|
||||
<path d="M15 25C15 24.7239 15.2239 24.5 15.5 24.5H20.5C20.7761 24.5 21 24.7239 21 25C21 25.2761 20.7761 25.5 20.5 25.5H15.5C15.2239 25.5 15 25.2761 15 25Z" fill="#7958FF"/>
|
||||
<rect x="7" y="24.5" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<path d="M15 30C15 29.7239 15.2239 29.5 15.5 29.5H20.5C20.7761 29.5 21 29.7239 21 30C21 30.2761 20.7761 30.5 20.5 30.5H15.5C15.2239 30.5 15 30.2761 15 30Z" fill="#7958FF"/>
|
||||
<rect x="7" y="29.5" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="9" y="29.5" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<path d="M15 35C15 34.7239 15.2239 34.5 15.5 34.5H20.5C20.7761 34.5 21 34.7239 21 35C21 35.2761 20.7761 35.5 20.5 35.5H15.5C15.2239 35.5 15 35.2761 15 35Z" fill="#7958FF"/>
|
||||
<rect x="7" y="34.5" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="9" y="34.5" width="1" height="1" rx="0.5" fill="#FFEAFE"/>
|
||||
<rect x="5" y="31.5" width="18" height="1" fill="#947DFF"/>
|
||||
<path opacity="0.4" d="M20 27.5C24.4183 27.5 28 23.9183 28 19.5M12 20.5C12 16.0817 15.5817 12.5 20 12.5" stroke="#C9C5D0" stroke-width="2"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4270_17368" x1="12.5" y1="13.8333" x2="36.4143" y2="10.4792" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#E4A3FB"/>
|
||||
<stop offset="1" stop-color="#EC78FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_4270_17368" x1="3.52143" y1="30.5208" x2="21.3627" y2="22.0511" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 3.1 KiB |
|
|
@ -1,16 +1,17 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#3A3B59"/>
|
||||
<rect x="12" y="5" width="16" height="30" rx="4" fill="url(#paint0_linear_1091_20297)"/>
|
||||
<circle cx="20" cy="31" r="1.5" stroke="#D3BCF3"/>
|
||||
<path d="M16 5H24V7C24 7.55228 23.5523 8 23 8H17C16.4477 8 16 7.55228 16 7V5Z" fill="#5938A3"/>
|
||||
<path opacity="0.6" d="M28.3509 4C28.6075 3.55555 29.249 3.55556 29.5056 4L35.2791 14C35.5357 14.4444 35.2149 15 34.7017 15H23.1547C22.6415 15 22.3208 14.4444 22.5774 14L28.3509 4Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="26" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20297" x1="10.6857" y1="22.1875" x2="29.3932" y2="18.5036" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#614DDD"/>
|
||||
<stop offset="1" stop-color="#D47AFE"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="40" height="41" viewBox="0 0 40 41" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.5" width="40" height="40" rx="8" fill="#F7F8F8" fill-opacity="0.12"/>
|
||||
<path d="M12 9.5C12 7.29086 13.7909 5.5 16 5.5H24C26.2091 5.5 28 7.29086 28 9.5V31.5C28 33.7091 26.2091 35.5 24 35.5H16C13.7909 35.5 12 33.7091 12 31.5V9.5Z" fill="url(#paint0_linear_4270_17365)"/>
|
||||
<circle cx="20" cy="31.5" r="1.5" stroke="#D3BCF3"/>
|
||||
<path d="M16 6.5C16 5.94772 16.4477 5.5 17 5.5H23C23.5523 5.5 24 5.94772 24 6.5V7.5C24 8.05228 23.5523 8.5 23 8.5H17C16.4477 8.5 16 8.05228 16 7.5V6.5Z" fill="#5938A3"/>
|
||||
<path opacity="0.6" d="M28.3509 4.50032C28.6075 4.05588 29.249 4.05588 29.5056 4.50033L35.2791 14.5003C35.5357 14.9448 35.2149 15.5003 34.7017 15.5003H23.1547C22.6415 15.5003 22.3208 14.9448 22.5774 14.5003L28.3509 4.50032Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="26.5" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4270_17365" x1="10.6857" y1="22.6875" x2="29.3932" y2="19.0036" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#614DDD"/>
|
||||
<stop offset="1" stop-color="#D47AFE"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 911 B After Width: | Height: | Size: 1.2 KiB |
|
|
@ -1,26 +1,27 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#3A3B59"/>
|
||||
<path d="M28.5 12C28.5 14.1483 28.0635 16.0686 27.3812 17.4332C26.6839 18.8278 25.8132 19.5 25 19.5C24.1868 19.5 23.3161 18.8278 22.6188 17.4332C21.9365 16.0686 21.5 14.1483 21.5 12C21.5 9.85165 21.9365 7.93141 22.6188 6.56675C23.3161 5.17219 24.1868 4.5 25 4.5C25.8132 4.5 26.6839 5.17219 27.3812 6.56675C28.0635 7.93141 28.5 9.85165 28.5 12Z" stroke="#9D85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<path d="M26.75 8.96892C28.6105 10.0431 30.0553 11.3812 30.8959 12.6544C31.755 13.9556 31.9017 15.0458 31.4952 15.75C31.0886 16.4542 30.0711 16.8722 28.5147 16.7788C26.9917 16.6874 25.1105 16.1053 23.25 15.0311C21.3895 13.9569 19.9447 12.6188 19.104 11.3456C18.245 10.0444 18.0982 8.95422 18.5048 8.25001C18.9114 7.5458 19.9289 7.12778 21.4853 7.22119C23.0082 7.31261 24.8895 7.89475 26.75 8.96892Z" stroke="#9D85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<path d="M23.25 8.96892C21.3895 10.0431 19.9447 11.3812 19.1041 12.6544C18.245 13.9556 18.0983 15.0458 18.5048 15.75C18.9114 16.4542 19.9289 16.8722 21.4853 16.7788C23.0083 16.6874 24.8895 16.1053 26.75 15.0311C28.6105 13.9569 30.0553 12.6188 30.896 11.3456C31.755 10.0444 31.9018 8.95422 31.4952 8.25001C31.0886 7.5458 30.0711 7.12778 28.5147 7.22119C26.9918 7.31261 25.1105 7.89475 23.25 8.96892Z" stroke="#9C85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<circle cx="25" cy="12" r="1" fill="#FAABFF"/>
|
||||
<path d="M4.77773 17.7408L9.68377 16.1054C9.88904 16.037 10.111 16.037 10.3162 16.1054L15.2223 17.7408C15.6745 17.8915 15.9574 18.3405 15.8983 18.8135L15.0732 25.4146C15.028 25.7758 14.7902 26.0839 14.4523 26.2191L10.3714 27.8514C10.133 27.9468 9.86702 27.9468 9.62861 27.8514L5.54772 26.2191C5.20978 26.0839 4.97198 25.7758 4.92683 25.4146L4.10168 18.8135C4.04256 18.3405 4.32551 17.8915 4.77773 17.7408Z" fill="url(#paint0_linear_1091_20314)"/>
|
||||
<path d="M11.5817 25H13L10.782 19H9.21355L7 25H8.36966L8.85567 23.5447H11.0957L11.5817 25ZM9.96024 20.1476H9.99116L10.8085 22.605H9.14286L9.96024 20.1476Z" fill="#F5EEFF"/>
|
||||
<path d="M18.4952 22.7704L26.5794 35.3457C26.7762 35.6519 27.2238 35.6519 27.4206 35.3457L35.5048 22.7704C35.7187 22.4376 35.4797 22 35.0842 22H29.2676C29.1004 22 28.9443 22.0836 28.8516 22.2226L27 25L25.1484 22.2226C25.0557 22.0836 24.8996 22 24.7324 22H18.9158C18.5202 22 18.2813 22.4376 18.4952 22.7704Z" fill="url(#paint1_linear_1091_20314)"/>
|
||||
<mask id="mask0_1091_20314" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="18" y="22" width="18" height="14">
|
||||
<path opacity="0.7" d="M18.4952 22.7704L26.5794 35.3457C26.7762 35.6519 27.2238 35.6519 27.4206 35.3457L35.5048 22.7704C35.7187 22.4376 35.4797 22 35.0842 22H29.2676C29.1004 22 28.9443 22.0836 28.8516 22.2226L27 25L25.1484 22.2226C25.0557 22.0836 24.8996 22 24.7324 22H18.9158C18.5202 22 18.2813 22.4376 18.4952 22.7704Z" fill="#7958FF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1091_20314)">
|
||||
<path d="M22 22L26.576 29.3216C26.7718 29.6349 27.2282 29.6349 27.424 29.3216L32 22H22Z" fill="#4300DA"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20314" x1="1" y1="24" x2="16.9429" y2="21.125" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFF06A"/>
|
||||
<stop offset="1" stop-color="#EC78FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_1091_20314" x1="16.5214" y1="30.0208" x2="34.3627" y2="21.5511" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="40" height="41" viewBox="0 0 40 41" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.5" width="40" height="40" rx="8" fill="#F7F8F8" fill-opacity="0.12"/>
|
||||
<path d="M28.5 12.5C28.5 14.6483 28.0635 16.5686 27.3812 17.9332C26.6839 19.3278 25.8132 20 25 20C24.1868 20 23.3161 19.3278 22.6188 17.9332C21.9365 16.5686 21.5 14.6483 21.5 12.5C21.5 10.3517 21.9365 8.43141 22.6188 7.06675C23.3161 5.67219 24.1868 5 25 5C25.8132 5 26.6839 5.67219 27.3812 7.06675C28.0635 8.43141 28.5 10.3517 28.5 12.5Z" stroke="#9D85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<path d="M26.7505 9.46868C28.611 10.5429 30.0557 11.881 30.8964 13.1542C31.7555 14.4553 31.9022 15.5456 31.4957 16.2498C31.0891 16.954 30.0716 17.372 28.5152 17.2786C26.9922 17.1872 25.111 16.605 23.2505 15.5309C21.3899 14.4567 19.9452 13.1186 19.1045 11.8453C18.2454 10.5442 18.0987 9.45398 18.5053 8.74977C18.9119 8.04555 19.9294 7.62753 21.4857 7.72095C23.0087 7.81237 24.8899 8.3945 26.7505 9.46868Z" stroke="#9D85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<path d="M23.2515 9.46868C21.391 10.5429 19.9462 11.881 19.1055 13.1542C18.2465 14.4553 18.0997 15.5456 18.5063 16.2498C18.9129 16.954 19.9304 17.372 21.4868 17.2786C23.0098 17.1872 24.891 16.605 26.7515 15.5309C28.612 14.4567 30.0568 13.1186 30.8974 11.8453C31.7565 10.5442 31.9033 9.45398 31.4967 8.74977C31.0901 8.04555 30.0726 7.62753 28.5162 7.72095C26.9932 7.81237 25.112 8.3945 23.2515 9.46868Z" stroke="#9C85FD" stroke-miterlimit="16" stroke-linecap="round"/>
|
||||
<circle cx="25" cy="12.5" r="1" fill="#FAABFF"/>
|
||||
<path d="M4.77782 18.2404L9.68386 16.605C9.88913 16.5366 10.1111 16.5366 10.3163 16.605L15.2224 18.2404C15.6746 18.3911 15.9575 18.8401 15.8984 19.3131L15.0733 25.9143C15.0281 26.2754 14.7903 26.5835 14.4524 26.7187L10.3715 28.3511C10.1331 28.4464 9.86711 28.4464 9.6287 28.3511L5.54781 26.7187C5.20987 26.5835 4.97207 26.2754 4.92692 25.9143L4.10177 19.3131C4.04265 18.8401 4.3256 18.3911 4.77782 18.2404Z" fill="url(#paint0_linear_4270_17366)"/>
|
||||
<path d="M11.5817 25.5H13L10.782 19.5H9.21355L7 25.5H8.36966L8.85567 24.0447H11.0957L11.5817 25.5ZM9.96024 20.6476H9.99116L10.8085 23.105H9.14286L9.96024 20.6476Z" fill="#F5EEFF"/>
|
||||
<path d="M18.4953 23.2704L26.5794 35.8457C26.7763 36.1519 27.2238 36.1519 27.4206 35.8457L35.5048 23.2704C35.7187 22.9376 35.4798 22.5 35.0842 22.5H29.2676C29.1004 22.5 28.9443 22.5836 28.8516 22.7226L27.416 24.876C27.2181 25.1728 26.7819 25.1728 26.584 24.876L25.1485 22.7226C25.0557 22.5836 24.8996 22.5 24.7324 22.5H18.9159C18.5203 22.5 18.2814 22.9376 18.4953 23.2704Z" fill="url(#paint1_linear_4270_17366)"/>
|
||||
<mask id="mask0_4270_17366" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="18" y="22" width="18" height="15">
|
||||
<path opacity="0.7" d="M18.4952 23.2704L26.5794 35.8457C26.7762 36.1519 27.2238 36.1519 27.4206 35.8457L35.5048 23.2704C35.7187 22.9376 35.4797 22.5 35.0842 22.5H29.2676C29.1004 22.5 28.9443 22.5836 28.8516 22.7226L27 25.5L25.1484 22.7226C25.0557 22.5836 24.8996 22.5 24.7324 22.5H18.9158C18.5202 22.5 18.2813 22.9376 18.4952 23.2704Z" fill="#7958FF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_4270_17366)">
|
||||
<path d="M22 22.5L26.576 29.8216C26.7718 30.1349 27.2282 30.1349 27.424 29.8216L32 22.5H22Z" fill="#4300DA"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4270_17366" x1="1" y1="24.5" x2="16.9429" y2="21.625" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FFF06A"/>
|
||||
<stop offset="1" stop-color="#EC78FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_4270_17366" x1="16.5214" y1="30.5208" x2="34.3627" y2="22.0511" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.7 KiB |
13
packages/console/src/assets/icons/third-party-app-dark.svg
Normal file
13
packages/console/src/assets/icons/third-party-app-dark.svg
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<svg width="40" height="41" viewBox="0 0 40 41" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.5" width="40" height="40" rx="8" fill="#F7F8F8" fill-opacity="0.12"/>
|
||||
<mask id="mask0_10024_21501" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="7" y="6" width="26" height="29">
|
||||
<path d="M18.4661 6.92376C19.049 6.58723 19.3404 6.41897 19.6503 6.35311C19.9244 6.29483 20.2078 6.29483 20.4819 6.35311C20.7918 6.41897 21.0832 6.58723 21.6661 6.92376L31.1486 12.3985C31.7315 12.735 32.0229 12.9033 32.2349 13.1387C32.4225 13.347 32.5641 13.5924 32.6507 13.8589C32.7486 14.1602 32.7486 14.4967 32.7486 15.1698V26.1193C32.7486 26.7923 32.7486 27.1289 32.6507 27.4301C32.5641 27.6967 32.4225 27.9421 32.2349 28.1504C32.0229 28.3858 31.7315 28.554 31.1486 28.8906L21.6661 34.3653C21.0832 34.7018 20.7918 34.8701 20.4819 34.936C20.2078 34.9942 19.9244 34.9942 19.6503 34.936C19.3404 34.8701 19.049 34.7018 18.4661 34.3653L8.98355 28.8906C8.40066 28.554 8.10922 28.3858 7.89726 28.1504C7.70971 27.9421 7.56804 27.6967 7.48143 27.4301C7.38354 27.1289 7.38354 26.7923 7.38354 26.1193V15.1698C7.38354 14.4967 7.38354 14.1602 7.48143 13.8589C7.56804 13.5924 7.70971 13.347 7.89726 13.1387C8.10922 12.9033 8.40066 12.735 8.98354 12.3985L18.4661 6.92376Z" fill="black"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_10024_21501)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M31.9487 12.8268C32.082 12.9038 32.082 13.0962 31.9487 13.1732L21.1243 19.4227C20.5055 19.7799 19.7431 19.7799 19.1243 19.4226L8.3 13.1732C8.16667 13.0962 8.16667 12.9038 8.3 12.8268L20.1244 6L31.9487 12.8268Z" fill="#AF9EFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.38359 14.3464C7.38359 14.1924 7.55026 14.0962 7.68359 14.1732L18.508 20.4227C19.1268 20.7799 19.508 21.4402 19.508 22.1547V34.6535C19.508 34.8075 19.3413 34.9037 19.208 34.8267L7.38354 28L7.38359 14.3464Z" fill="#947DFF"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M32.7487 14.3464C32.7487 14.1924 32.582 14.0962 32.4487 14.1732L21.6243 20.4227C21.0055 20.7799 20.6243 21.4402 20.6243 22.1547V34.6536C20.6243 34.8075 20.7909 34.9038 20.9243 34.8268L32.7487 28V14.3464Z" fill="#7958FF"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
12
packages/console/src/assets/icons/third-party-app.svg
Normal file
12
packages/console/src/assets/icons/third-party-app.svg
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#F3EFFA"/>
|
||||
<mask id="mask0_462_19017" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="7" y="5" width="26" height="29">
|
||||
<path d="M18.4663 5.92376C19.0492 5.58723 19.3407 5.41897 19.6505 5.35311C19.9247 5.29483 20.208 5.29483 20.4821 5.35311C20.792 5.41897 21.0834 5.58723 21.6663 5.92376L31.1489 11.3985C31.7318 11.735 32.0232 11.9033 32.2352 12.1387C32.4227 12.347 32.5644 12.5924 32.651 12.8589C32.7489 13.1602 32.7489 13.4967 32.7489 14.1698V25.1193C32.7489 25.7923 32.7489 26.1289 32.651 26.4301C32.5644 26.6967 32.4227 26.9421 32.2352 27.1504C32.0232 27.3858 31.7318 27.554 31.1489 27.8906L21.6663 33.3653C21.0834 33.7018 20.792 33.8701 20.4821 33.936C20.208 33.9942 19.9247 33.9942 19.6505 33.936C19.3407 33.8701 19.0492 33.7018 18.4663 33.3653L8.98379 27.8906C8.4009 27.554 8.10946 27.3858 7.8975 27.1504C7.70996 26.9421 7.56829 26.6967 7.48168 26.4301C7.38379 26.1289 7.38379 25.7923 7.38379 25.1193V14.1698C7.38379 13.4967 7.38379 13.1602 7.48168 12.8589C7.56829 12.5924 7.70996 12.347 7.8975 12.1387C8.10946 11.9033 8.4009 11.735 8.98379 11.3985L18.4663 5.92376Z" fill="black"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_462_19017)">
|
||||
<path opacity="0.22" fill-rule="evenodd" clip-rule="evenodd" d="M31.9487 11.8268C32.082 11.9038 32.082 12.0962 31.9487 12.1732L21.1243 18.4227C20.5055 18.7799 19.7431 18.7799 19.1243 18.4226L8.3 12.1732C8.16667 12.0962 8.16667 11.9038 8.3 11.8268L20.1244 5L31.9487 11.8268Z" fill="#7958FF"/>
|
||||
<path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M7.38384 13.3464C7.38384 13.1924 7.5505 13.0962 7.68384 13.1732L18.5082 19.4227C19.127 19.7799 19.5082 20.4402 19.5082 21.1547V33.6535C19.5082 33.8075 19.3416 33.9037 19.2082 33.8267L7.38379 27L7.38384 13.3464Z" fill="#7958FF"/>
|
||||
<path opacity="0.6" fill-rule="evenodd" clip-rule="evenodd" d="M32.7484 13.3464C32.7484 13.1924 32.5817 13.0962 32.4484 13.1732L21.624 19.4227C21.0052 19.7799 20.624 20.4402 20.624 21.1547V33.6536C20.624 33.8075 20.7907 33.9038 20.924 33.8268L32.7484 27V13.3464Z" fill="#7958FF"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
|
|
@ -1,17 +1,18 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#3A3B59"/>
|
||||
<rect opacity="0.8" x="7.5" y="11" width="25" height="19" rx="2" fill="url(#paint0_linear_1091_20258)"/>
|
||||
<path d="M7.5 15.0715H32.5V13.0001C32.5 11.8955 31.6046 11.0001 30.5 11.0001H9.5C8.39543 11.0001 7.5 11.8955 7.5 13.0001V15.0715Z" fill="#5D34F2"/>
|
||||
<rect x="10.2773" y="17.7856" width="8.33333" height="1.35714" rx="0.678572" fill="#D3BCF3"/>
|
||||
<rect x="10.2773" y="21.8571" width="16.6667" height="1.35714" rx="0.678572" fill="#D3BCF3"/>
|
||||
<path opacity="0.6" d="M29.3509 25C29.6075 24.5556 30.249 24.5556 30.5056 25L36.2791 35C36.5357 35.4444 36.2149 36 35.7017 36H24.1547C23.6415 36 23.3208 35.4444 23.5774 35L29.3509 25Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="10" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20258" x1="5.44643" y1="21.8854" x2="30.0122" y2="9.95067" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="40" height="41" viewBox="0 0 40 41" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.5" width="40" height="40" rx="8" fill="#F7F8F8" fill-opacity="0.12"/>
|
||||
<path opacity="0.8" d="M7.5 13.5C7.5 12.3954 8.39543 11.5 9.5 11.5H30.5C31.6046 11.5 32.5 12.3954 32.5 13.5V28.5C32.5 29.6046 31.6046 30.5 30.5 30.5H9.5C8.39543 30.5 7.5 29.6046 7.5 28.5V13.5Z" fill="url(#paint0_linear_4270_17367)"/>
|
||||
<path d="M7.5 15.5713H32.5V13.4999C32.5 12.3953 31.6046 11.4999 30.5 11.4999H9.5C8.39543 11.4999 7.5 12.3953 7.5 13.4999V15.5713Z" fill="#5D34F2"/>
|
||||
<path d="M10.2773 18.9637C10.2773 18.589 10.5812 18.2852 10.9559 18.2852H17.9321C18.3069 18.2852 18.6107 18.589 18.6107 18.9637C18.6107 19.3385 18.3069 19.6423 17.9321 19.6423H10.9559C10.5812 19.6423 10.2773 19.3385 10.2773 18.9637Z" fill="#D3BCF3"/>
|
||||
<path d="M10.2773 23.036C10.2773 22.6612 10.5812 22.3574 10.9559 22.3574H26.2654C26.6402 22.3574 26.944 22.6612 26.944 23.036C26.944 23.4108 26.6402 23.7146 26.2654 23.7146H10.9559C10.5812 23.7146 10.2773 23.4108 10.2773 23.036Z" fill="#D3BCF3"/>
|
||||
<path opacity="0.6" d="M29.3509 25.5003C29.6075 25.0559 30.249 25.0559 30.5056 25.5003L36.2791 35.5003C36.5357 35.9448 36.2149 36.5003 35.7017 36.5003H24.1547C23.6415 36.5003 23.3208 35.9448 23.5774 35.5003L29.3509 25.5003Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="10.5" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4270_17367" x1="5.44643" y1="22.3854" x2="30.0122" y2="10.4507" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.6 KiB |
|
|
@ -1,17 +1,18 @@
|
|||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#F3EFFA"/>
|
||||
<rect opacity="0.8" x="7.5" y="11" width="25" height="19" rx="2" fill="url(#paint0_linear_1091_20177)"/>
|
||||
<path d="M7.5 15.0715H32.5V13.0001C32.5 11.8955 31.6046 11.0001 30.5 11.0001H9.5C8.39543 11.0001 7.5 11.8955 7.5 13.0001V15.0715Z" fill="#5D34F2"/>
|
||||
<rect x="10.2773" y="17.7856" width="8.33333" height="1.35714" rx="0.678572" fill="#F5EEFF"/>
|
||||
<rect x="10.2773" y="21.8571" width="16.6667" height="1.35714" rx="0.678572" fill="#F5EEFF"/>
|
||||
<path opacity="0.8" d="M29.3509 25C29.6075 24.5556 30.249 24.5556 30.5056 25L36.2791 35C36.5357 35.4444 36.2149 36 35.7017 36H24.1547C23.6415 36 23.3208 35.4444 23.5774 35L29.3509 25Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="10" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20177" x1="5.44643" y1="21.8854" x2="30.0122" y2="9.95067" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="8" fill="#F3EFFA"/>
|
||||
<rect opacity="0.8" x="7.5" y="11" width="25" height="19" rx="2" fill="url(#paint0_linear_1091_20177)"/>
|
||||
<path d="M7.5 15.0715H32.5V13.0001C32.5 11.8955 31.6046 11.0001 30.5 11.0001H9.5C8.39543 11.0001 7.5 11.8955 7.5 13.0001V15.0715Z" fill="#5D34F2"/>
|
||||
<rect x="10.2773" y="17.7856" width="8.33333" height="1.35714" rx="0.678572" fill="#F5EEFF"/>
|
||||
<rect x="10.2773" y="21.8571" width="16.6667" height="1.35714" rx="0.678572" fill="#F5EEFF"/>
|
||||
<path opacity="0.8" d="M29.3509 25C29.6075 24.5556 30.249 24.5556 30.5056 25L36.2791 35C36.5357 35.4444 36.2149 36 35.7017 36H24.1547C23.6415 36 23.3208 35.4444 23.5774 35L29.3509 25Z" fill="#F4E560"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<circle cx="10" cy="10" r="6" fill="#F07EFF"/>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_1091_20177" x1="5.44643" y1="21.8854" x2="30.0122" y2="9.95067" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
|
@ -1,18 +1,32 @@
|
|||
import type { ApplicationType } from '@logto/schemas';
|
||||
import { Theme } from '@logto/schemas';
|
||||
|
||||
import { darkModeApplicationIconMap, lightModeApplicationIconMap } from '@/consts';
|
||||
import {
|
||||
darkModeApplicationIconMap,
|
||||
lightModeApplicationIconMap,
|
||||
thirdPartyApplicationIcon,
|
||||
thirdPartyApplicationIconDark,
|
||||
} from '@/consts';
|
||||
import useTheme from '@/hooks/use-theme';
|
||||
|
||||
type Props = {
|
||||
type: ApplicationType;
|
||||
className?: string;
|
||||
isThirdParty?: boolean;
|
||||
};
|
||||
|
||||
function ApplicationIcon({ type, className }: Props) {
|
||||
const getIcon = (type: ApplicationType, isLightMode: boolean, isThirdParty?: boolean) => {
|
||||
if (isThirdParty) {
|
||||
return isLightMode ? thirdPartyApplicationIcon : thirdPartyApplicationIconDark;
|
||||
}
|
||||
|
||||
return isLightMode ? lightModeApplicationIconMap[type] : darkModeApplicationIconMap[type];
|
||||
};
|
||||
|
||||
function ApplicationIcon({ type, className, isThirdParty = false }: Props) {
|
||||
const theme = useTheme();
|
||||
const isLightMode = theme === Theme.Light;
|
||||
const Icon = isLightMode ? lightModeApplicationIconMap[type] : darkModeApplicationIconMap[type];
|
||||
const Icon = getIcon(type, isLightMode, isThirdParty);
|
||||
|
||||
return <Icon className={className} />;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,3 +30,7 @@ export const darkModeApplicationIconMap: ApplicationIconMap = Object.freeze({
|
|||
[ApplicationType.MachineToMachine]: MachineToMachineDark,
|
||||
[ApplicationType.Protected]: ProtectedAppDark,
|
||||
} as const);
|
||||
|
||||
export { default as thirdPartyApplicationIconDark } from '@/assets/icons/third-party-app-dark.svg';
|
||||
|
||||
export { default as thirdPartyApplicationIcon } from '@/assets/icons/third-party-app.svg';
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@ function ApplicationDetailsContent({ data, oidcConfig, onApplicationUpdated }: P
|
|||
return (
|
||||
<>
|
||||
<DetailsPageHeader
|
||||
icon={<ApplicationIcon type={data.type} />}
|
||||
icon={<ApplicationIcon type={data.type} isThirdParty={data.isThirdParty} />}
|
||||
title={data.name}
|
||||
primaryTag={
|
||||
data.isThirdParty
|
||||
|
|
|
|||
|
|
@ -152,7 +152,13 @@ function Applications({ tab }: Props) {
|
|||
? t(`${applicationTypeI18nKey.thirdParty}.title`)
|
||||
: t(`${applicationTypeI18nKey[type]}.title`)
|
||||
}
|
||||
icon={<ApplicationIcon className={styles.icon} type={type} />}
|
||||
icon={
|
||||
<ApplicationIcon
|
||||
className={styles.icon}
|
||||
type={type}
|
||||
isThirdParty={isThirdParty}
|
||||
/>
|
||||
}
|
||||
to={buildDetailsPathname(id)}
|
||||
/>
|
||||
),
|
||||
|
|
|
|||
Loading…
Reference in a new issue