mirror of
https://github.com/sourcegraph/sourcegraph.git
synced 2026-02-06 14:51:44 +00:00
Improved Cody header logo and layout details (#51348)
Adds style fixes to the header of cody.  **Changes:** - Replaces logo with new version with better kerning and spacings (thx @toolmantim) - Adds a muted Sourcegraph logo in order to keep our brand present - Tones down "experimental badge" - Aligns the header with the title bar of the sidebar (now uses 20px padding, what the title bar also uses) ## Test plan Tested different color schemes and themes, seems to be somewhat consistent no matter the theme chosen by the user. <img width="609" alt="Screenshot 2023-05-02 at 12 04 58" src="https://user-images.githubusercontent.com/7814431/235650023-d1d608fa-a2a9-45ca-9f8a-57e8f91fa1c8.png"> <img width="565" alt="Screenshot 2023-05-02 at 12 05 09" src="https://user-images.githubusercontent.com/7814431/235650090-920aa54a-0d45-4b6a-952e-6e245e95c74b.png"> Some issues with the SG logo in more aggressive Themes, but the Cody logo works in any theme it seems <!-- All pull requests REQUIRE a test plan: https://docs.sourcegraph.com/dev/background-information/testing_principles --> --------- Co-authored-by: Tim Lucas <t@toolmantim.com> Co-authored-by: Beatrix <beatrix@sourcegraph.com>
This commit is contained in:
Daniel Marques
GitHub
parent
afdb818ec3
commit
3ee30bb29c
@ -3,33 +3,47 @@ import React from 'react'
|
||||
export const CodyColoredSvg = React.memo<{ className?: string }>(function CodySvg({ className }) {
|
||||
return (
|
||||
<svg
|
||||
version="1.0"
|
||||
width="81"
|
||||
height="24"
|
||||
viewBox="0 0 63 18"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="30"
|
||||
height="30"
|
||||
viewBox="0 0 128 128"
|
||||
className={className}
|
||||
>
|
||||
<g transform="translate(0,128) scale(0.100000,-0.100000)">
|
||||
<path
|
||||
fill="#FF5543"
|
||||
d="M832 1126 c-52 -28 -62 -61 -62 -199 0 -150 11 -186 67 -212 48 -23
|
||||
99 -14 138 25 l30 30 3 135 c4 151 -8 194 -59 220 -34 18 -86 19 -117 1z"
|
||||
/>
|
||||
<path
|
||||
fill="#A112FF"
|
||||
d="M219 967 c-45 -30 -63 -83 -46 -134 7 -23 25 -46 46 -60 31 -21 45
|
||||
-23 163 -23 175 0 218 24 218 120 0 96 -43 120 -218 120 -118 0 -132 -2 -163
|
||||
-23z"
|
||||
/>
|
||||
<path
|
||||
d="M977 503 c-40 -38 -96 -80 -123 -95 -185 -100 -409 -68 -569 83 -56
|
||||
52 -82 63 -124 54 -50 -11 -81 -51 -81 -104 0 -44 3 -49 73 -116 137 -132 305
|
||||
-192 511 -182 186 9 308 62 446 193 83 80 85 83 85 129 0 40 -5 51 -33 76 -24
|
||||
22 -42 29 -72 29 -36 0 -48 -8 -113 -67z"
|
||||
fill="#00CBEC"
|
||||
/>
|
||||
</g>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M14.4161 0.0634765C15.4025 0.0634765 16.2021 0.858014 16.2021 1.83812L16.2021 5.89446C16.2021 6.87457 15.4025 7.66911 14.4161 7.66911C13.4297 7.66911 12.63 6.87457 12.63 5.89446L12.63 1.83812C12.63 0.858013 13.4297 0.0634765 14.4161 0.0634765Z"
|
||||
fill="#FF5543"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M1.14795 4.6267C1.14795 3.64659 1.94759 2.85205 2.934 2.85205L7.01641 2.85205C8.00281 2.85205 8.80246 3.64659 8.80246 4.6267C8.80246 5.60681 8.00281 6.40135 7.01641 6.40135L2.934 6.40135C1.94759 6.40135 1.14795 5.60681 1.14795 4.6267Z"
|
||||
fill="#A112FF"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M3.20762 11.0311C2.61388 10.2554 1.50038 10.1002 0.714526 10.6858C-0.0746015 11.2739 -0.23453 12.3863 0.357315 13.1704L1.78616 12.1056C0.357315 13.1704 0.357817 13.171 0.358329 13.1717L0.359407 13.1731L0.361758 13.1762L0.367242 13.1834C0.371245 13.1886 0.375942 13.1947 0.381334 13.2016C0.392118 13.2155 0.405686 13.2327 0.422039 13.253C0.454734 13.2937 0.498626 13.347 0.553708 13.411C0.663773 13.539 0.819139 13.7107 1.0198 13.9113C1.42014 14.3114 2.00698 14.8327 2.78058 15.3513C4.33335 16.3923 6.65256 17.4295 9.69582 17.4295C12.7391 17.4295 15.0583 16.3923 16.6111 15.3513C17.3846 14.8327 17.9715 14.3114 18.3718 13.9113C18.5725 13.7107 18.7279 13.539 18.8379 13.411C18.893 13.347 18.9369 13.2937 18.9696 13.253C18.9859 13.2327 18.9995 13.2155 19.0103 13.2016C19.0157 13.1947 19.0204 13.1886 19.0244 13.1834L19.0299 13.1762L19.0322 13.1731L19.0333 13.1717C19.0338 13.171 19.0343 13.1704 17.6055 12.1056L19.0343 13.1704C19.6262 12.3863 19.4662 11.2739 18.6771 10.6858C17.8912 10.1002 16.7778 10.2554 16.184 11.0311C16.183 11.0323 16.1812 11.0346 16.1786 11.0378C16.1695 11.0491 16.1507 11.0721 16.1224 11.1051C16.0655 11.1713 15.9707 11.2769 15.8384 11.409C15.573 11.6744 15.1632 12.0404 14.6132 12.4091C13.5188 13.1428 11.8831 13.8802 9.69582 13.8802C7.50849 13.8802 5.87287 13.1428 4.77846 12.4091C4.22846 12.0404 3.81863 11.6744 3.55318 11.409C3.42095 11.2769 3.32615 11.1713 3.26927 11.1051C3.24088 11.0721 3.22211 11.0491 3.213 11.0378C3.21042 11.0346 3.20863 11.0323 3.20762 11.0311ZM16.1787 11.038L16.1785 11.0383L16.1776 11.0395C16.1771 11.0401 16.1766 11.0408 17.5594 12.0712L16.1766 11.0408C16.1773 11.0399 16.178 11.0389 16.1787 11.038Z"
|
||||
fill="#00CBEC"
|
||||
/>
|
||||
<path
|
||||
d="M29.1188 14.2986C28.0727 14.2986 27.1223 14.0514 26.2675 13.557C25.4128 13.0627 24.7302 12.3401 24.2199 11.3894C23.7224 10.4261 23.4736 9.25986 23.4736 7.89085C23.4736 6.53451 23.7288 5.37465 24.2391 4.41127C24.7621 3.43522 25.4574 2.69367 26.3249 2.18663C27.1924 1.66691 28.1493 1.40705 29.1954 1.40705C29.9863 1.40705 30.688 1.5655 31.3004 1.8824C31.9127 2.1993 32.4166 2.56691 32.8121 2.98522L31.6257 4.41127C31.3067 4.0817 30.9495 3.82184 30.5541 3.6317C30.1713 3.42888 29.7376 3.32747 29.2528 3.32747C28.5766 3.32747 27.9707 3.51127 27.4348 3.87888C26.9118 4.23381 26.4972 4.74719 26.191 5.41902C25.8976 6.09085 25.7508 6.89578 25.7508 7.83381C25.7508 9.25353 26.0634 10.369 26.6885 11.1803C27.3136 11.9789 28.1493 12.3782 29.1954 12.3782C29.7567 12.3782 30.2543 12.2641 30.688 12.0359C31.1218 11.7951 31.5172 11.4845 31.8745 11.1042L33.0609 12.4923C32.5506 13.0754 31.9638 13.5254 31.3004 13.8423C30.6497 14.1465 29.9226 14.2986 29.1188 14.2986Z"
|
||||
fill="var(--vscode-foreground)"
|
||||
/>
|
||||
<path
|
||||
d="M38.1831 14.2986C37.4049 14.2986 36.6778 14.1085 36.0016 13.7282C35.3255 13.3352 34.7769 12.7775 34.3559 12.0549C33.9349 11.3197 33.7244 10.4387 33.7244 9.41198C33.7244 8.37254 33.9349 7.49155 34.3559 6.76902C34.7769 6.03381 35.3255 5.47606 36.0016 5.09578C36.6778 4.70282 37.4049 4.50634 38.1831 4.50634C38.9741 4.50634 39.7077 4.70282 40.3838 5.09578C41.06 5.47606 41.6085 6.03381 42.0295 6.76902C42.4505 7.49155 42.661 8.37254 42.661 9.41198C42.661 10.4387 42.4505 11.3197 42.0295 12.0549C41.6085 12.7775 41.06 13.3352 40.3838 13.7282C39.7077 14.1085 38.9741 14.2986 38.1831 14.2986ZM38.1831 12.5113C38.872 12.5113 39.4142 12.2261 39.8097 11.6556C40.2052 11.0852 40.403 10.3373 40.403 9.41198C40.403 8.47395 40.2052 7.71972 39.8097 7.1493C39.4142 6.57888 38.872 6.29367 38.1831 6.29367C37.4942 6.29367 36.952 6.57888 36.5566 7.1493C36.1738 7.71972 35.9825 8.47395 35.9825 9.41198C35.9825 10.3373 36.1738 11.0852 36.5566 11.6556C36.952 12.2261 37.4942 12.5113 38.1831 12.5113Z"
|
||||
fill="var(--vscode-foreground)"
|
||||
/>
|
||||
<path
|
||||
d="M47.5566 14.2986C46.3829 14.2986 45.4453 13.8676 44.7436 13.0056C44.0419 12.1437 43.6911 10.9458 43.6911 9.41198C43.6911 8.39789 43.8761 7.52324 44.246 6.78803C44.6288 6.05282 45.1263 5.48874 45.7387 5.09578C46.351 4.70282 46.9953 4.50634 47.6714 4.50634C48.2073 4.50634 48.6601 4.60141 49.0301 4.79155C49.4128 4.96902 49.7828 5.2162 50.14 5.5331L50.0635 4.03099V0.646484H52.2641V14.0704H50.4462L50.2931 13.0627H50.2166C49.8721 13.4049 49.4703 13.6965 49.011 13.9373C48.5517 14.1782 48.0669 14.2986 47.5566 14.2986ZM48.0924 12.4923C48.7941 12.4923 49.4511 12.1437 50.0635 11.4465V7.09226C49.7445 6.80071 49.4256 6.59789 49.1067 6.48381C48.7877 6.36972 48.4688 6.31268 48.1498 6.31268C47.5502 6.31268 47.0336 6.58522 46.5998 7.13029C46.1788 7.66268 45.9683 8.41691 45.9683 9.39296C45.9683 10.3944 46.1533 11.1613 46.5233 11.6937C46.8932 12.2261 47.4163 12.4923 48.0924 12.4923Z"
|
||||
fill="var(--vscode-foreground)"
|
||||
/>
|
||||
<path
|
||||
d="M55.1241 17.9113C54.869 17.9113 54.6457 17.8923 54.4544 17.8542C54.263 17.8162 54.078 17.7718 53.8994 17.7211L54.3013 16.0099C54.3906 16.0352 54.4926 16.0606 54.6074 16.0859C54.735 16.1239 54.8562 16.143 54.971 16.143C55.4686 16.143 55.8641 15.9909 56.1575 15.6866C56.4637 15.3951 56.6933 15.0148 56.8464 14.5458L57.0186 13.9563L53.3253 4.73451H55.5643L57.1908 9.31691C57.3312 9.72254 57.4651 10.1535 57.5927 10.6099C57.733 11.0535 57.8734 11.4972 58.0137 11.9409H58.0902C58.2051 11.5099 58.3199 11.0725 58.4347 10.6289C58.5623 10.1725 58.6835 9.73522 58.7983 9.31691L60.2144 4.73451H62.3385L58.9322 14.4887C58.5368 15.5409 58.0583 16.3711 57.497 16.9796C56.9357 17.6007 56.1447 17.9113 55.1241 17.9113Z"
|
||||
fill="var(--vscode-foreground)"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
})
|
||||
@ -65,35 +79,95 @@ export const CodySvg = React.memo<{ className?: string }>(function CodySvg({ cla
|
||||
)
|
||||
})
|
||||
|
||||
export const ResetSvg = React.memo(() => (
|
||||
<div className="header-container-right">
|
||||
<div className="reset-conversation" title="Start a new conversation with Cody">
|
||||
<ResetIcon />
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
export const SubmitSvg = React.memo<{ className?: string }>(function CodySvg({ className }) {
|
||||
return (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="var(--vscode-sideBarTitle-foreground)"
|
||||
className={className}
|
||||
>
|
||||
<path d="m21.426 11.095-17-8A1 1 0 0 0 3.03 4.242l1.212 4.849L12 12l-7.758 2.909-1.212 4.849a.998.998 0 0 0 1.396 1.147l17-8a1 1 0 0 0 0-1.81z" />
|
||||
</svg>
|
||||
)
|
||||
})
|
||||
|
||||
export const ResetIcon = React.memo(() => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="12"
|
||||
height="12"
|
||||
viewBox="0 0 24 24"
|
||||
fill="var(--vscode-sideBarTitle-foreground)"
|
||||
>
|
||||
<path d="M12 16c1.671 0 3-1.331 3-3s-1.329-3-3-3-3 1.331-3 3 1.329 3 3 3z" />
|
||||
<path d="M20.817 11.186a8.94 8.94 0 0 0-1.355-3.219 9.053 9.053 0 0 0-2.43-2.43 8.95 8.95 0 0 0-3.219-1.355 9.028 9.028 0 0 0-1.838-.18V2L8 5l3.975 3V6.002c.484-.002.968.044 1.435.14a6.961 6.961 0 0 1 2.502 1.053 7.005 7.005 0 0 1 1.892 1.892A6.967 6.967 0 0 1 19 13a7.032 7.032 0 0 1-.55 2.725 7.11 7.11 0 0 1-.644 1.188 7.2 7.2 0 0 1-.858 1.039 7.028 7.028 0 0 1-3.536 1.907 7.13 7.13 0 0 1-2.822 0 6.961 6.961 0 0 1-2.503-1.054 7.002 7.002 0 0 1-1.89-1.89A6.996 6.996 0 0 1 5 13H3a9.02 9.02 0 0 0 1.539 5.034 9.096 9.096 0 0 0 2.428 2.428A8.95 8.95 0 0 0 12 22a9.09 9.09 0 0 0 1.814-.183 9.014 9.014 0 0 0 3.218-1.355 8.886 8.886 0 0 0 1.331-1.099 9.228 9.228 0 0 0 1.1-1.332A8.952 8.952 0 0 0 21 13a9.09 9.09 0 0 0-.183-1.814z" />
|
||||
</svg>
|
||||
))
|
||||
|
||||
export const SubmitSvg = React.memo(() => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="var(--vscode-sideBarTitle-foreground)"
|
||||
>
|
||||
<path d="m21.426 11.095-17-8A1 1 0 0 0 3.03 4.242l1.212 4.849L12 12l-7.758 2.909-1.212 4.849a.998.998 0 0 0 1.396 1.147l17-8a1 1 0 0 0 0-1.81z" />
|
||||
</svg>
|
||||
))
|
||||
export const SourcegraphLogoMuted = React.memo<{ className?: string }>(function CodySvg({ className }) {
|
||||
return (
|
||||
<svg
|
||||
width="102"
|
||||
height="18"
|
||||
viewBox="0 0 102 18"
|
||||
className={className}
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M13.1432 2.87926C13.3805 2.66701 13.6578 2.53826 13.9419 2.48259C14.5234 2.37124 15.1483 2.57654 15.5593 3.08108C16.1742 3.83267 16.0873 4.96006 15.3688 5.60031L12.8291 7.85509L10.9643 7.16613L10.2692 6.90864L9.09961 6.47717L10.0453 5.63858L10.6068 5.141L13.1465 2.88622L13.1432 2.87926Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M4.64515 15.1204C4.40788 15.3326 4.13051 15.4614 3.84646 15.517C3.26498 15.6284 2.64007 15.4231 2.22902 14.9185C1.61413 14.1669 1.70102 13.0396 2.41951 12.3993L4.95928 10.1445L6.824 10.8335L7.5191 11.091L8.68873 11.5225L7.743 12.361L7.18158 12.8586L4.64181 15.1134L4.64515 15.1204Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M5.92828 2.11034C5.75784 1.13954 6.37274 0.210483 7.30176 0.029544C8.23412 -0.147916 9.12638 0.492331 9.30016 1.45966L9.90502 4.87662L8.39787 6.21627L6.53314 5.52731L5.92828 2.11034Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M11.86 15.8896C12.0305 16.8604 11.4156 17.7895 10.4866 17.9704C9.5542 18.1479 8.66194 17.5076 8.48817 16.5403L7.8833 13.1233L9.39045 11.7837L11.2552 12.4727L11.86 15.8896Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M17.15 12.0481C16.9362 12.6709 16.4282 13.0955 15.8434 13.2068C15.556 13.2625 15.2552 13.2416 14.9612 13.1337L11.8165 11.9715L11.1214 11.714L9.9518 11.2826L9.25671 11.0251L7.39198 10.3361L6.69688 10.0786L5.52725 9.64717L4.83216 9.38968L1.68752 8.22749C0.795256 7.89693 0.327403 6.87741 0.644875 5.94836C0.85875 5.32551 1.3667 4.901 1.95152 4.78965C2.23892 4.73398 2.53968 4.75485 2.83376 4.86272L5.9784 6.02491L6.67349 6.2824L7.84312 6.71387L8.53822 6.97136L10.4029 7.66032L11.098 7.91781L12.2677 8.34928L12.9628 8.60677L16.1074 9.76895C16.9997 10.0995 17.4675 11.119 17.15 12.0481V12.0481Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M28.6409 11.7162C28.6409 11.3784 28.5096 11.1081 28.2798 10.9054C28.0501 10.7027 27.7547 10.5 27.3936 10.3311C27.0326 10.1622 26.6387 9.99326 26.212 9.79056C25.7853 9.62164 25.3914 9.38515 25.0304 9.11488C24.6693 8.84461 24.3739 8.50678 24.1441 8.10137C23.9144 7.69596 23.7831 7.18921 23.7831 6.5811C23.7831 6.04056 23.8816 5.56759 24.0457 5.19597C24.2098 4.79056 24.4724 4.48651 24.8006 4.21624C25.1288 3.94597 25.4899 3.77705 25.9494 3.64191C26.3761 3.50678 26.8684 3.43921 27.4264 3.43921C28.0501 3.43921 28.6409 3.50678 29.166 3.60813C29.6912 3.70948 30.1836 3.8784 30.5118 4.0811L29.8553 5.87164C29.6256 5.73651 29.2973 5.60137 28.8378 5.50002C28.3783 5.36488 27.9188 5.3311 27.3936 5.3311C26.9013 5.3311 26.5402 5.43245 26.2776 5.63515C26.015 5.83786 25.8838 6.10813 25.8838 6.44597C25.8838 6.75002 26.015 7.02029 26.2448 7.22299C26.4746 7.42569 26.77 7.6284 27.131 7.79732C27.4921 7.96624 27.886 8.16894 28.3126 8.33786C28.7393 8.54056 29.1332 8.74326 29.4943 9.01353C29.8553 9.2838 30.1507 9.62164 30.3805 9.99326C30.6103 10.3987 30.7415 10.8716 30.7415 11.446C30.7415 12.0203 30.6431 12.527 30.4461 12.9662C30.2492 13.4054 29.9866 13.7433 29.6584 14.0135C29.3302 14.2838 28.9035 14.5203 28.4111 14.6554C27.9188 14.7906 27.3936 14.8581 26.8028 14.8581C26.0479 14.8581 25.3586 14.7906 24.8006 14.6216C24.2098 14.4865 23.7831 14.3176 23.5205 14.1825L24.177 12.3581C24.2754 12.4257 24.4395 12.4933 24.6037 12.5608C24.7678 12.6284 24.9975 12.696 25.1945 12.7635C25.4242 12.8311 25.654 12.8649 25.9166 12.9325C26.1792 12.9662 26.4089 13 26.6715 13C27.2951 13 27.7547 12.8987 28.0829 12.6622C28.4768 12.4595 28.6409 12.1554 28.6409 11.7162Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M31.6279 10.7365C31.6279 9.41889 31.9562 8.3716 32.5798 7.66214C33.2034 6.95268 34.0896 6.58105 35.2384 6.58105C35.8621 6.58105 36.3873 6.68241 36.8139 6.88511C37.2735 7.08781 37.6345 7.35808 37.9299 7.7297C38.2253 8.10132 38.4551 8.54051 38.5864 9.04727C38.7177 9.55403 38.8161 10.1284 38.8161 10.7365C38.8161 12.054 38.4879 13.1013 37.8643 13.8108C37.2406 14.5202 36.3544 14.8919 35.2056 14.8919C34.582 14.8919 34.0568 14.7905 33.6301 14.5878C33.1706 14.3851 32.8096 14.1148 32.5141 13.7432C32.2187 13.3716 31.989 12.9324 31.8577 12.4256C31.6936 11.9189 31.6279 11.3446 31.6279 10.7365ZM33.663 10.7365C33.663 11.0743 33.6958 11.4121 33.7614 11.6824C33.8271 11.9865 33.9255 12.2229 34.024 12.4594C34.1553 12.6959 34.3194 12.8648 34.5163 12.9662C34.7133 13.1013 34.943 13.1351 35.2384 13.1351C35.7636 13.1351 36.1575 12.9324 36.3872 12.5608C36.6498 12.1892 36.7811 11.5473 36.7811 10.7365C36.7811 10.027 36.6498 9.41889 36.4201 8.9797C36.1903 8.54051 35.7964 8.30403 35.2384 8.30403C34.7461 8.30403 34.3522 8.50673 34.0896 8.87835C33.7942 9.24997 33.663 9.85808 33.663 10.7365Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M41.803 6.81763V11.2771C41.803 11.919 41.8686 12.392 42.0327 12.6622C42.164 12.9325 42.4594 13.1014 42.8861 13.1014C43.2472 13.1014 43.5754 13.0001 43.838 12.7636C44.1006 12.5271 44.2647 12.2568 44.396 11.919V6.85141H46.3654V12.3244C46.3654 12.7636 46.3982 13.169 46.431 13.5744C46.4638 13.9798 46.5295 14.3514 46.6279 14.6892H45.1181L44.757 13.5406H44.6914C44.4616 13.946 44.1334 14.2838 43.7067 14.5203C43.28 14.7906 42.7877 14.9257 42.2297 14.9257C41.8358 14.9257 41.5076 14.8582 41.1793 14.7568C40.8839 14.6555 40.6214 14.4865 40.4244 14.2501C40.2275 14.0136 40.0634 13.6757 39.9649 13.2703C39.8664 12.8649 39.8008 12.3244 39.8008 11.6825V6.81763H41.803Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M52.109 8.70949C51.7808 8.60814 51.5182 8.54057 51.2556 8.54057C50.8946 8.54057 50.5992 8.64192 50.3694 8.84463C50.1397 9.04733 49.9756 9.28382 49.8771 9.58787V14.6554H47.9077V6.8176H49.4504L49.6802 7.8649H49.7458C49.9099 7.49328 50.1397 7.18922 50.4351 6.95274C50.7305 6.71625 51.0915 6.64868 51.4854 6.64868C51.748 6.64868 52.306 6.78382 52.6014 6.91895L52.109 8.70949Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M58.5423 14.1824C58.2469 14.4189 57.8531 14.5878 57.4264 14.7229C56.9997 14.8581 56.5401 14.8919 56.0806 14.8919C55.457 14.8919 54.9646 14.7905 54.5379 14.5878C54.1113 14.3851 53.783 14.1148 53.5204 13.7432C53.2579 13.3716 53.0609 12.9324 52.9625 12.4256C52.8312 11.9189 52.7983 11.3446 52.7983 10.7365C52.7983 9.41889 53.0937 8.3716 53.6846 7.66214C54.2754 6.95268 55.0959 6.58105 56.2119 6.58105C56.7699 6.58105 57.2294 6.61484 57.5577 6.71619C57.8859 6.81754 58.2141 6.91889 58.4767 7.08781L58.0172 8.74322C57.7874 8.64187 57.5577 8.54051 57.3279 8.47295C57.0981 8.40538 56.8356 8.3716 56.5401 8.3716C55.9822 8.3716 55.5883 8.5743 55.2929 8.94592C54.9975 9.31754 54.8662 9.92565 54.8662 10.7365C54.8662 11.0743 54.899 11.3784 54.9646 11.6486C55.0303 11.9189 55.1288 12.1892 55.2929 12.3919C55.4242 12.5946 55.6211 12.7635 55.8509 12.8986C56.0806 13.0338 56.3432 13.0675 56.6386 13.0675C56.9668 13.0675 57.2622 13.0338 57.492 12.9324C57.7218 12.8311 57.9187 12.7297 58.1156 12.5946L58.5423 14.1824Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M65.534 13.9797C65.2386 14.2162 64.8119 14.4527 64.2867 14.6216C63.7615 14.7905 63.2036 14.8919 62.6127 14.8919C61.3655 14.8919 60.4793 14.5202 59.9213 13.777C59.3633 13.0338 59.0679 12.0202 59.0679 10.7365C59.0679 9.35133 59.3961 8.30403 60.0197 7.62835C60.6434 6.95268 61.5624 6.58105 62.7112 6.58105C63.1051 6.58105 63.4661 6.64862 63.8272 6.74997C64.1882 6.85132 64.5165 7.02024 64.8119 7.25673C65.1073 7.49322 65.337 7.83105 65.5012 8.23646C65.6653 8.64187 65.7637 9.14862 65.7637 9.75673C65.7637 9.99322 65.7637 10.1959 65.7309 10.4662C65.6981 10.7027 65.6653 10.9729 65.6324 11.2432H61.0372C61.0701 11.9189 61.2342 12.3919 61.5296 12.7297C61.825 13.0675 62.3173 13.2365 62.9738 13.2365C63.4005 13.2365 63.7615 13.1689 64.0898 13.0338C64.418 12.8986 64.6806 12.7635 64.8447 12.6284L65.534 13.9797ZM62.6784 8.20268C62.1532 8.20268 61.7593 8.3716 61.5296 8.67565C61.267 8.9797 61.1357 9.41889 61.0701 9.95943H63.8928C63.9257 9.38511 63.86 8.94592 63.6303 8.64187C63.4661 8.3716 63.1379 8.20268 62.6784 8.20268Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M73.4771 14.6554C73.4771 15.8041 73.1817 16.6487 72.5908 17.1892C72 17.7298 71.1466 18 70.0635 18C69.3414 18 68.7506 17.9325 68.3239 17.8311C67.8972 17.7298 67.5689 17.6284 67.372 17.4933L67.7987 15.8717C68.0285 15.973 68.291 16.0744 68.6193 16.1419C68.9475 16.2095 69.3086 16.2771 69.7681 16.2771C70.4574 16.2771 70.9169 16.1081 71.1795 15.8041C71.442 15.5 71.5405 15.0608 71.5405 14.5203V14.0473H71.4749C71.1138 14.5541 70.4902 14.7906 69.5711 14.7906C68.5865 14.7906 67.8643 14.4865 67.372 13.8446C66.8797 13.2027 66.6499 12.223 66.6499 10.9054C66.6499 9.48652 66.9781 8.43922 67.6346 7.72976C68.291 7.0203 69.2429 6.64868 70.4574 6.64868C71.1138 6.64868 71.7046 6.68247 72.197 6.78382C72.6893 6.88517 73.116 6.98652 73.4442 7.12165V14.6554H73.4771ZM70.1291 13.1352C70.523 13.1352 70.8184 13.0338 71.0153 12.8649C71.2123 12.696 71.3764 12.4257 71.5077 12.0541V8.54057C71.1795 8.40544 70.7856 8.33787 70.3261 8.33787C69.8009 8.33787 69.407 8.54057 69.1444 8.91219C68.849 9.3176 68.7177 9.92571 68.7177 10.8041C68.7177 11.5811 68.849 12.1554 69.0788 12.5608C69.3086 12.9662 69.6696 13.1352 70.1291 13.1352Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M79.2209 8.70949C78.8926 8.60814 78.63 8.54057 78.3675 8.54057C78.0064 8.54057 77.711 8.64192 77.4812 8.84463C77.2515 9.04733 77.0874 9.28382 76.9889 9.58787V14.6554H75.0195V6.8176H76.5622L76.792 7.8649H76.8576C77.0217 7.49328 77.2515 7.18922 77.5469 6.95274C77.8423 6.71625 78.2034 6.64868 78.5972 6.64868C78.8598 6.64868 79.1552 6.71625 79.4834 6.8176L79.2209 8.70949Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M80.1729 7.18922C80.5668 6.98652 80.8622 6.91895 81.4202 6.8176C81.9782 6.71625 82.569 6.64868 83.1598 6.64868C83.685 6.64868 84.1445 6.71625 84.4728 6.85138C84.801 6.98652 85.0964 7.15544 85.3261 7.42571C85.5231 7.66219 85.6872 7.96625 85.7528 8.30409C85.8513 8.64192 85.8841 9.01355 85.8841 9.41895C85.8841 9.89192 85.8841 10.3311 85.8513 10.8041C85.8185 11.2771 85.8185 11.7162 85.7857 12.1892C85.7857 12.6284 85.7857 13.0676 85.8185 13.5068C85.8513 13.946 85.917 14.3176 86.0482 14.723H84.4399L84.1117 13.6419V13.6419C83.9148 13.9798 83.6194 14.25 83.2583 14.4865C82.8972 14.723 82.4377 14.8244 81.8469 14.8244C81.4859 14.8244 81.1576 14.7568 80.8951 14.6554C80.5996 14.5541 80.3699 14.3852 80.1729 14.1825C79.976 13.9798 79.8119 13.7433 79.7134 13.473C79.615 13.2027 79.5493 12.8987 79.5493 12.5271C79.5493 12.0541 79.6478 11.6487 79.8775 11.3108C80.1073 10.973 80.3699 10.7027 80.7638 10.5C81.1576 10.2973 81.6172 10.1622 82.1751 10.0608C82.7331 9.95949 83.3239 9.95949 84.0132 9.99328C84.0789 9.41895 84.0461 8.97976 83.8819 8.74328C83.7178 8.47301 83.3896 8.37165 82.8644 8.37165C82.4706 8.37165 82.0439 8.40544 81.6172 8.50679C81.1905 8.60814 80.9935 8.64192 80.7309 8.77706L80.1729 7.18922ZM82.5034 13.1014C82.8973 13.1014 83.2255 13 83.4552 12.8311C83.685 12.6622 83.8491 12.4595 83.9804 12.2568V11.2433C83.6522 11.2095 83.3568 11.2095 83.0614 11.2433C82.766 11.2771 82.5034 11.3108 82.3064 11.3784C82.1095 11.446 81.9126 11.5473 81.7813 11.6825C81.65 11.8176 81.5843 11.9865 81.5843 12.1892C81.5843 12.4933 81.6828 12.696 81.8469 12.8649C81.9782 13.0338 82.208 13.1014 82.5034 13.1014Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M87.4268 6.81769H88.871L89.1007 7.76364H89.1664C89.429 7.35823 89.7572 7.08796 90.1182 6.88526C90.4793 6.68256 90.906 6.61499 91.4311 6.61499C92.383 6.61499 93.1051 6.91904 93.5975 7.56094C94.0898 8.20283 94.3196 9.18256 94.3196 10.5677C94.3196 11.2434 94.2539 11.8515 94.0898 12.392C93.9257 12.9326 93.6959 13.4055 93.4005 13.7772C93.1051 14.1488 92.7441 14.4528 92.3174 14.6555C91.8907 14.8582 91.3983 14.9596 90.8403 14.9596C90.5121 14.9596 90.2495 14.9258 90.0526 14.892C89.8557 14.8582 89.6587 14.7569 89.429 14.6555V17.865H87.4596V6.81769H87.4268ZM90.8075 8.30418C90.4136 8.30418 90.1182 8.40553 89.8885 8.60823C89.6587 8.81094 89.4946 9.11499 89.3633 9.5204V12.7974C89.4946 12.8988 89.6587 13.0001 89.8228 13.0677C89.9869 13.1353 90.2167 13.169 90.4793 13.169C91.0373 13.169 91.464 12.9663 91.7594 12.5609C92.0548 12.1555 92.1861 11.4799 92.1861 10.5001C92.1861 9.82445 92.0876 9.28391 91.8578 8.91229C91.6609 8.50688 91.2999 8.30418 90.8075 8.30418Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
<path
|
||||
d="M100.064 14.6555V10.1961C100.064 9.55416 99.9652 9.08119 99.8011 8.81092C99.637 8.54065 99.3088 8.37173 98.8492 8.37173C98.521 8.37173 98.1928 8.47308 97.9302 8.70957C97.6348 8.94605 97.4707 9.25011 97.3722 9.62173V14.6217H95.4028V3.67578H97.3722V7.69605H97.4379C97.6676 7.35821 97.9958 7.08794 98.3241 6.88524C98.6851 6.68254 99.1446 6.58119 99.6698 6.58119C100.064 6.58119 100.392 6.64875 100.687 6.75011C100.983 6.85146 101.245 7.02038 101.442 7.25686C101.639 7.49335 101.803 7.83119 101.869 8.23659C101.935 8.642 102 9.14875 102 9.75686V14.6555H100.064V14.6555Z"
|
||||
fill="var(--checkbox-border)"
|
||||
/>
|
||||
</svg>
|
||||
)
|
||||
})
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
.outer-container {
|
||||
background-color: var(--vscode-sideBar-background);
|
||||
border-top: 1px solid var(--vscode-sideBarSectionHeader-border);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@ -45,4 +44,4 @@ button {
|
||||
border: none;
|
||||
color: var(--vscode-input-foreground);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
@ -1,40 +1,24 @@
|
||||
.header-container {
|
||||
.container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-family: var(--vscode-font-family);
|
||||
border-bottom: 1px solid var(--vscode-sideBarSectionHeader-border);
|
||||
padding: 1rem;
|
||||
padding: 12px 20px;
|
||||
color: var(--vscode-sideBarTitle-foreground);
|
||||
}
|
||||
|
||||
.header-container-left,
|
||||
.header-container-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logo {
|
||||
/* Slight optical fix to ensure it aligns with standard padding */
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
.reset-conversation {
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
.logo svg {
|
||||
/* Resize it down from 24px to 20px height (1rem) */
|
||||
transform: scale(calc(20/24));
|
||||
}
|
||||
|
||||
.header-title {
|
||||
color: var(--vscode-sideBarTitle-foreground);
|
||||
font-size: calc(var(--vscode-font-size) * 2);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 0.5rem !important;
|
||||
}
|
||||
|
||||
.header-title > span {
|
||||
margin-right: 0.5rem !important;
|
||||
}
|
||||
|
||||
.header-logo {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
width: calc(var(--vscode-font-size) * 2.5);
|
||||
height: var(--vscode-font-size);
|
||||
@media screen and (max-width: 250px) {
|
||||
.tag {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,16 +5,10 @@ import { CodyColoredSvg } from '@sourcegraph/cody-ui/src/utils/icons'
|
||||
import styles from './Header.module.css'
|
||||
|
||||
export const Header: React.FunctionComponent = () => (
|
||||
<div className={styles.headerContainer}>
|
||||
<div className={styles.headerContainerLeft}>
|
||||
<div className={styles.headerLogo}>
|
||||
<CodyColoredSvg />
|
||||
</div>
|
||||
<div className={styles.headerTitle}>
|
||||
<span className={styles.headerCody}>Cody</span>
|
||||
<VSCodeTag className={styles.tagBeta}>experimental</VSCodeTag>
|
||||
</div>
|
||||
<div className={styles.container}>
|
||||
<div className={styles.logo}>
|
||||
<CodyColoredSvg />
|
||||
</div>
|
||||
<div className={styles.headerContainerRight} />
|
||||
<VSCodeTag className={styles.tag}>experimental</VSCodeTag>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -1,14 +1,15 @@
|
||||
.tab-menu-container {
|
||||
width: 100%;
|
||||
flex-direction: row;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
padding: 0.5em 0;
|
||||
border-bottom: 1px solid var(--vscode-sideBarSectionHeader-border);
|
||||
background-color: var(--vscode-tab-inactiveBackground);
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.tab-menu-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 8px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
@ -17,21 +18,20 @@
|
||||
background-color: transparent;
|
||||
color: var(--vscode-tab-inactiveForeground);
|
||||
border: none;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.tab-btn-selected {
|
||||
.tab-btn span {
|
||||
display: inline-block;
|
||||
padding: 10px 2px;
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
||||
.tab-btn:hover {
|
||||
color: var(--vscode-tab-activeForeground);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tab-menu-group {
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
flex-direction: row;
|
||||
padding: 0px 1rem;
|
||||
}
|
||||
|
||||
.reset-conversation > svg {
|
||||
width: calc(var(--vscode-font-size) * 1.5);
|
||||
height: calc(var(--vscode-font-size) * 1.5);
|
||||
.tab-btn .tab-btn-selected {
|
||||
color: var(--vscode-tab-activeForeground);
|
||||
border-bottom-color: var(--vscode-tab-activeBorderTop);
|
||||
}
|
||||
|
||||
@ -25,12 +25,12 @@ export const NavBar: React.FunctionComponent<React.PropsWithChildren<NavBarProps
|
||||
<div className={styles.tabMenuGroup}>
|
||||
{navBarItems.map(({ title, tab }) => (
|
||||
<button key={title} onClick={() => setView(tab)} className={styles.tabBtn} type="button">
|
||||
<p className={view === tab ? styles.tabBtnSelected : ''}>{title}</p>
|
||||
<span className={view === tab ? styles.tabBtnSelected : ''}>{title}</span>
|
||||
</button>
|
||||
))}
|
||||
{devMode && (
|
||||
<button onClick={() => setView('debug')} className={styles.tabBtn} type="button">
|
||||
<p className={view === 'debug' ? styles.tabBtnSelected : ''}>Debug</p>
|
||||
<span className={view === 'debug' ? styles.tabBtnSelected : ''}>Debug</span>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user