Files
mattermostest/src/renderer/components/Images/server.tsx
Devin Binnie 34b5f52f0c [MM-62232] Update loading and welcome screens, theming fixes (#3279)
* Replace images with new SVG components, replace backgrounds

* Add Denim and Onyx themes, fix associated themeing issues

* Add back elevation variables

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
2025-01-13 14:42:27 +00:00

465 lines
16 KiB
TypeScript

// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
const ServerImage = () => (
<svg
width='260'
height='147'
viewBox='0 0 260 147'
fill='none'
xmlns='http://www.w3.org/2000/svg'
>
<rect
x='0.998535'
y='58'
width='243'
height='52'
rx='3'
fill='var(--center-channel-color)'
fillOpacity='0.16'
/>
<path
d='M259.001 36.5002H160.17C160.073 36.5002 159.982 36.4483 159.934 36.364C159.885 36.2797 159.882 36.1759 159.927 36.0916C162.122 32.0314 166.12 29.2846 170.66 28.7009C170.628 28.2728 170.611 27.8707 170.611 27.475C170.611 18.1839 178.154 10.6278 187.427 10.6278C189.772 10.6278 192.042 11.1045 194.178 12.045C196.688 5.12772 203.261 0.5 210.628 0.5C218.521 0.5 225.404 5.76334 227.499 13.3454C230.846 11.2634 234.694 10.1673 238.654 10.1673C250.333 10.1673 259.834 19.6886 259.834 31.3893C259.834 33.04 259.643 34.6874 259.267 36.2862C259.238 36.4094 259.127 36.5002 258.998 36.5002H259.001Z'
fill='var(--center-channel-color)'
fillOpacity='0.16'
/>
<rect
x='42.2072'
y='25.7087'
width='166.583'
height='109.249'
rx='5.41732'
fill='var(--center-channel-bg)'
stroke='var(--center-channel-color)'
strokeWidth='5.41732'
/>
<g clipPath='url(#clip0_4284_240815)'>
<rect
width='153'
height='95'
transform='translate(48.9985 33)'
fill='var(--center-channel-bg)'
/>
<rect
opacity='0.5'
x='48.9985'
y='33'
width='45.6761'
height='98.3792'
fill='var(--button-bg)'
fillOpacity='0.16'
/>
<path
d='M64.8101 40.0273L81.4994 40.0273'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M64.8101 42.6621L74.4723 42.6621'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M99.9449 40.4665H121.026'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M53.3901 51.4463H66.5659'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<circle
cx='57.3433'
cy='41.3443'
r='4.83112'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<ellipse
cx='55.476'
cy='58.6028'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.24'
/>
<path
d='M60.4174 58.4732H85.0122'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<circle
cx='115.756'
cy='55.8377'
r='5.27031'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M125.804 55.8243H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.804 60.2299H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.418 51.4463H138.594'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<circle
cx='115.756'
cy='76.9192'
r='5.27031'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M125.804 76.9057H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.804 81.3112H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.418 72.5272H138.594'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<circle
cx='115.756'
cy='98.0008'
r='5.27031'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M125.804 97.9866H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.804 102.393H178.861'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<path
d='M125.418 93.6086H138.594'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<ellipse
cx='55.476'
cy='66.7812'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M60.4174 66.3786H79.7419'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<ellipse
cx='55.476'
cy='74.9594'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M60.4174 75.1622H87.6474'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<ellipse
cx='55.476'
cy='83.1377'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M60.4174 83.0078H85.0122'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<ellipse
cx='55.476'
cy='91.316'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M60.4174 90.9735H79.7419'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
<ellipse
cx='55.476'
cy='99.4943'
rx='2.15927'
ry='2.15927'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M60.4174 99.7576H87.6474'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeWidth='0.878386'
strokeLinecap='round'
/>
</g>
<path
d='M233.499 118L233.499 91H206.999'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeLinecap='round'
/>
<circle
cx='233.499'
cy='120.5'
r='2.5'
transform='rotate(180 233.499 120.5)'
fill='var(--center-channel-color)'
fillOpacity='0.48'
/>
<path
d='M73.164 74.5576H33.6597V90.0298H73.164V74.5576Z'
stroke='var(--center-channel-bg)'
strokeWidth='1.31879'
strokeLinecap='round'
/>
<path
opacity='0.5'
d='M58.6602 85.0711C60.195 85.0711 61.4391 83.8268 61.4391 82.2919C61.4391 80.757 60.195 79.5127 58.6602 79.5127C57.1255 79.5127 55.8813 80.757 55.8813 82.2919C55.8813 83.8268 57.1255 85.0711 58.6602 85.0711Z'
fill='var(--center-channel-bg)'
/>
<path
d='M66.5147 85.0711C68.0495 85.0711 69.2936 83.8268 69.2936 82.2919C69.2936 80.757 68.0495 79.5127 66.5147 79.5127C64.98 79.5127 63.7358 80.757 63.7358 82.2919C63.7358 83.8268 64.98 85.0711 66.5147 85.0711Z'
fill='var(--center-channel-bg)'
/>
<path
d='M50.8038 85.0711C52.3385 85.0711 53.5827 83.8268 53.5827 82.2919C53.5827 80.757 52.3385 79.5127 50.8038 79.5127C49.2691 79.5127 48.0249 80.757 48.0249 82.2919C48.0249 83.8268 49.2691 85.0711 50.8038 85.0711Z'
fill='var(--center-channel-bg)'
/>
<path
d='M16.4985 57L16.4985 84L42.9985 84'
stroke='var(--center-channel-color)'
strokeOpacity='0.24'
strokeLinecap='round'
/>
<circle
cx='16.4985'
cy='54.5'
r='2.5'
fill='var(--center-channel-color)'
fillOpacity='0.48'
/>
<rect
x='26.9985'
y='72'
width='85'
height='23'
rx='3'
fill='var(--indigo-400)'
/>
<path
opacity='0.48'
d='M107.999 76H30.9985V91H107.999V76Z'
stroke='var(--neutral-0)'
strokeLinecap='round'
/>
<path
d='M47.9985 87C49.6554 87 50.9985 85.6569 50.9985 84C50.9985 82.3431 49.6554 81 47.9985 81C46.3417 81 44.9985 82.3431 44.9985 84C44.9985 85.6569 46.3417 87 47.9985 87Z'
fill='var(--neutral-0)'
/>
<path
d='M56.9985 87C58.6554 87 59.9985 85.6569 59.9985 84C59.9985 82.3431 58.6554 81 56.9985 81C55.3417 81 53.9985 82.3431 53.9985 84C53.9985 85.6569 55.3417 87 56.9985 87Z'
fill='var(--neutral-0)'
/>
<path
opacity='0.5'
d='M38.9985 87C40.6554 87 41.9985 85.6569 41.9985 84C41.9985 82.3431 40.6554 81 38.9985 81C37.3417 81 35.9985 82.3431 35.9985 84C35.9985 85.6569 37.3417 87 38.9985 87Z'
fill='var(--neutral-0)'
/>
<rect
x='26.9985'
y='98'
width='85'
height='23'
rx='3'
fill='var(--indigo-400)'
/>
<path
opacity='0.48'
d='M107.999 102H30.9985V117H107.999V102Z'
stroke='var(--neutral-0)'
strokeLinecap='round'
/>
<path
d='M47.9985 113C49.6554 113 50.9985 111.657 50.9985 110C50.9985 108.343 49.6554 107 47.9985 107C46.3417 107 44.9985 108.343 44.9985 110C44.9985 111.657 46.3417 113 47.9985 113Z'
fill='var(--neutral-0)'
/>
<path
d='M56.9985 113C58.6554 113 59.9985 111.657 59.9985 110C59.9985 108.343 58.6554 107 56.9985 107C55.3417 107 53.9985 108.343 53.9985 110C53.9985 111.657 55.3417 113 56.9985 113Z'
fill='var(--neutral-0)'
/>
<path
opacity='0.5'
d='M38.9985 113C40.6554 113 41.9985 111.657 41.9985 110C41.9985 108.343 40.6554 107 38.9985 107C37.3417 107 35.9985 108.343 35.9985 110C35.9985 111.657 37.3417 113 38.9985 113Z'
fill='var(--neutral-0)'
/>
<rect
x='26.9985'
y='124'
width='85'
height='23'
rx='3'
fill='var(--indigo-400)'
/>
<path
opacity='0.48'
d='M107.999 128H30.9985V143H107.999V128Z'
stroke='var(--neutral-0)'
strokeLinecap='round'
/>
<path
d='M47.9985 139C49.6554 139 50.9985 137.657 50.9985 136C50.9985 134.343 49.6554 133 47.9985 133C46.3417 133 44.9985 134.343 44.9985 136C44.9985 137.657 46.3417 139 47.9985 139Z'
fill='var(--neutral-0)'
/>
<path
d='M56.9985 139C58.6554 139 59.9985 137.657 59.9985 136C59.9985 134.343 58.6554 133 56.9985 133C55.3417 133 53.9985 134.343 53.9985 136C53.9985 137.657 55.3417 139 56.9985 139Z'
fill='var(--neutral-0)'
/>
<path
opacity='0.5'
d='M38.9985 139C40.6554 139 41.9985 137.657 41.9985 136C41.9985 134.343 40.6554 133 38.9985 133C37.3417 133 35.9985 134.343 35.9985 136C35.9985 137.657 37.3417 139 38.9985 139Z'
fill='var(--neutral-0)'
/>
<rect
x='176.288'
y='58.499'
width='47.2105'
height='87'
rx='7.5'
fill='var(--center-channel-bg)'
stroke='var(--center-channel-color)'
strokeWidth='3'
/>
<path
d='M177.788 64.499C177.788 62.0137 179.802 59.999 182.288 59.999H217.498C219.983 59.999 221.998 62.0137 221.998 64.499V67.7359H177.788V64.499Z'
fill='#1C58D9'
fillOpacity='0.16'
/>
<circle
cx='188.653'
cy='107.339'
r='6.44477'
fill='var(--center-channel-color)'
fillOpacity='0.4'
/>
<path
d='M199.394 104.475H210.851'
stroke='var(--center-channel-color)'
strokeOpacity='0.48'
strokeLinecap='round'
/>
<path
d='M182.924 121.894H213.187'
stroke='var(--center-channel-color)'
strokeOpacity='0.48'
strokeLinecap='round'
/>
<path
d='M182.924 126.315H205.31'
stroke='var(--center-channel-color)'
strokeOpacity='0.48'
strokeLinecap='round'
/>
<path
d='M199.394 108.771H217.296'
stroke='var(--center-channel-color)'
strokeOpacity='0.48'
strokeLinecap='round'
/>
<path
d='M182.924 117.364H201.729'
stroke='var(--center-channel-color)'
strokeOpacity='0.48'
strokeLinecap='round'
/>
<rect
x='191.051'
y='63.3149'
width='17.6842'
height='1.10526'
rx='0.552632'
fill='var(--center-channel-color)'
/>
<defs>
<clipPath id='clip0_4284_240815'>
<rect
width='153'
height='95'
fill='white'
transform='translate(48.9985 33)'
/>
</clipPath>
</defs>
</svg>
);
export default ServerImage;