mirror of
https://github.com/logto-io/logto.git
synced 2025-03-31 22:51:25 -05:00
refactor(console,phrases): improve organization empty placeholder (#4816)
This commit is contained in:
parent
a5a0d44dc8
commit
6f158814cc
23 changed files with 513 additions and 24 deletions
148
packages/console/src/assets/images/organization-empty-dark.svg
Normal file
148
packages/console/src/assets/images/organization-empty-dark.svg
Normal file
|
@ -0,0 +1,148 @@
|
|||
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path opacity="0.4" fill-rule="evenodd" clip-rule="evenodd" d="M183.392 208.572H74.2946C71.7715 208.933 69.1954 209.12 66.5777 209.12C63.9601 209.12 61.384 208.933 58.8608 208.572H54.4717V207.758C29.0418 201.941 10 178.181 10 149.755C10 120.228 30.5446 95.7357 57.453 91.1578C66.4076 59.2729 94.5153 36 127.804 36C159.415 36 186.355 56.9879 196.657 86.408C226.484 89.2734 249.844 115.591 249.844 147.635C249.844 178.056 228.789 203.317 201.135 208.248V208.572H199.1C196.531 208.933 193.909 209.12 191.246 209.12C188.583 209.12 185.961 208.933 183.392 208.572Z" fill="url(#paint0_linear_9679_23642)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M219.527 125.238C219.534 124.924 219.538 124.608 219.538 124.292C219.538 102.592 201.947 85 180.246 85C161.789 85 146.304 97.7265 142.088 114.883C126.487 115.406 114 128.218 114 143.947C114 159.293 125.886 171.862 140.954 172.951V173.125H219.538V125.238H219.527Z" fill="url(#paint1_linear_9679_23642)"/>
|
||||
<g style="mix-blend-mode:hard-light">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M41.8136 226.968C46.7048 226.275 49.0654 209.937 49.237 189.435C50.5472 188.411 51.925 187.128 53.337 185.716C57.966 181.087 60.0418 175.658 58.4923 174.108C57.1854 172.801 53.1189 174.073 49.1003 177.28C48.5427 159.889 46.3374 147.006 41.4874 147.006C34.9528 147.006 33.7276 164.911 33.7276 186.998C33.7276 189.755 33.7658 192.447 33.8429 195.047C32.0016 192.933 30.2679 191.775 28.9523 191.775C25.3709 191.775 27.1471 201.538 30.8107 211.101C33.3523 217.735 36.3142 223.208 39.0239 225.504C39.6306 226.299 40.2917 226.79 41.0082 226.941C41.0049 225.59 40.9957 222.22 40.983 217.664C37.5345 211.012 30.3331 197.547 30.3331 197.547L40.9746 214.632L40.9538 207.195L40.9538 207.194L40.9538 207.187C40.9382 201.597 40.9209 195.416 40.9042 189.399C40.8526 189.447 40.8261 189.472 40.8261 189.472V187.264C40.8499 187.243 40.874 187.222 40.8982 187.2C40.8597 173.284 40.8261 160.764 40.8261 159.238C40.8261 156.859 41.2659 165.57 41.5585 186.654C45.713 183.369 53.6646 179.596 53.6646 179.596C47.9599 183.247 43.3412 187.213 41.5869 188.78C41.7167 198.846 41.8112 211.534 41.8136 226.968Z" fill="url(#paint2_linear_9679_23642)"/>
|
||||
</g>
|
||||
<g style="mix-blend-mode:hard-light">
|
||||
<path d="M15.8816 229H46.1255C49.0059 229 50.8061 225.602 46.1255 223.337C41.4449 221.072 30.2835 219.373 21.6424 220.223C13.0013 221.072 12.6412 229 15.8816 229Z" fill="#C8BEE6"/>
|
||||
</g>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M219.527 125.238C219.534 124.924 219.538 124.608 219.538 124.292C219.538 102.592 201.947 85 180.246 85C161.789 85 146.304 97.7265 142.088 114.883C126.487 115.406 114 128.218 114 143.947C114 159.293 125.886 171.862 140.954 172.951V173.125H219.538V125.238H219.527Z" fill="#D2CCDD"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M219.527 125.238C219.534 124.924 219.538 124.608 219.538 124.292C219.538 102.592 201.947 85 180.246 85C161.789 85 146.304 97.7265 142.088 114.883C126.487 115.406 114 128.218 114 143.947C114 159.293 125.886 171.862 140.954 172.951V173.125H219.538V125.238H219.527Z" fill="url(#paint3_linear_9679_23642)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M222.346 34.5009C222.38 34.4412 222.457 34.421 222.517 34.4558L224.463 35.5911C224.523 35.6259 224.543 35.7026 224.508 35.7623L222.51 39.1869L226.475 39.2048C226.544 39.2051 226.6 39.2614 226.6 39.3305L226.589 41.5835C226.589 41.6526 226.533 41.7084 226.464 41.7081L222.498 41.6902L224.465 45.1334C224.5 45.1934 224.479 45.2699 224.419 45.3042L222.463 46.4219C222.403 46.4562 222.326 46.4353 222.292 46.3753L220.325 42.9327L218.327 46.3574C218.292 46.4172 218.215 46.4373 218.156 46.4025L216.21 45.2672C216.15 45.2324 216.13 45.1557 216.165 45.096L218.163 41.6707L214.197 41.6528C214.128 41.6525 214.073 41.5962 214.073 41.527L214.083 39.2741C214.083 39.2049 214.14 39.1492 214.209 39.1495L218.174 39.1673L216.207 35.7248C216.172 35.6648 216.193 35.5884 216.253 35.5541L218.209 34.4364C218.269 34.4021 218.346 34.4229 218.38 34.483L220.347 37.9261L222.346 34.5009Z" fill="#CABEFF"/>
|
||||
<rect width="6.42101" height="6.42101" rx="2" transform="matrix(-0.758703 -0.651436 -0.651436 0.758703 35.0544 55.1826)" fill="#CABEFF"/>
|
||||
<path d="M44 142C44 137.582 47.5817 134 52 134H180C184.418 134 188 137.582 188 142V227H44V142Z" fill="url(#paint4_linear_9679_23642)"/>
|
||||
<path d="M48 141C48 138.791 49.7909 137 52 137H180C182.209 137 184 138.791 184 141V223H48V141Z" fill="url(#paint5_linear_9679_23642)"/>
|
||||
<path d="M19 223H212V225C212 227.209 210.209 229 208 229H24C21.2386 229 19 226.761 19 224V223Z" fill="#7958FF"/>
|
||||
<path d="M106 137H126V139C126 141.209 124.209 143 122 143H110C107.791 143 106 141.209 106 139V137Z" fill="#947DFF"/>
|
||||
<rect x="59" y="153" width="110" height="56" rx="5" fill="#F5EEFF"/>
|
||||
<g style="mix-blend-mode:multiply" opacity="0.6">
|
||||
<path d="M90.5477 153H118.999V200C118.999 204.971 114.97 209 109.999 209H76.9993L90.5477 153Z" fill="url(#paint6_linear_9679_23642)"/>
|
||||
</g>
|
||||
<rect x="90" y="164" width="68" height="6" rx="2" fill="#FF91DF"/>
|
||||
<rect x="90" y="176" width="68" height="6" rx="2" fill="#C29DFF"/>
|
||||
<rect x="90" y="188" width="68" height="6" rx="2" fill="#C29DFF"/>
|
||||
<circle cx="73.5" cy="169.5" r="7.5" fill="#C39EFF"/>
|
||||
<mask id="mask0_9679_23642" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="66" y="162" width="15" height="15">
|
||||
<circle cx="73.5" cy="169.5" r="7.5" fill="#FF91DF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_9679_23642)">
|
||||
<path d="M73.4342 164.5C73.0578 164.5 72.7324 164.762 72.6524 165.13L72.5601 165.555C72.5066 165.801 72.3182 165.994 72.0852 166.09C71.852 166.187 71.5857 166.182 71.3734 166.046L71.0104 165.812C70.6938 165.609 70.2782 165.653 70.0121 165.919L69.9194 166.012C69.6533 166.278 69.6087 166.694 69.8122 167.01L70.0456 167.373C70.1821 167.586 70.187 167.852 70.0905 168.085C69.994 168.318 69.8011 168.507 69.5546 168.56L69.1301 168.652C68.7623 168.732 68.5 169.058 68.5 169.434V169.566C68.5 169.942 68.7623 170.268 69.1301 170.348L69.5547 170.44C69.8011 170.493 69.994 170.682 70.0905 170.915C70.187 171.148 70.1821 171.414 70.0456 171.627L69.8122 171.99C69.6087 172.306 69.6533 172.722 69.9194 172.988L70.0121 173.081C70.2782 173.347 70.6938 173.391 71.0104 173.188L71.3735 172.954C71.5857 172.818 71.852 172.813 72.0852 172.91C72.3182 173.006 72.5066 173.199 72.5601 173.445L72.6524 173.87C72.7324 174.238 73.0578 174.5 73.4342 174.5H73.5658C73.9422 174.5 74.2676 174.238 74.3476 173.87L74.4399 173.445C74.4934 173.199 74.6818 173.006 74.9148 172.91C75.148 172.813 75.4143 172.818 75.6266 172.954L75.9896 173.188C76.3062 173.391 76.7218 173.347 76.9879 173.081L77.0806 172.988C77.3467 172.722 77.3913 172.306 77.1878 171.99L76.9544 171.627C76.8179 171.414 76.813 171.148 76.9095 170.915C77.006 170.682 77.1989 170.493 77.4454 170.44L77.8699 170.348C78.2377 170.268 78.5 169.942 78.5 169.566V169.434C78.5 169.058 78.2377 168.732 77.8699 168.652L77.4453 168.56C77.1989 168.507 77.006 168.318 76.9095 168.085C76.813 167.852 76.8179 167.586 76.9544 167.373L77.1878 167.01C77.3913 166.694 77.3467 166.278 77.0806 166.012L76.9879 165.919C76.7218 165.653 76.3062 165.609 75.9896 165.812L75.6265 166.046C75.4143 166.182 75.148 166.187 74.9148 166.09C74.6818 165.994 74.4934 165.801 74.4399 165.555L74.3476 165.13C74.2676 164.762 73.9422 164.5 73.5658 164.5H73.4342ZM73.5 167.357C74.6835 167.357 75.6429 168.317 75.6429 169.5C75.6429 170.684 74.6835 171.643 73.5 171.643C72.3165 171.643 71.3571 170.684 71.3571 169.5C71.3571 168.317 72.3165 167.357 73.5 167.357Z" fill="#F5EEFF"/>
|
||||
</g>
|
||||
<g clip-path="url(#clip0_9679_23642)">
|
||||
<rect x="99" y="62" width="139.8" height="153" rx="10" fill="#E6DEFF"/>
|
||||
<circle cx="110.519" cy="77.9492" r="2.65823" fill="#FF5449"/>
|
||||
<circle cx="121.152" cy="77.9492" r="2.65823" fill="#FFB95A"/>
|
||||
<circle cx="131.785" cy="77.9492" r="2.65823" fill="#68BE6C"/>
|
||||
<rect x="107.861" y="91.2402" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint7_linear_9679_23642)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 97.4687V99.4687H119.361V97.4687H117.361ZM116.861 96.4688C116.585 96.4688 116.361 96.6926 116.361 96.9687V99.9687C116.361 100.245 116.585 100.469 116.861 100.469H119.861C120.137 100.469 120.361 100.245 120.361 99.9687V96.9687C120.361 96.6926 120.137 96.4688 119.861 96.4688H116.861ZM114.361 103.469V105.469H116.361V103.469H114.361ZM113.861 102.469C113.585 102.469 113.361 102.692 113.361 102.969V105.969C113.361 106.245 113.585 106.469 113.861 106.469H116.861C117.137 106.469 117.361 106.245 117.361 105.969V102.969C117.361 102.692 117.137 102.469 116.861 102.469H115.861V101.969H120.861V102.469H119.861C119.585 102.469 119.361 102.692 119.361 102.969V105.969C119.361 106.245 119.585 106.469 119.861 106.469H122.861C123.137 106.469 123.361 106.245 123.361 105.969V102.969C123.361 102.692 123.137 102.469 122.861 102.469H121.861V101.969C121.861 101.417 121.413 100.969 120.861 100.969H118.861V100.469H117.861V100.969H115.861C115.309 100.969 114.861 101.417 114.861 101.969V102.469H113.861ZM120.361 105.469V103.469H122.361V105.469H120.361Z" fill="white"/>
|
||||
<g opacity="0.4">
|
||||
<rect x="133.557" y="94.873" width="54" height="14" rx="3" fill="url(#paint8_linear_9679_23642)"/>
|
||||
</g>
|
||||
<rect x="107.861" y="118.506" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint9_linear_9679_23642)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 124.734V126.734H119.361V124.734H117.361ZM116.861 123.734C116.585 123.734 116.361 123.958 116.361 124.234V127.234C116.361 127.511 116.585 127.734 116.861 127.734H119.861C120.137 127.734 120.361 127.511 120.361 127.234V124.234C120.361 123.958 120.137 123.734 119.861 123.734H116.861ZM114.361 130.734V132.734H116.361V130.734H114.361ZM113.861 129.734C113.585 129.734 113.361 129.958 113.361 130.234V133.234C113.361 133.51 113.585 133.734 113.861 133.734H116.861C117.137 133.734 117.361 133.51 117.361 133.234V130.234C117.361 129.958 117.137 129.734 116.861 129.734H115.861V129.234H120.861V129.734H119.861C119.585 129.734 119.361 129.958 119.361 130.234V133.234C119.361 133.51 119.585 133.734 119.861 133.734H122.861C123.137 133.734 123.361 133.51 123.361 133.234V130.234C123.361 129.958 123.137 129.734 122.861 129.734H121.861V129.234C121.861 128.682 121.413 128.234 120.861 128.234H118.861V127.735H117.861V128.234H115.861C115.309 128.234 114.861 128.682 114.861 129.234V129.734H113.861ZM120.361 132.734V130.734H122.361V132.734H120.361Z" fill="white"/>
|
||||
<g opacity="0.4">
|
||||
<rect x="133.557" y="122.139" width="54" height="14" rx="3" fill="url(#paint10_linear_9679_23642)"/>
|
||||
</g>
|
||||
<rect x="107.861" y="145.771" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint11_linear_9679_23642)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 152V154H119.361V152H117.361ZM116.861 151C116.585 151 116.361 151.224 116.361 151.5V154.5C116.361 154.776 116.585 155 116.861 155H119.861C120.137 155 120.361 154.776 120.361 154.5V151.5C120.361 151.224 120.137 151 119.861 151H116.861ZM114.361 158V160H116.361V158H114.361ZM113.861 157C113.585 157 113.361 157.224 113.361 157.5V160.5C113.361 160.776 113.585 161 113.861 161H116.861C117.137 161 117.361 160.776 117.361 160.5V157.5C117.361 157.224 117.137 157 116.861 157H115.861V156.5H120.861V157H119.861C119.585 157 119.361 157.224 119.361 157.5V160.5C119.361 160.776 119.585 161 119.861 161H122.861C123.137 161 123.361 160.776 123.361 160.5V157.5C123.361 157.224 123.137 157 122.861 157H121.861V156.5C121.861 155.948 121.413 155.5 120.861 155.5H118.861V155H117.861V155.5H115.861C115.309 155.5 114.861 155.948 114.861 156.5V157H113.861ZM120.361 160V158H122.361V160H120.361Z" fill="white"/>
|
||||
<g opacity="0.4">
|
||||
<rect x="133.557" y="149.404" width="54" height="14" rx="3" fill="url(#paint12_linear_9679_23642)"/>
|
||||
</g>
|
||||
<rect x="107.861" y="173.038" width="21.2658" height="21.2658" rx="4.43038" fill="#9C7ECC"/>
|
||||
<path d="M122.629 183.081H119.084V179.537C119.084 179.38 119.022 179.23 118.911 179.119C118.8 179.009 118.65 178.946 118.494 178.946C118.337 178.946 118.187 179.009 118.076 179.119C117.965 179.23 117.903 179.38 117.903 179.537V183.081H114.359C114.202 183.081 114.052 183.144 113.941 183.254C113.83 183.365 113.768 183.515 113.768 183.672C113.768 183.829 113.83 183.979 113.941 184.09C114.052 184.201 114.202 184.263 114.359 184.263H117.903V187.807C117.903 187.964 117.965 188.114 118.076 188.225C118.187 188.336 118.337 188.398 118.494 188.398C118.65 188.398 118.8 188.336 118.911 188.225C119.022 188.114 119.084 187.964 119.084 187.807V184.263H122.629C122.785 184.263 122.936 184.201 123.046 184.09C123.157 183.979 123.219 183.829 123.219 183.672C123.219 183.515 123.157 183.365 123.046 183.254C122.936 183.144 122.785 183.081 122.629 183.081Z" fill="white"/>
|
||||
<g opacity="0.4">
|
||||
<rect x="133.557" y="176.671" width="54" height="14" rx="3" fill="url(#paint13_linear_9679_23642)"/>
|
||||
</g>
|
||||
<g clip-path="url(#clip1_9679_23642)">
|
||||
<g clip-path="url(#clip2_9679_23642)">
|
||||
<rect opacity="0.2" x="201" y="86" width="50.5063" height="13.2911" rx="2.65823" fill="url(#paint14_linear_9679_23642)"/>
|
||||
<rect opacity="0.2" x="201" y="106.38" width="50.5063" height="13.2911" rx="2.65823" fill="url(#paint15_linear_9679_23642)"/>
|
||||
<rect opacity="0.2" x="201" y="126.76" width="51" height="92" rx="2.65823" fill="url(#paint16_linear_9679_23642)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect x="99.3" y="62.3" width="139.2" height="152.4" rx="9.7" stroke="#C9C5D0" stroke-width="0.6"/>
|
||||
<rect width="7.19512" height="7.18628" rx="1.8" transform="matrix(0.859426 0.511261 -0.513216 0.85826 56.6882 105)" fill="#6E6083"/>
|
||||
<path d="M252.791 71L251.596 73.564C250.937 74.98 249.254 75.5933 247.838 74.9338V74.9338C246.422 74.2743 244.74 74.8876 244.08 76.3036V76.3036C243.421 77.7197 241.738 78.333 240.322 77.6735V77.6735C238.906 77.0139 237.223 77.6272 236.564 79.0433L235.37 81.6073" stroke="#928F9A" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M72.5213 65.4891L72.161 62.9757C71.9619 61.5872 70.6727 60.6231 69.2806 60.8217V60.8217C67.8886 61.0202 66.5994 60.0561 66.4003 58.6677V58.6677C66.2012 57.2792 64.912 56.3151 63.52 56.5137L61.0001 56.8731" stroke="#928F9A" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_9679_23642" x1="44" y1="-19" x2="130" y2="232" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6E6A88"/>
|
||||
<stop offset="1" stop-color="#F3EFFA" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_9679_23642" x1="166.769" y1="85" x2="166.769" y2="232.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FEFDFF"/>
|
||||
<stop offset="1" stop-color="#FAF7FF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_9679_23642" x1="42.8611" y1="228.869" x2="56.4061" y2="112.054" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#C7BDE6"/>
|
||||
<stop offset="1" stop-color="#E4DBFF" stop-opacity="0.16"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_9679_23642" x1="166.769" y1="85" x2="166.769" y2="232.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FEFDFF"/>
|
||||
<stop offset="1" stop-color="#FAF7FF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint4_linear_9679_23642" x1="112.556" y1="136.099" x2="143.327" y2="238.121" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint5_linear_9679_23642" x1="184" y1="223.001" x2="-25" y2="90.001" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#BC97FD"/>
|
||||
<stop offset="1" stop-color="#BC97FD" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint6_linear_9679_23642" x1="120.59" y1="178.664" x2="80.951" y2="203.746" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#ECB6FF"/>
|
||||
<stop offset="1" stop-color="#BE9BFF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint7_linear_9679_23642" x1="109.423" y1="101.855" x2="131.77" y2="101.855" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint8_linear_9679_23642" x1="137.524" y1="101.861" x2="194.27" y2="101.861" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint9_linear_9679_23642" x1="109.423" y1="129.121" x2="131.77" y2="129.121" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint10_linear_9679_23642" x1="137.524" y1="129.127" x2="194.27" y2="129.127" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint11_linear_9679_23642" x1="109.423" y1="156.387" x2="131.77" y2="156.387" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint12_linear_9679_23642" x1="137.524" y1="156.393" x2="194.27" y2="156.393" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint13_linear_9679_23642" x1="137.524" y1="183.659" x2="194.27" y2="183.659" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint14_linear_9679_23642" x1="204.71" y1="92.6344" x2="257.785" y2="92.6344" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint15_linear_9679_23642" x1="204.71" y1="113.014" x2="257.785" y2="113.014" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint16_linear_9679_23642" x1="204.747" y1="172.683" x2="258.34" y2="172.683" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_9679_23642">
|
||||
<rect x="99" y="62" width="139.8" height="153" rx="10" fill="white"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip1_9679_23642">
|
||||
<rect width="47" height="140" fill="white" transform="translate(192 75)"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip2_9679_23642">
|
||||
<rect width="51" height="149" fill="white" transform="translate(201 86)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
After Width: | Height: | Size: 18 KiB |
138
packages/console/src/assets/images/organization-empty.svg
Normal file
138
packages/console/src/assets/images/organization-empty.svg
Normal file
|
@ -0,0 +1,138 @@
|
|||
<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M183.392 208.572H74.2946C71.7715 208.933 69.1954 209.12 66.5777 209.12C63.9601 209.12 61.384 208.933 58.8608 208.572H54.4717V207.758C29.0418 201.941 10 178.181 10 149.755C10 120.228 30.5446 95.7357 57.453 91.1578C66.4076 59.2729 94.5153 36 127.804 36C159.415 36 186.355 56.9879 196.657 86.408C226.484 89.2734 249.844 115.591 249.844 147.635C249.844 178.056 228.789 203.317 201.135 208.248V208.572H199.1C196.531 208.933 193.909 209.12 191.246 209.12C188.583 209.12 185.961 208.933 183.392 208.572Z" fill="url(#paint0_linear_9679_23375)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M140.954 172.951C125.886 171.862 114 159.293 114 143.947C114 128.218 126.487 115.406 142.088 114.883C146.304 97.7265 161.789 85 180.246 85C198.135 85 213.232 96.9546 217.983 113.311C234.439 113.836 247.613 126.999 247.613 143.161C247.613 158.81 235.261 171.648 219.538 172.923V173.125H140.954V172.951Z" fill="url(#paint1_linear_9679_23375)"/>
|
||||
<g style="mix-blend-mode:multiply">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M41.8136 226.968C46.7048 226.275 49.0654 209.937 49.237 189.435C50.5472 188.411 51.925 187.128 53.337 185.716C57.966 181.087 60.0418 175.658 58.4923 174.108C57.1854 172.801 53.1189 174.073 49.1003 177.28C48.5427 159.889 46.3374 147.006 41.4874 147.006C34.9528 147.006 33.7276 164.911 33.7276 186.998C33.7276 189.755 33.7658 192.447 33.8429 195.047C32.0016 192.933 30.2679 191.775 28.9523 191.775C25.3709 191.775 27.1471 201.538 30.8107 211.101C33.3523 217.735 36.3142 223.208 39.0239 225.504C39.6306 226.299 40.2917 226.79 41.0082 226.941C41.0049 225.59 40.9957 222.22 40.983 217.664C37.5345 211.012 30.3331 197.547 30.3331 197.547L40.9746 214.632L40.9538 207.195L40.9538 207.194L40.9538 207.187C40.9382 201.597 40.9209 195.416 40.9042 189.399C40.8526 189.447 40.8261 189.472 40.8261 189.472V187.264C40.8499 187.243 40.874 187.222 40.8982 187.2C40.8597 173.284 40.8261 160.764 40.8261 159.238C40.8261 156.859 41.2659 165.57 41.5585 186.654C45.713 183.369 53.6646 179.596 53.6646 179.596C47.9599 183.247 43.3412 187.213 41.5869 188.78C41.7167 198.846 41.8112 211.534 41.8136 226.968Z" fill="url(#paint2_linear_9679_23375)"/>
|
||||
</g>
|
||||
<path d="M15.8816 229H46.1255C49.0059 229 50.8061 225.602 46.1255 223.337C41.4449 221.072 30.2835 219.373 21.6424 220.223C13.0013 221.072 12.6412 229 15.8816 229Z" fill="#C8BEE6"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M219.527 125.238C219.534 124.924 219.538 124.608 219.538 124.292C219.538 102.592 201.947 85 180.246 85C161.789 85 146.304 97.7265 142.088 114.883C126.487 115.406 114 128.218 114 143.947C114 159.293 125.886 171.862 140.954 172.951V173.125H219.538V125.238H219.527Z" fill="#D2CCDD"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M219.527 125.238C219.534 124.924 219.538 124.608 219.538 124.292C219.538 102.592 201.947 85 180.246 85C161.789 85 146.304 97.7265 142.088 114.883C126.487 115.406 114 128.218 114 143.947C114 159.293 125.886 171.862 140.954 172.951V173.125H219.538V125.238H219.527Z" fill="url(#paint3_linear_9679_23375)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M222.346 34.5009C222.38 34.4412 222.457 34.421 222.517 34.4558L224.463 35.5911C224.523 35.6259 224.543 35.7026 224.508 35.7623L222.51 39.1869L226.475 39.2048C226.544 39.2051 226.6 39.2614 226.6 39.3305L226.589 41.5835C226.589 41.6526 226.533 41.7084 226.464 41.7081L222.498 41.6902L224.465 45.1334C224.5 45.1934 224.479 45.2699 224.419 45.3042L222.463 46.4219C222.403 46.4562 222.326 46.4353 222.292 46.3753L220.325 42.9327L218.327 46.3574C218.292 46.4172 218.215 46.4373 218.156 46.4025L216.21 45.2672C216.15 45.2324 216.13 45.1557 216.165 45.096L218.163 41.6707L214.197 41.6528C214.128 41.6525 214.073 41.5962 214.073 41.527L214.083 39.2741C214.083 39.2049 214.14 39.1492 214.209 39.1495L218.174 39.1673L216.207 35.7248C216.172 35.6648 216.193 35.5884 216.253 35.5541L218.209 34.4364C218.269 34.4021 218.346 34.4229 218.38 34.483L220.347 37.9261L222.346 34.5009Z" fill="#CABEFF"/>
|
||||
<rect width="6.42101" height="6.42101" rx="2" transform="matrix(-0.758703 -0.651436 -0.651436 0.758703 35.0544 55.1826)" fill="#CABEFF"/>
|
||||
<path d="M44 142C44 137.582 47.5817 134 52 134H180C184.418 134 188 137.582 188 142V227H44V142Z" fill="url(#paint4_linear_9679_23375)"/>
|
||||
<path d="M48 141C48 138.791 49.7909 137 52 137H180C182.209 137 184 138.791 184 141V223H48V141Z" fill="url(#paint5_linear_9679_23375)"/>
|
||||
<path d="M19 223H212V225C212 227.209 210.209 229 208 229H24C21.2386 229 19 226.761 19 224V223Z" fill="#7958FF"/>
|
||||
<path d="M106 137H126V139C126 141.209 124.209 143 122 143H110C107.791 143 106 141.209 106 139V137Z" fill="#947DFF"/>
|
||||
<rect x="59" y="153" width="110" height="56" rx="5" fill="#F5EEFF"/>
|
||||
<g style="mix-blend-mode:multiply" opacity="0.6">
|
||||
<path d="M90.5477 153H118.999V200C118.999 204.971 114.97 209 109.999 209H76.9993L90.5477 153Z" fill="url(#paint6_linear_9679_23375)"/>
|
||||
</g>
|
||||
<rect x="90" y="164" width="68" height="6" rx="2" fill="#FF91DF"/>
|
||||
<rect x="90" y="176" width="68" height="6" rx="2" fill="#C29DFF"/>
|
||||
<rect x="90" y="188" width="68" height="6" rx="2" fill="#C29DFF"/>
|
||||
<circle cx="73.5" cy="169.5" r="7.5" fill="#C39EFF"/>
|
||||
<mask id="mask0_9679_23375" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="66" y="162" width="15" height="15">
|
||||
<circle cx="73.5" cy="169.5" r="7.5" fill="#FF91DF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_9679_23375)">
|
||||
<path d="M73.4342 164.5C73.0578 164.5 72.7324 164.762 72.6524 165.13L72.5601 165.555C72.5066 165.801 72.3182 165.994 72.0852 166.09C71.852 166.187 71.5857 166.182 71.3734 166.046L71.0104 165.812C70.6938 165.609 70.2782 165.653 70.0121 165.919L69.9194 166.012C69.6533 166.278 69.6087 166.694 69.8122 167.01L70.0456 167.373C70.1821 167.586 70.187 167.852 70.0905 168.085C69.994 168.318 69.8011 168.507 69.5546 168.56L69.1301 168.652C68.7623 168.732 68.5 169.058 68.5 169.434V169.566C68.5 169.942 68.7623 170.268 69.1301 170.348L69.5547 170.44C69.8011 170.493 69.994 170.682 70.0905 170.915C70.187 171.148 70.1821 171.414 70.0456 171.627L69.8122 171.99C69.6087 172.306 69.6533 172.722 69.9194 172.988L70.0121 173.081C70.2782 173.347 70.6938 173.391 71.0104 173.188L71.3735 172.954C71.5857 172.818 71.852 172.813 72.0852 172.91C72.3182 173.006 72.5066 173.199 72.5601 173.445L72.6524 173.87C72.7324 174.238 73.0578 174.5 73.4342 174.5H73.5658C73.9422 174.5 74.2676 174.238 74.3476 173.87L74.4399 173.445C74.4934 173.199 74.6818 173.006 74.9148 172.91C75.148 172.813 75.4143 172.818 75.6266 172.954L75.9896 173.188C76.3062 173.391 76.7218 173.347 76.9879 173.081L77.0806 172.988C77.3467 172.722 77.3913 172.306 77.1878 171.99L76.9544 171.627C76.8179 171.414 76.813 171.148 76.9095 170.915C77.006 170.682 77.1989 170.493 77.4454 170.44L77.8699 170.348C78.2377 170.268 78.5 169.942 78.5 169.566V169.434C78.5 169.058 78.2377 168.732 77.8699 168.652L77.4453 168.56C77.1989 168.507 77.006 168.318 76.9095 168.085C76.813 167.852 76.8179 167.586 76.9544 167.373L77.1878 167.01C77.3913 166.694 77.3467 166.278 77.0806 166.012L76.9879 165.919C76.7218 165.653 76.3062 165.609 75.9896 165.812L75.6265 166.046C75.4143 166.182 75.148 166.187 74.9148 166.09C74.6818 165.994 74.4934 165.801 74.4399 165.555L74.3476 165.13C74.2676 164.762 73.9422 164.5 73.5658 164.5H73.4342ZM73.5 167.357C74.6835 167.357 75.6429 168.317 75.6429 169.5C75.6429 170.684 74.6835 171.643 73.5 171.643C72.3165 171.643 71.3571 170.684 71.3571 169.5C71.3571 168.317 72.3165 167.357 73.5 167.357Z" fill="#F5EEFF"/>
|
||||
</g>
|
||||
<g clip-path="url(#clip0_9679_23375)">
|
||||
<rect x="99" y="62" width="139.8" height="153" rx="10" fill="#FFFBFF"/>
|
||||
<circle cx="110.519" cy="77.9492" r="2.65823" fill="#FF5449"/>
|
||||
<circle cx="121.152" cy="77.9492" r="2.65823" fill="#FFB95A"/>
|
||||
<circle cx="131.785" cy="77.9492" r="2.65823" fill="#68BE6C"/>
|
||||
<rect x="107.861" y="91.2402" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint7_linear_9679_23375)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 97.4687V99.4687H119.361V97.4687H117.361ZM116.861 96.4688C116.585 96.4688 116.361 96.6926 116.361 96.9687V99.9687C116.361 100.245 116.585 100.469 116.861 100.469H119.861C120.137 100.469 120.361 100.245 120.361 99.9687V96.9687C120.361 96.6926 120.137 96.4688 119.861 96.4688H116.861ZM114.361 103.469V105.469H116.361V103.469H114.361ZM113.861 102.469C113.585 102.469 113.361 102.692 113.361 102.969V105.969C113.361 106.245 113.585 106.469 113.861 106.469H116.861C117.137 106.469 117.361 106.245 117.361 105.969V102.969C117.361 102.692 117.137 102.469 116.861 102.469H115.861V101.969H120.861V102.469H119.861C119.585 102.469 119.361 102.692 119.361 102.969V105.969C119.361 106.245 119.585 106.469 119.861 106.469H122.861C123.137 106.469 123.361 106.245 123.361 105.969V102.969C123.361 102.692 123.137 102.469 122.861 102.469H121.861V101.969C121.861 101.417 121.413 100.969 120.861 100.969H118.861V100.469H117.861V100.969H115.861C115.309 100.969 114.861 101.417 114.861 101.969V102.469H113.861ZM120.361 105.469V103.469H122.361V105.469H120.361Z" fill="white"/>
|
||||
<rect x="133.557" y="94.873" width="54" height="14" rx="3" fill="url(#paint8_linear_9679_23375)"/>
|
||||
<rect x="107.861" y="118.506" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint9_linear_9679_23375)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 124.734V126.734H119.361V124.734H117.361ZM116.861 123.734C116.585 123.734 116.361 123.958 116.361 124.234V127.234C116.361 127.511 116.585 127.734 116.861 127.734H119.861C120.137 127.734 120.361 127.511 120.361 127.234V124.234C120.361 123.958 120.137 123.734 119.861 123.734H116.861ZM114.361 130.734V132.734H116.361V130.734H114.361ZM113.861 129.734C113.585 129.734 113.361 129.958 113.361 130.234V133.234C113.361 133.51 113.585 133.734 113.861 133.734H116.861C117.137 133.734 117.361 133.51 117.361 133.234V130.234C117.361 129.958 117.137 129.734 116.861 129.734H115.861V129.234H120.861V129.734H119.861C119.585 129.734 119.361 129.958 119.361 130.234V133.234C119.361 133.51 119.585 133.734 119.861 133.734H122.861C123.137 133.734 123.361 133.51 123.361 133.234V130.234C123.361 129.958 123.137 129.734 122.861 129.734H121.861V129.234C121.861 128.682 121.413 128.234 120.861 128.234H118.861V127.735H117.861V128.234H115.861C115.309 128.234 114.861 128.682 114.861 129.234V129.734H113.861ZM120.361 132.734V130.734H122.361V132.734H120.361Z" fill="white"/>
|
||||
<rect x="133.557" y="122.139" width="54" height="14" rx="3" fill="url(#paint10_linear_9679_23375)"/>
|
||||
<rect x="107.861" y="145.771" width="21.2658" height="21.2658" rx="4.43038" fill="url(#paint11_linear_9679_23375)"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M117.361 152V154H119.361V152H117.361ZM116.861 151C116.585 151 116.361 151.224 116.361 151.5V154.5C116.361 154.776 116.585 155 116.861 155H119.861C120.137 155 120.361 154.776 120.361 154.5V151.5C120.361 151.224 120.137 151 119.861 151H116.861ZM114.361 158V160H116.361V158H114.361ZM113.861 157C113.585 157 113.361 157.224 113.361 157.5V160.5C113.361 160.776 113.585 161 113.861 161H116.861C117.137 161 117.361 160.776 117.361 160.5V157.5C117.361 157.224 117.137 157 116.861 157H115.861V156.5H120.861V157H119.861C119.585 157 119.361 157.224 119.361 157.5V160.5C119.361 160.776 119.585 161 119.861 161H122.861C123.137 161 123.361 160.776 123.361 160.5V157.5C123.361 157.224 123.137 157 122.861 157H121.861V156.5C121.861 155.948 121.413 155.5 120.861 155.5H118.861V155H117.861V155.5H115.861C115.309 155.5 114.861 155.948 114.861 156.5V157H113.861ZM120.361 160V158H122.361V160H120.361Z" fill="white"/>
|
||||
<rect x="133.557" y="149.404" width="54" height="14" rx="3" fill="url(#paint12_linear_9679_23375)"/>
|
||||
<rect x="107.861" y="173.038" width="21.2658" height="21.2658" rx="4.43038" fill="#BDBDBD"/>
|
||||
<path d="M122.629 183.081H119.084V179.537C119.084 179.38 119.022 179.23 118.911 179.119C118.8 179.009 118.65 178.946 118.494 178.946C118.337 178.946 118.187 179.009 118.076 179.119C117.965 179.23 117.903 179.38 117.903 179.537V183.081H114.359C114.202 183.081 114.052 183.144 113.941 183.254C113.83 183.365 113.768 183.515 113.768 183.672C113.768 183.829 113.83 183.979 113.941 184.09C114.052 184.201 114.202 184.263 114.359 184.263H117.903V187.807C117.903 187.964 117.965 188.114 118.076 188.225C118.187 188.336 118.337 188.398 118.494 188.398C118.65 188.398 118.8 188.336 118.911 188.225C119.022 188.114 119.084 187.964 119.084 187.807V184.263H122.629C122.785 184.263 122.936 184.201 123.046 184.09C123.157 183.979 123.219 183.829 123.219 183.672C123.219 183.515 123.157 183.365 123.046 183.254C122.936 183.144 122.785 183.081 122.629 183.081Z" fill="white"/>
|
||||
<rect x="133.557" y="176.671" width="54" height="14" rx="3" fill="url(#paint13_linear_9679_23375)"/>
|
||||
<g clip-path="url(#clip1_9679_23375)">
|
||||
<g clip-path="url(#clip2_9679_23375)">
|
||||
<rect opacity="0.2" x="201" y="86" width="50.5063" height="13.2911" rx="2.65823" fill="url(#paint14_linear_9679_23375)"/>
|
||||
<rect opacity="0.2" x="201" y="106.38" width="50.5063" height="13.2911" rx="2.65823" fill="url(#paint15_linear_9679_23375)"/>
|
||||
<rect opacity="0.2" x="201" y="126.76" width="51" height="92" rx="2.65823" fill="url(#paint16_linear_9679_23375)"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<rect x="99.3" y="62.3" width="139.2" height="152.4" rx="9.7" stroke="#C9C5D0" stroke-width="0.6"/>
|
||||
<rect width="7.19512" height="7.18628" rx="1.8" transform="matrix(0.859426 0.511261 -0.513216 0.85826 56.6882 105)" fill="#FFD5FF"/>
|
||||
<path d="M252.791 71L251.596 73.564C250.937 74.98 249.254 75.5933 247.838 74.9338V74.9338C246.422 74.2743 244.74 74.8876 244.08 76.3036V76.3036C243.421 77.7197 241.738 78.333 240.322 77.6735V77.6735C238.906 77.0139 237.223 77.6272 236.564 79.0433L235.37 81.6073" stroke="#CABEFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M72.5213 65.4891L72.161 62.9757C71.9619 61.5872 70.6727 60.6231 69.2806 60.8217V60.8217C67.8886 61.0202 66.5994 60.0561 66.4003 58.6677V58.6677C66.2012 57.2792 64.912 56.3151 63.52 56.5137L61.0001 56.8731" stroke="#FFF06A" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_9679_23375" x1="129.922" y1="36" x2="129.922" y2="209.12" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#F3EFFA"/>
|
||||
<stop offset="1" stop-color="#F3EFFA" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_9679_23375" x1="180.807" y1="85" x2="180.807" y2="232.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FEFDFF"/>
|
||||
<stop offset="1" stop-color="#FAF7FF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_9679_23375" x1="42.8611" y1="228.869" x2="57.6494" y2="145.844" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#C7BDE6"/>
|
||||
<stop offset="1" stop-color="#E4DBFF" stop-opacity="0.16"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_9679_23375" x1="166.769" y1="85" x2="166.769" y2="232.5" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FEFDFF"/>
|
||||
<stop offset="1" stop-color="#FAF7FF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint4_linear_9679_23375" x1="112.556" y1="136.099" x2="143.327" y2="238.121" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#492EF3"/>
|
||||
<stop offset="1" stop-color="#CF69FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint5_linear_9679_23375" x1="184" y1="223.001" x2="-25" y2="90.001" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#BC97FD"/>
|
||||
<stop offset="1" stop-color="#BC97FD" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint6_linear_9679_23375" x1="120.59" y1="178.664" x2="80.951" y2="203.746" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#ECB6FF"/>
|
||||
<stop offset="1" stop-color="#BE9BFF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint7_linear_9679_23375" x1="109.423" y1="101.855" x2="131.77" y2="101.855" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint8_linear_9679_23375" x1="134.307" y1="101.348" x2="187.557" y2="101.348" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D2C4FF"/>
|
||||
<stop offset="1" stop-color="#ECD5FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint9_linear_9679_23375" x1="109.423" y1="129.121" x2="131.77" y2="129.121" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint10_linear_9679_23375" x1="134.307" y1="128.614" x2="187.557" y2="128.614" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D2C4FF"/>
|
||||
<stop offset="1" stop-color="#ECD5FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint11_linear_9679_23375" x1="109.423" y1="156.387" x2="131.77" y2="156.387" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#6B47F7"/>
|
||||
<stop offset="1" stop-color="#7F46FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint12_linear_9679_23375" x1="134.307" y1="155.879" x2="187.557" y2="155.879" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D2C4FF"/>
|
||||
<stop offset="1" stop-color="#ECD5FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint13_linear_9679_23375" x1="134.307" y1="183.146" x2="187.557" y2="183.146" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#D2C4FF"/>
|
||||
<stop offset="1" stop-color="#ECD5FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint14_linear_9679_23375" x1="194.797" y1="92.6456" x2="209.282" y2="67.4458" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#A278FF"/>
|
||||
<stop offset="1" stop-color="#F3A8FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint15_linear_9679_23375" x1="194.797" y1="113.025" x2="209.282" y2="87.8257" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#A278FF"/>
|
||||
<stop offset="1" stop-color="#F3A8FF"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint16_linear_9679_23375" x1="194.737" y1="172.76" x2="250.069" y2="158.716" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#A278FF"/>
|
||||
<stop offset="1" stop-color="#F3A8FF"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_9679_23375">
|
||||
<rect x="99" y="62" width="139.8" height="153" rx="10" fill="white"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip1_9679_23375">
|
||||
<rect width="47" height="140" fill="white" transform="translate(192 75)"/>
|
||||
</clipPath>
|
||||
<clipPath id="clip2_9679_23375">
|
||||
<rect width="51" height="149" fill="white" transform="translate(201 86)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
After Width: | Height: | Size: 18 KiB |
|
@ -0,0 +1,28 @@
|
|||
@use '@/scss/underscore' as _;
|
||||
|
||||
.placeholder {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 600px;
|
||||
|
||||
.image {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font: var(--font-label-2);
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-top: _.unit(1);
|
||||
font: var(--font-body-2);
|
||||
color: var(--color-text-secondary);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-top: _.unit(6);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,45 @@
|
|||
import { Theme } from '@logto/schemas';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import Plus from '@/assets/icons/plus.svg';
|
||||
import OrganizationEmptyDark from '@/assets/images/organization-empty-dark.svg';
|
||||
import OrganizationEmpty from '@/assets/images/organization-empty.svg';
|
||||
import Button from '@/ds-components/Button';
|
||||
import useConfigs from '@/hooks/use-configs';
|
||||
import useTenantPathname from '@/hooks/use-tenant-pathname';
|
||||
import useTheme from '@/hooks/use-theme';
|
||||
|
||||
import { createPathname, guidePathname } from '../../consts';
|
||||
|
||||
import * as styles from './index.module.scss';
|
||||
|
||||
function EmptyDataPlaceholder() {
|
||||
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console.organizations' });
|
||||
const { configs } = useConfigs();
|
||||
const { navigate } = useTenantPathname();
|
||||
const theme = useTheme();
|
||||
const PlaceholderImage = theme === Theme.Light ? OrganizationEmpty : OrganizationEmptyDark;
|
||||
const isInitialSetup = !configs?.organizationCreated;
|
||||
|
||||
return (
|
||||
<div className={styles.placeholder}>
|
||||
<PlaceholderImage className={styles.image} />
|
||||
<div className={styles.title}>{t('organization_list_placeholder_title')}</div>
|
||||
<div className={styles.text}>{t('organization_list_placeholder_text')}</div>
|
||||
<Button
|
||||
className={styles.button}
|
||||
type="primary"
|
||||
size="large"
|
||||
icon={<Plus />}
|
||||
title={
|
||||
isInitialSetup ? 'organizations.setup_organization' : 'organizations.create_organization'
|
||||
}
|
||||
onClick={() => {
|
||||
navigate(isInitialSetup ? guidePathname : createPathname);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default EmptyDataPlaceholder;
|
|
@ -5,7 +5,6 @@ import { useTranslation } from 'react-i18next';
|
|||
import useSWR from 'swr';
|
||||
|
||||
import OrganizationIcon from '@/assets/icons/organization-preview.svg';
|
||||
import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
|
||||
import ItemPreview from '@/components/ItemPreview';
|
||||
import ThemedIcon from '@/components/ThemedIcon';
|
||||
import { defaultPageSize } from '@/consts';
|
||||
|
@ -15,8 +14,11 @@ import Table from '@/ds-components/Table';
|
|||
import { type RequestError } from '@/hooks/use-api';
|
||||
import useTenantPathname from '@/hooks/use-tenant-pathname';
|
||||
import AssignedEntities from '@/pages/Roles/components/AssignedEntities';
|
||||
import * as pageLayout from '@/scss/page-layout.module.scss';
|
||||
import { buildUrl } from '@/utils/url';
|
||||
|
||||
import EmptyDataPlaceholder from './EmptyDataPlaceholder';
|
||||
|
||||
/** The page size of the organizations table. */
|
||||
const pageSize = defaultPageSize;
|
||||
/** The organizations page root pathname. */
|
||||
|
@ -42,6 +44,7 @@ function OrganizationsTable() {
|
|||
|
||||
return (
|
||||
<Table
|
||||
className={pageLayout.table}
|
||||
isLoading={isLoading}
|
||||
placeholder={<EmptyDataPlaceholder />}
|
||||
rowGroups={[{ key: 'data', data }]}
|
||||
|
|
3
packages/console/src/pages/Organizations/consts.ts
Normal file
3
packages/console/src/pages/Organizations/consts.ts
Normal file
|
@ -0,0 +1,3 @@
|
|||
export const organizationsPathname = '/organizations';
|
||||
export const createPathname = `${organizationsPathname}/create`;
|
||||
export const guidePathname = '/organization-guide';
|
|
@ -3,3 +3,11 @@
|
|||
.tabs {
|
||||
margin-top: _.unit(4);
|
||||
}
|
||||
|
||||
.emptyCardContainer {
|
||||
margin-top: _.unit(4);
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
|
|
@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
|
|||
import Plus from '@/assets/icons/plus.svg';
|
||||
import PageMeta from '@/components/PageMeta';
|
||||
import Button from '@/ds-components/Button';
|
||||
import Card from '@/ds-components/Card';
|
||||
import CardTitle from '@/ds-components/CardTitle';
|
||||
import TabNav, { TabNavItem } from '@/ds-components/TabNav';
|
||||
import useConfigs from '@/hooks/use-configs';
|
||||
|
@ -12,13 +13,11 @@ import * as pageLayout from '@/scss/page-layout.module.scss';
|
|||
|
||||
import CreateOrganizationModal from './CreateOrganizationModal';
|
||||
import OrganizationsTable from './OrganizationsTable';
|
||||
import EmptyDataPlaceholder from './OrganizationsTable/EmptyDataPlaceholder';
|
||||
import Settings from './Settings';
|
||||
import { createPathname, organizationsPathname } from './consts';
|
||||
import * as styles from './index.module.scss';
|
||||
|
||||
const organizationsPathname = '/organizations';
|
||||
const createPathname = `${organizationsPathname}/create`;
|
||||
const organizationGuidePathname = '/organization-guide';
|
||||
|
||||
const tabs = Object.freeze({
|
||||
settings: 'settings',
|
||||
});
|
||||
|
@ -32,6 +31,7 @@ function Organizations({ tab }: Props) {
|
|||
const { navigate, match } = useTenantPathname();
|
||||
const isCreating = match(createPathname);
|
||||
const { configs } = useConfigs();
|
||||
const isInitialSetup = !configs?.organizationCreated;
|
||||
|
||||
return (
|
||||
<div className={pageLayout.container}>
|
||||
|
@ -44,26 +44,40 @@ function Organizations({ tab }: Props) {
|
|||
<PageMeta titleKey="organizations.page_title" />
|
||||
<div className={pageLayout.headline}>
|
||||
<CardTitle title="organizations.title" subtitle="organizations.subtitle" />
|
||||
<Button
|
||||
icon={<Plus />}
|
||||
type="primary"
|
||||
size="large"
|
||||
title="organizations.create_organization"
|
||||
onClick={() => {
|
||||
navigate(configs?.organizationCreated ? createPathname : organizationGuidePathname);
|
||||
}}
|
||||
/>
|
||||
{!isInitialSetup && (
|
||||
<Button
|
||||
icon={<Plus />}
|
||||
type="primary"
|
||||
size="large"
|
||||
title="organizations.create_organization"
|
||||
onClick={() => {
|
||||
navigate(createPathname);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<TabNav className={styles.tabs}>
|
||||
<TabNavItem href="/organizations" isActive={!tab}>
|
||||
{t('organizations.title')}
|
||||
</TabNavItem>
|
||||
<TabNavItem href={joinPath('/organizations', tabs.settings)} isActive={tab === 'settings'}>
|
||||
{t('general.settings_nav')}
|
||||
</TabNavItem>
|
||||
</TabNav>
|
||||
{!tab && <OrganizationsTable />}
|
||||
{tab === 'settings' && <Settings />}
|
||||
{isInitialSetup && (
|
||||
<Card className={styles.emptyCardContainer}>
|
||||
<EmptyDataPlaceholder />
|
||||
</Card>
|
||||
)}
|
||||
{!isInitialSetup && (
|
||||
<>
|
||||
<TabNav className={styles.tabs}>
|
||||
<TabNavItem href="/organizations" isActive={!tab}>
|
||||
{t('organizations.title')}
|
||||
</TabNavItem>
|
||||
<TabNavItem
|
||||
href={joinPath('/organizations', tabs.settings)}
|
||||
isActive={tab === 'settings'}
|
||||
>
|
||||
{t('general.settings_nav')}
|
||||
</TabNavItem>
|
||||
</TabNav>
|
||||
{!tab && <OrganizationsTable />}
|
||||
{tab === 'settings' && <Settings />}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -6,6 +6,10 @@ const organization = {
|
|||
organization_id: 'Organization ID',
|
||||
members: 'Members',
|
||||
create_organization: 'Create organization',
|
||||
setup_organization: 'Set up your organization',
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
organization_name_placeholder: 'My organization',
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
organization_permission: 'Organization permission',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
|
@ -13,6 +13,13 @@ const organizations = {
|
|||
/** UNTRANSLATED */
|
||||
create_organization: 'Create organization',
|
||||
/** UNTRANSLATED */
|
||||
setup_organization: 'Set up your organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_title: 'Organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_list_placeholder_text:
|
||||
'Organization is usually used in SaaS or SaaS-like multi-tenancy apps. The Organizations feature allows your B2B customers to better manage their partners and customers, and to customize the ways that end-users access their applications.',
|
||||
/** UNTRANSLATED */
|
||||
organization_name_placeholder: 'My organization',
|
||||
/** UNTRANSLATED */
|
||||
organization_description_placeholder: 'A brief description of the organization.',
|
||||
|
|
Loading…
Add table
Reference in a new issue