Skip to content

Commit

Permalink
Add some mobile cloud nav icons
Browse files Browse the repository at this point in the history
  • Loading branch information
@jaclarke
jaclarke committed Sep 10, 2024
1 parent 3e139df commit 6cd1f2e
Showing 1 changed file with 136 additions and 0 deletions.
136 changes: 136 additions & 0 deletions shared/studio/icons/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -441,6 +441,142 @@ export function TabSettingsIcon(props: ActiveItem) {
);
}

export function TabBillingIcon(props: ActiveItem) {
return (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3 4C3 2.89543 3.89543 2 5 2H19C20.1046 2 21 2.89543 21 4V19.5858C21 20.1162 20.7893 20.6249 20.4142 21L19.4142 22C18.6332 22.781 17.3668 22.781 16.5858 22L16 21.4142L15.4142 22C14.6332 22.781 13.3668 22.781 12.5858 22L12 21.4142L11.4142 22C10.6332 22.781 9.36683 22.781 8.58579 22L8 21.4142L7.41421 22C6.63316 22.781 5.36683 22.781 4.58579 22L3.58579 21C3.21071 20.6249 3 20.1162 3 19.5858V4ZM19 4H5V19.5858L6 20.5858L6.58579 20C7.36683 19.219 8.63316 19.219 9.41421 20L10 20.5858L10.5858 20C11.3668 19.219 12.6332 19.219 13.4142 20L14 20.5858L14.5858 20C15.3668 19.219 16.6332 19.219 17.4142 20L18 20.5858L19 19.5858V4Z"
fill={props?.active ? activeColor1 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M12 5C12.5523 5 13 5.44772 13 6V6.10996C13.8451 6.29942 14.5982 6.72607 15.143 7.33048C15.5128 7.74071 15.48 8.37303 15.0697 8.74279C14.6595 9.11256 14.0272 9.07975 13.6574 8.66952C13.3152 8.28985 12.7222 8 12 8C11.3758 8 11.0018 8.18513 10.7966 8.36927C10.5887 8.5558 10.5 8.78579 10.5 9C10.5 9.3248 10.5765 9.57346 10.7593 9.78671C10.9554 10.0155 11.3665 10.3109 12.2425 10.5299C13.3665 10.8109 14.2054 11.2655 14.7593 11.9117C15.3265 12.5735 15.5 13.3248 15.5 14C15.5 15.3732 14.5351 16.537 13 16.8902V17C13 17.5523 12.5523 18 12 18C11.4477 18 11 17.5523 11 17V16.89C10.1549 16.7006 9.40177 16.2739 8.85699 15.6695C8.48722 15.2593 8.52003 14.627 8.93026 14.2572C9.34049 13.8874 9.97281 13.9202 10.3426 14.3305C10.6848 14.7101 11.2778 15 12 15C12.6242 15 12.9982 14.8149 13.2034 14.6307C13.4113 14.4442 13.5 14.2142 13.5 14C13.5 13.6752 13.4235 13.4265 13.2407 13.2133C13.0446 12.9845 12.6335 12.6891 11.7575 12.4701C10.6335 12.1891 9.79461 11.7345 9.24074 11.0883C8.67353 10.4265 8.5 9.6752 8.5 9C8.5 7.62682 9.46489 6.463 11 6.10983V6C11 5.44772 11.4477 5 12 5Z"
fill={props?.active ? activeColor3 : undefined}
/>
</svg>
);
}

export function TabLogsIcon(props: ActiveItem) {
return (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3 5C3 4.44772 3.44772 4 4 4H8C8.55228 4 9 4.44772 9 5C9 5.55228 8.55228 6 8 6H4C3.44772 6 3 5.55228 3 5Z"
fill={props?.active ? activeColor4 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M11 5C11 4.44772 11.4477 4 12 4H20C20.5523 4 21 4.44772 21 5C21 5.55228 20.5523 6 20 6H12C11.4477 6 11 5.55228 11 5Z"
fill={props?.active ? activeColor4 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M11 15C11 14.4477 11.4477 14 12 14H20C20.5523 14 21 14.4477 21 15C21 15.5523 20.5523 16 20 16H12C11.4477 16 11 15.5523 11 15Z"
fill={props?.active ? activeColor1 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3 15C3 14.4477 3.44772 14 4 14H8C8.55228 14 9 14.4477 9 15C9 15.5523 8.55228 16 8 16H4C3.44772 16 3 15.5523 3 15Z"
fill={props?.active ? activeColor1 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M11 10C11 9.44772 11.4477 9 12 9H20C20.5523 9 21 9.44772 21 10C21 10.5523 20.5523 11 20 11H12C11.4477 11 11 10.5523 11 10Z"
fill={props?.active ? activeColor2 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3 10C3 9.44772 3.44772 9 4 9H8C8.55228 9 9 9.44772 9 10C9 10.5523 8.55228 11 8 11H4C3.44772 11 3 10.5523 3 10Z"
fill={props?.active ? activeColor2 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M11 20C11 19.4477 11.4477 19 12 19H20C20.5523 19 21 19.4477 21 20C21 20.5523 20.5523 21 20 21H12C11.4477 21 11 20.5523 11 20Z"
fill={props?.active ? activeColor3 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3 20C3 19.4477 3.44772 19 4 19H8C8.55228 19 9 19.4477 9 20C9 20.5523 8.55228 21 8 21H4C3.44772 21 3 20.5523 3 20Z"
fill={props?.active ? activeColor3 : undefined}
/>
</svg>
);
}

export function TabBackupsIcon(props: ActiveItem) {
return (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M5.03217 5.5C5.06523 5.53846 5.12325 5.59519 5.22292 5.66882C5.50289 5.87567 5.97193 6.10407 6.64142 6.31329C7.9685 6.728 9.86323 7 12 7C14.1368 7 16.0315 6.728 17.3586 6.31329C18.0281 6.10407 18.4971 5.87567 18.7771 5.66882C18.8767 5.59519 18.9348 5.53846 18.9678 5.5C18.9348 5.46154 18.8767 5.40481 18.7771 5.33118C18.4971 5.12433 18.0281 4.89593 17.3586 4.68671C16.0315 4.272 14.1368 4 12 4C9.86323 4 7.9685 4.272 6.64142 4.68671C5.97193 4.89593 5.50289 5.12433 5.22292 5.33118C5.12325 5.40481 5.06523 5.46154 5.03217 5.5ZM19 7.82988C18.6756 7.97673 18.3239 8.10702 17.9551 8.22225C16.3868 8.71236 14.2815 9 12 9C9.71849 9 7.61323 8.71236 6.04487 8.22225C5.67614 8.10702 5.32441 7.97673 5 7.82988V11.4572C5.01996 11.4893 5.0819 11.569 5.25211 11.69C5.55921 11.9083 6.06788 12.1447 6.78379 12.3566C7.31336 12.5133 7.61562 13.0697 7.45889 13.5993C7.30216 14.1288 6.74579 14.4311 6.21621 14.2744C5.78315 14.1462 5.37285 13.9986 5 13.8299V17.4574C5.01915 17.4879 5.07545 17.5599 5.22292 17.6688C5.50289 17.8757 5.97193 18.1041 6.64142 18.3133C7.9685 18.728 9.86323 19 12 19C12.5523 19 13 19.4477 13 20C13 20.5523 12.5523 21 12 21C9.71849 21 7.61323 20.7124 6.04487 20.2222C5.26665 19.9791 4.56412 19.6687 4.03444 19.2774C3.52434 18.9005 3 18.3114 3 17.5V5.5C3 4.68858 3.52434 4.09948 4.03444 3.7226C4.56412 3.33126 5.26665 3.02095 6.04487 2.77775C7.61323 2.28764 9.71849 2 12 2C14.2815 2 16.3868 2.28764 17.9551 2.77775C18.7334 3.02095 19.4359 3.33126 19.9656 3.7226C20.4757 4.09948 21 4.68858 21 5.5V8.5C21 9.05228 20.5523 9.5 20 9.5C19.4477 9.5 19 9.05228 19 8.5V7.82988Z"
fill={props?.active ? activeColor1 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M10 11C10.5523 11 11 11.4477 11 12V13.5374L11.7831 12.7321L11.8 12.7152C12.8812 11.6552 14.3651 11 16 11C19.3137 11 22 13.6863 22 17C22 20.3137 19.3137 23 16 23C15.4477 23 15 22.5523 15 22C15 21.4477 15.4477 21 16 21C18.2091 21 20 19.2091 20 17C20 14.7909 18.2091 13 16 13C14.9135 13 13.9299 13.4319 13.2081 14.1355L12.3674 15H14C14.5523 15 15 15.4477 15 16C15 16.5523 14.5523 17 14 17H10C9.44772 17 9 16.5523 9 16V12C9 11.4477 9.44772 11 10 11Z"
fill={props?.active ? activeColor3 : undefined}
/>
</svg>
);
}

export function TabIntegrationsIcon(props: ActiveItem) {
return (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M12.2232 4.46172C13.1984 3.51454 14.5025 2.98823 15.8589 3.0002C17.2236 3.01224 18.526 3.56818 19.4864 4.54335C20.4463 5.51803 20.9881 6.83339 20.9999 8.20533C21.0116 9.57726 20.4924 10.9018 19.5495 11.8931L19.5374 11.9056L17.0257 14.456C17.0257 14.456 17.0258 14.4559 17.0257 14.456C16.5007 14.9892 15.8678 15.4027 15.1697 15.6671C14.4715 15.9316 13.7249 16.0406 12.9808 15.9865C12.2367 15.9324 11.5134 15.7164 10.8601 15.354C10.2068 14.9916 9.63917 14.4915 9.19494 13.8884C8.86738 13.4438 8.9623 12.8178 9.40696 12.4902C9.85162 12.1626 10.4776 12.2576 10.8052 12.7022C11.0801 13.0754 11.43 13.383 11.8303 13.6051C12.2306 13.8272 12.6724 13.9588 13.1258 13.9918C13.5792 14.0247 14.0346 13.9584 14.4613 13.7968C14.888 13.6351 15.2767 13.3818 15.6005 13.0529L18.1059 10.5088C18.6847 9.89731 19.0073 9.07687 18.9999 8.22245C18.9926 7.36528 18.6539 6.54832 18.0614 5.94672C17.4694 5.34562 16.6718 5.00745 15.8413 5.00012C15.0107 4.99279 14.2076 5.31682 13.6056 5.90722C13.5942 5.91837 13.5826 5.92925 13.5707 5.93985L12.6654 6.74659C12.253 7.11402 11.6209 7.07762 11.2535 6.66529C10.886 6.25296 10.9224 5.62084 11.3348 5.25341L12.2232 4.46172Z"
fill={props?.active ? activeColor3 : undefined}
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M8.83035 8.33292C9.52857 8.06845 10.2752 7.95938 11.0193 8.01349C11.7634 8.06761 12.4867 8.28356 13.14 8.64599C13.7933 9.0084 14.3609 9.50853 14.8051 10.1116C15.1327 10.5562 15.0378 11.1822 14.5931 11.5098C14.1484 11.8374 13.5224 11.7424 13.1949 11.2978C12.92 10.9246 12.5701 10.617 12.1698 10.3949C11.7695 10.1728 11.3277 10.0412 10.8742 10.0082C10.4208 9.97525 9.96545 10.0416 9.53878 10.2032C9.11207 10.3649 8.72338 10.6182 8.39959 10.9471L8.39946 10.9473L5.89415 13.4912C5.3154 14.1027 4.99281 14.9231 5.00012 15.7776C5.00746 16.6347 5.34617 17.4517 5.93864 18.0533C6.53063 18.6544 7.32824 18.9925 8.1588 18.9999C8.98935 19.0072 9.79247 18.6832 10.3945 18.0928C10.4059 18.0816 10.4175 18.0708 10.4294 18.0602L11.3347 17.2534C11.747 16.886 12.3792 16.9224 12.7466 17.3347C13.114 17.747 13.0776 18.3792 12.6653 18.7466L11.7768 19.5383C10.8017 20.4855 9.49754 21.0118 8.14116 20.9998C6.77642 20.9878 5.47405 20.4318 4.51367 19.4566C3.55377 18.482 3.01194 17.1666 3.00019 15.7947C2.98845 14.4227 3.50769 13.0982 4.45059 12.1069L4.46267 12.0944L6.97436 9.54403C6.9744 9.54399 6.97444 9.54394 6.97449 9.5439C7.49947 9.01068 8.13223 8.59734 8.83035 8.33292Z"
fill={props?.active ? activeColor1 : undefined}
/>
</svg>
);
}

export function ThemeSwitcherIcon() {
return (
<svg
Expand Down

0 comments on commit 6cd1f2e

Please sign in to comment.