element-plus/docs/.vitepress/vitepress/components/nav/top-navigation-example.vue

38 lines
14 KiB
Vue

<template>
<svg
width="800"
height="508"
viewBox="0 0 800 508"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M800 0H0V508H800V0Z" fill="var(--categories-c-bg)" />
<path
d="M776 16H24C19.5817 16 16 19.5817 16 24V484C16 488.418 19.5817 492 24 492H776C780.418 492 784 488.418 784 484V24C784 19.5817 780.418 16 776 16Z"
fill="var(--categories-c-page)"
/>
<path
d="M776 16H24C19.5817 16 16 19.5817 16 24V76H784V24C784 19.5817 780.418 16 776 16Z"
fill="#324057"
/>
<path
d="M147.658 45.826V47.254H160.398V45.826H147.658ZM164.94 47.646C165.906 46.47 166.83 45.112 167.614 43.768L166.55 43.096C166.284 43.6 166.004 44.132 165.696 44.608L164.114 44.776C164.954 43.6 165.752 42.144 166.354 40.786L165.164 40.198C164.604 41.878 163.582 43.642 163.274 44.104C162.952 44.566 162.7 44.888 162.448 44.958C162.588 45.28 162.784 45.882 162.854 46.148C163.078 46.036 163.4 45.952 164.954 45.756C164.38 46.596 163.876 47.24 163.624 47.52C163.19 48.038 162.854 48.36 162.532 48.43C162.672 48.766 162.868 49.34 162.938 49.592C163.26 49.354 163.778 49.158 167.418 48.094C167.376 47.814 167.334 47.324 167.348 46.974L164.94 47.646ZM167.39 49.34C165.626 49.998 163.82 50.67 162.644 51.062L162.966 52.35C164.282 51.804 166.018 51.118 167.628 50.46L167.39 49.34ZM172.234 42.354C171.926 43.628 171.52 45.014 171.212 45.952H173.55C173.228 47.17 172.752 48.248 172.122 49.144C171.282 47.996 170.624 46.652 170.162 45.238C170.26 44.328 170.33 43.362 170.386 42.354H172.234ZM174.222 44.776L173.998 44.832H172.822C173.172 43.684 173.536 42.298 173.844 41.136H167.628V42.354H169.098C168.916 46.68 168.384 50.222 166.536 52.35C166.844 52.518 167.46 52.938 167.67 53.148C168.79 51.706 169.448 49.816 169.854 47.576C170.274 48.5 170.764 49.368 171.352 50.152C170.582 51.006 169.686 51.664 168.692 52.14C168.958 52.336 169.42 52.826 169.588 53.134C170.526 52.63 171.394 51.972 172.15 51.132C172.892 51.93 173.732 52.588 174.67 53.078C174.852 52.742 175.244 52.266 175.524 52.014C174.572 51.58 173.704 50.936 172.948 50.138C173.9 48.794 174.614 47.114 175.02 45.098L174.222 44.776ZM187.234 41.864V43.082H180.22V41.864H187.234ZM187.332 46.512C189.166 46.512 189.698 46.204 189.894 44.776C189.516 44.72 188.984 44.566 188.662 44.384C188.536 45.294 188.312 45.462 187.22 45.462H182.012C180.514 45.462 180.22 45.322 180.22 44.748V44.202H188.508V40.73H178.862V44.762C178.862 46.204 179.618 46.512 182.068 46.512H187.332ZM190.16 47.8H187.206V46.834H185.862V47.8H177.882V49.004H180.514L179.87 49.578C180.738 50.278 181.76 51.3 182.18 52L183.132 51.118C182.712 50.474 181.844 49.648 181.046 49.004H185.862V51.65C185.862 51.86 185.778 51.93 185.498 51.93C185.232 51.944 184.182 51.944 183.244 51.916C183.412 52.238 183.622 52.742 183.692 53.078C185.008 53.078 185.89 53.064 186.45 52.896C187.01 52.728 187.206 52.392 187.206 51.678V49.004H190.16V47.8ZM205.3 42.508H201.464L202.472 42.172C202.276 41.612 201.898 40.772 201.562 40.114L200.316 40.478C200.638 41.094 200.974 41.948 201.17 42.508H198.216V43.656H205.3V42.508ZM194.814 43.782C195.094 44.398 195.43 45.21 195.584 45.756L196.41 45.392C196.27 44.888 195.92 44.09 195.626 43.46L194.814 43.782ZM194.646 46.232V42.942H196.76V46.232H194.646ZM197.894 41.906H195.92C196.102 41.458 196.298 40.912 196.466 40.408L195.15 40.184C195.066 40.688 194.926 41.36 194.772 41.906H193.512V46.232H192.56V47.282H193.512C193.512 48.99 193.4 51.118 192.476 52.588C192.77 52.714 193.26 53.022 193.484 53.232C194.464 51.636 194.632 49.186 194.646 47.282H196.76V51.692C196.76 51.86 196.704 51.916 196.536 51.916C196.396 51.93 195.878 51.93 195.346 51.916C195.514 52.196 195.682 52.714 195.696 53.022C196.536 53.022 197.054 52.994 197.432 52.798C197.782 52.616 197.894 52.28 197.894 51.706V41.906ZM196.536 49.774C196.354 49.214 195.92 48.374 195.57 47.702L194.772 48.038C195.122 48.696 195.542 49.592 195.696 50.152L196.536 49.774ZM204.068 51.888C203.998 51.888 203.928 51.874 203.886 51.818C203.844 51.762 203.83 51.566 203.83 51.244V44.902H199.336V47.856C199.336 49.312 199.182 51.16 197.866 52.462C198.16 52.602 198.678 52.952 198.888 53.176C200.288 51.748 200.526 49.522 200.526 47.87V46.036H202.626V51.216C202.626 52.196 202.696 52.462 202.92 52.686C203.116 52.868 203.438 52.966 203.718 52.966H204.348C204.614 52.966 204.88 52.91 205.062 52.77C205.23 52.644 205.356 52.448 205.426 52.154C205.496 51.846 205.552 51.034 205.566 50.39C205.272 50.292 204.936 50.11 204.712 49.928C204.712 50.628 204.698 51.174 204.67 51.426C204.642 51.636 204.6 51.762 204.558 51.818C204.516 51.874 204.418 51.888 204.334 51.888H204.068Z"
fill="#99A9BF"
/>
<path
d="M238.658 45.826V47.254H251.398V45.826H238.658ZM255.94 47.646C256.906 46.47 257.83 45.112 258.614 43.768L257.55 43.096C257.284 43.6 257.004 44.132 256.696 44.608L255.114 44.776C255.954 43.6 256.752 42.144 257.354 40.786L256.164 40.198C255.604 41.878 254.582 43.642 254.274 44.104C253.952 44.566 253.7 44.888 253.448 44.958C253.588 45.28 253.784 45.882 253.854 46.148C254.078 46.036 254.4 45.952 255.954 45.756C255.38 46.596 254.876 47.24 254.624 47.52C254.19 48.038 253.854 48.36 253.532 48.43C253.672 48.766 253.868 49.34 253.938 49.592C254.26 49.354 254.778 49.158 258.418 48.094C258.376 47.814 258.334 47.324 258.348 46.974L255.94 47.646ZM258.39 49.34C256.626 49.998 254.82 50.67 253.644 51.062L253.966 52.35C255.282 51.804 257.018 51.118 258.628 50.46L258.39 49.34ZM263.234 42.354C262.926 43.628 262.52 45.014 262.212 45.952H264.55C264.228 47.17 263.752 48.248 263.122 49.144C262.282 47.996 261.624 46.652 261.162 45.238C261.26 44.328 261.33 43.362 261.386 42.354H263.234ZM265.222 44.776L264.998 44.832H263.822C264.172 43.684 264.536 42.298 264.844 41.136H258.628V42.354H260.098C259.916 46.68 259.384 50.222 257.536 52.35C257.844 52.518 258.46 52.938 258.67 53.148C259.79 51.706 260.448 49.816 260.854 47.576C261.274 48.5 261.764 49.368 262.352 50.152C261.582 51.006 260.686 51.664 259.692 52.14C259.958 52.336 260.42 52.826 260.588 53.134C261.526 52.63 262.394 51.972 263.15 51.132C263.892 51.93 264.732 52.588 265.67 53.078C265.852 52.742 266.244 52.266 266.524 52.014C265.572 51.58 264.704 50.936 263.948 50.138C264.9 48.794 265.614 47.114 266.02 45.098L265.222 44.776ZM278.234 41.864V43.082H271.22V41.864H278.234ZM278.332 46.512C280.166 46.512 280.698 46.204 280.894 44.776C280.516 44.72 279.984 44.566 279.662 44.384C279.536 45.294 279.312 45.462 278.22 45.462H273.012C271.514 45.462 271.22 45.322 271.22 44.748V44.202H279.508V40.73H269.862V44.762C269.862 46.204 270.618 46.512 273.068 46.512H278.332ZM281.16 47.8H278.206V46.834H276.862V47.8H268.882V49.004H271.514L270.87 49.578C271.738 50.278 272.76 51.3 273.18 52L274.132 51.118C273.712 50.474 272.844 49.648 272.046 49.004H276.862V51.65C276.862 51.86 276.778 51.93 276.498 51.93C276.232 51.944 275.182 51.944 274.244 51.916C274.412 52.238 274.622 52.742 274.692 53.078C276.008 53.078 276.89 53.064 277.45 52.896C278.01 52.728 278.206 52.392 278.206 51.678V49.004H281.16V47.8ZM296.3 42.508H292.464L293.472 42.172C293.276 41.612 292.898 40.772 292.562 40.114L291.316 40.478C291.638 41.094 291.974 41.948 292.17 42.508H289.216V43.656H296.3V42.508ZM285.814 43.782C286.094 44.398 286.43 45.21 286.584 45.756L287.41 45.392C287.27 44.888 286.92 44.09 286.626 43.46L285.814 43.782ZM285.646 46.232V42.942H287.76V46.232H285.646ZM288.894 41.906H286.92C287.102 41.458 287.298 40.912 287.466 40.408L286.15 40.184C286.066 40.688 285.926 41.36 285.772 41.906H284.512V46.232H283.56V47.282H284.512C284.512 48.99 284.4 51.118 283.476 52.588C283.77 52.714 284.26 53.022 284.484 53.232C285.464 51.636 285.632 49.186 285.646 47.282H287.76V51.692C287.76 51.86 287.704 51.916 287.536 51.916C287.396 51.93 286.878 51.93 286.346 51.916C286.514 52.196 286.682 52.714 286.696 53.022C287.536 53.022 288.054 52.994 288.432 52.798C288.782 52.616 288.894 52.28 288.894 51.706V41.906ZM287.536 49.774C287.354 49.214 286.92 48.374 286.57 47.702L285.772 48.038C286.122 48.696 286.542 49.592 286.696 50.152L287.536 49.774ZM295.068 51.888C294.998 51.888 294.928 51.874 294.886 51.818C294.844 51.762 294.83 51.566 294.83 51.244V44.902H290.336V47.856C290.336 49.312 290.182 51.16 288.866 52.462C289.16 52.602 289.678 52.952 289.888 53.176C291.288 51.748 291.526 49.522 291.526 47.87V46.036H293.626V51.216C293.626 52.196 293.696 52.462 293.92 52.686C294.116 52.868 294.438 52.966 294.718 52.966H295.348C295.614 52.966 295.88 52.91 296.062 52.77C296.23 52.644 296.356 52.448 296.426 52.154C296.496 51.846 296.552 51.034 296.566 50.39C296.272 50.292 295.936 50.11 295.712 49.928C295.712 50.628 295.698 51.174 295.67 51.426C295.642 51.636 295.6 51.762 295.558 51.818C295.516 51.874 295.418 51.888 295.334 51.888H295.068Z"
fill="#99A9BF"
/>
<path
d="M329.658 45.826V47.254H342.398V45.826H329.658ZM346.94 47.646C347.906 46.47 348.83 45.112 349.614 43.768L348.55 43.096C348.284 43.6 348.004 44.132 347.696 44.608L346.114 44.776C346.954 43.6 347.752 42.144 348.354 40.786L347.164 40.198C346.604 41.878 345.582 43.642 345.274 44.104C344.952 44.566 344.7 44.888 344.448 44.958C344.588 45.28 344.784 45.882 344.854 46.148C345.078 46.036 345.4 45.952 346.954 45.756C346.38 46.596 345.876 47.24 345.624 47.52C345.19 48.038 344.854 48.36 344.532 48.43C344.672 48.766 344.868 49.34 344.938 49.592C345.26 49.354 345.778 49.158 349.418 48.094C349.376 47.814 349.334 47.324 349.348 46.974L346.94 47.646ZM349.39 49.34C347.626 49.998 345.82 50.67 344.644 51.062L344.966 52.35C346.282 51.804 348.018 51.118 349.628 50.46L349.39 49.34ZM354.234 42.354C353.926 43.628 353.52 45.014 353.212 45.952H355.55C355.228 47.17 354.752 48.248 354.122 49.144C353.282 47.996 352.624 46.652 352.162 45.238C352.26 44.328 352.33 43.362 352.386 42.354H354.234ZM356.222 44.776L355.998 44.832H354.822C355.172 43.684 355.536 42.298 355.844 41.136H349.628V42.354H351.098C350.916 46.68 350.384 50.222 348.536 52.35C348.844 52.518 349.46 52.938 349.67 53.148C350.79 51.706 351.448 49.816 351.854 47.576C352.274 48.5 352.764 49.368 353.352 50.152C352.582 51.006 351.686 51.664 350.692 52.14C350.958 52.336 351.42 52.826 351.588 53.134C352.526 52.63 353.394 51.972 354.15 51.132C354.892 51.93 355.732 52.588 356.67 53.078C356.852 52.742 357.244 52.266 357.524 52.014C356.572 51.58 355.704 50.936 354.948 50.138C355.9 48.794 356.614 47.114 357.02 45.098L356.222 44.776ZM369.234 41.864V43.082H362.22V41.864H369.234ZM369.332 46.512C371.166 46.512 371.698 46.204 371.894 44.776C371.516 44.72 370.984 44.566 370.662 44.384C370.536 45.294 370.312 45.462 369.22 45.462H364.012C362.514 45.462 362.22 45.322 362.22 44.748V44.202H370.508V40.73H360.862V44.762C360.862 46.204 361.618 46.512 364.068 46.512H369.332ZM372.16 47.8H369.206V46.834H367.862V47.8H359.882V49.004H362.514L361.87 49.578C362.738 50.278 363.76 51.3 364.18 52L365.132 51.118C364.712 50.474 363.844 49.648 363.046 49.004H367.862V51.65C367.862 51.86 367.778 51.93 367.498 51.93C367.232 51.944 366.182 51.944 365.244 51.916C365.412 52.238 365.622 52.742 365.692 53.078C367.008 53.078 367.89 53.064 368.45 52.896C369.01 52.728 369.206 52.392 369.206 51.678V49.004H372.16V47.8ZM387.3 42.508H383.464L384.472 42.172C384.276 41.612 383.898 40.772 383.562 40.114L382.316 40.478C382.638 41.094 382.974 41.948 383.17 42.508H380.216V43.656H387.3V42.508ZM376.814 43.782C377.094 44.398 377.43 45.21 377.584 45.756L378.41 45.392C378.27 44.888 377.92 44.09 377.626 43.46L376.814 43.782ZM376.646 46.232V42.942H378.76V46.232H376.646ZM379.894 41.906H377.92C378.102 41.458 378.298 40.912 378.466 40.408L377.15 40.184C377.066 40.688 376.926 41.36 376.772 41.906H375.512V46.232H374.56V47.282H375.512C375.512 48.99 375.4 51.118 374.476 52.588C374.77 52.714 375.26 53.022 375.484 53.232C376.464 51.636 376.632 49.186 376.646 47.282H378.76V51.692C378.76 51.86 378.704 51.916 378.536 51.916C378.396 51.93 377.878 51.93 377.346 51.916C377.514 52.196 377.682 52.714 377.696 53.022C378.536 53.022 379.054 52.994 379.432 52.798C379.782 52.616 379.894 52.28 379.894 51.706V41.906ZM378.536 49.774C378.354 49.214 377.92 48.374 377.57 47.702L376.772 48.038C377.122 48.696 377.542 49.592 377.696 50.152L378.536 49.774ZM386.068 51.888C385.998 51.888 385.928 51.874 385.886 51.818C385.844 51.762 385.83 51.566 385.83 51.244V44.902H381.336V47.856C381.336 49.312 381.182 51.16 379.866 52.462C380.16 52.602 380.678 52.952 380.888 53.176C382.288 51.748 382.526 49.522 382.526 47.87V46.036H384.626V51.216C384.626 52.196 384.696 52.462 384.92 52.686C385.116 52.868 385.438 52.966 385.718 52.966H386.348C386.614 52.966 386.88 52.91 387.062 52.77C387.23 52.644 387.356 52.448 387.426 52.154C387.496 51.846 387.552 51.034 387.566 50.39C387.272 50.292 386.936 50.11 386.712 49.928C386.712 50.628 386.698 51.174 386.67 51.426C386.642 51.636 386.6 51.762 386.558 51.818C386.516 51.874 386.418 51.888 386.334 51.888H386.068Z"
fill="#99A9BF"
/>
<path d="M206 70H147V76H206V70Z" fill="#99A9BF" />
<path d="M768 92H32V476H768V92Z" fill="var(--categories-c-overlay)" />
<path
d="M41.8711 53H50.8311V50.52H44.8311V38.2H41.8711V53ZM59.5323 53.28C63.4523 53.28 66.1523 50.34 66.1523 45.54C66.1523 40.74 63.4523 37.92 59.5323 37.92C55.6123 37.92 52.9123 40.72 52.9123 45.54C52.9123 50.34 55.6123 53.28 59.5323 53.28ZM59.5323 50.72C57.3323 50.72 55.9323 48.7 55.9323 45.54C55.9323 42.36 57.3323 40.46 59.5323 40.46C61.7323 40.46 63.1323 42.36 63.1323 45.54C63.1323 48.7 61.7323 50.72 59.5323 50.72ZM76.403 53.28C78.463 53.28 80.203 52.48 81.203 51.5V44.82H75.943V47.24H78.563V50.16C78.143 50.52 77.423 50.72 76.703 50.72C73.803 50.72 72.323 48.78 72.323 45.56C72.323 42.38 74.043 40.46 76.503 40.46C77.843 40.46 78.683 41 79.403 41.7L80.983 39.82C80.023 38.84 78.543 37.92 76.403 37.92C72.463 37.92 69.303 40.78 69.303 45.66C69.303 50.6 72.363 53.28 76.403 53.28ZM91.2589 53.28C95.1789 53.28 97.8789 50.34 97.8789 45.54C97.8789 40.74 95.1789 37.92 91.2589 37.92C87.3389 37.92 84.6389 40.72 84.6389 45.54C84.6389 50.34 87.3389 53.28 91.2589 53.28ZM91.2589 50.72C89.0589 50.72 87.6589 48.7 87.6589 45.54C87.6589 42.36 89.0589 40.46 91.2589 40.46C93.4589 40.46 94.8589 42.36 94.8589 45.54C94.8589 48.7 93.4589 50.72 91.2589 50.72Z"
fill="white"
/>
</svg>
</template>