Use the new image in the app demo

microsoft · May 11, 2020 · 1c79ee9 · 1c79ee9
1 parent 9aa7c63
commit 1c79ee9
Showing 1 changed file with 14 additions and 8 deletions.
diff --git a/src/demo/web/app-demo.html b/src/demo/web/app-demo.html
@@ -87,11 +87,6 @@
 	align-items: center;
 }
 
-.cloudy > h2
-{
-	color: var(--global-color-accent-120);
-}
-
 </style>
 </head>
 <body>
@@ -108,11 +103,22 @@ <h2>Home</h2>
 <main>
 
 <div class="cloudy">
-	<svg width="194" height="156" viewBox="0 0 194 156" fill="none" xmlns="http://www.w3.org/2000/svg">
-		<path d="M106.641 39.3236C137.27 39.3236 154.645 59.5974 157.172 84.0815L157.945 84.0814C177.657 84.0814 193.636 100.019 193.636 119.679C193.636 139.339 177.657 155.277 157.945 155.277H55.3363C35.6252 155.277 19.6462 139.339 19.6462 119.679C19.6462 100.019 35.6252 84.0814 55.3366 84.0814L56.1093 84.0815C58.6511 59.4365 76.0117 39.3236 106.641 39.3236ZM106.641 51.3836C86.0458 51.3836 68.0949 68.0487 68.0949 91.068C68.0949 94.7154 64.9236 97.5775 61.2923 97.5774L54.4261 97.5771C41.8881 97.5771 31.724 107.794 31.724 120.397C31.724 133 41.8881 143.217 54.4261 143.217H158.856C171.394 143.217 181.558 133 181.558 120.397C181.558 107.794 171.394 97.5771 158.856 97.5771L151.989 97.5774C148.358 97.5775 145.187 94.7154 145.187 91.068C145.187 67.7534 127.236 51.3836 106.641 51.3836ZM23.0704 79.4101C24.2613 82.2852 23.0558 85.5551 20.3735 86.9993L19.8176 87.2631L8.64542 91.9116C5.57863 93.1819 2.06271 91.7255 0.792403 88.6588C-0.39851 85.7836 0.807044 82.5138 3.48935 81.0696L4.04523 80.8057L15.2174 76.1573C18.2842 74.887 21.8001 76.3433 23.0704 79.4101ZM85.9032 32.8102L85.6084 32.9049C81.139 34.3643 76.9852 36.2979 73.1822 38.6573C66.8593 35.9821 59.5065 35.7455 52.6598 38.5814C39.0958 44.1998 32.6546 59.7502 38.273 73.3142C38.8216 74.6387 39.4649 75.8952 40.1918 77.0792C36.5245 78.3897 33.0759 80.1647 29.9154 82.3328C29.0614 80.8693 28.2977 79.3307 27.6314 77.7221C19.5786 58.2809 28.8107 35.9927 48.2519 27.9399C61.2269 22.5654 75.47 24.89 85.9032 32.8102ZM7.95073 33.6796L8.56449 33.9009L19.7721 38.6803C22.8161 39.9665 24.2762 43.4914 23.0332 46.5534C21.8732 49.4112 18.7685 50.8557 15.8848 49.9898L15.271 49.7686L4.06343 44.9892C1.01942 43.7029 -0.440641 40.178 0.802293 37.1161C1.96236 34.2582 5.06704 32.8138 7.95073 33.6796ZM43.5645 3.84034L43.8297 4.39911L48.4719 15.5444C49.7488 18.6271 48.2849 22.1613 45.2022 23.4382C42.3121 24.6353 39.0252 23.4235 37.5735 20.7273L37.3083 20.1685L32.6662 9.0232C31.3892 5.94047 32.8531 2.40629 35.9359 1.12938C38.8259 -0.0677188 42.1128 1.1441 43.5645 3.84034ZM87.2981 1.13322C90.2065 2.33789 91.6894 5.53017 90.8248 8.48394L90.6032 9.11243L85.8117 20.1116C84.521 23.2277 80.9486 24.7074 77.8325 23.4167C74.9242 22.212 73.4413 19.0197 74.3059 16.066L74.5274 15.4375L79.3189 4.43832C80.6096 1.32224 84.182 -0.157505 87.2981 1.13322Z" fill="#21212130"/>
+	<svg viewBox="0 0 160 160" fill="none" xmlns="http://www.w3.org/2000/svg" width="160" height="160" style="margin-bottom: 24px;">
+		<path d="M31.3334 97.3335C33.2767 99.1168 34.6603 101.426 35.3159 103.981L35.3189 103.985C37.6068 104.143 39.7441 105.183 41.2802 106.886C42.8164 108.588 43.6314 110.821 43.5536 113.113C43.4758 115.405 42.5112 117.577 40.8632 119.172C39.2151 120.767 37.0123 121.66 34.7189 121.662H10.8919C8.01694 121.66 5.25945 120.521 3.22083 118.494C1.18221 116.466 0.0278464 113.715 0.00949941 110.84C-0.00884754 107.966 1.11031 105.2 3.12289 103.147C5.13547 101.094 7.87821 99.9199 10.7529 99.881C12.2028 97.6776 14.2614 95.9428 16.6786 94.8873C19.0957 93.8318 21.7675 93.5011 24.369 93.9354C26.9706 94.3696 29.3901 95.5502 31.3334 97.3335Z" fill="#E1DFDD"/>
+		<path d="M112.953 124.709C110.696 127.673 109.474 131.297 109.476 135.023C109.476 135.233 109.476 135.428 109.492 135.64C109.478 135.715 109.473 135.791 109.476 135.867C109.476 136.627 109.568 137.384 109.751 138.121C110.256 140.202 111.444 142.053 113.125 143.379C114.807 144.704 116.885 145.428 119.026 145.433H150.45C152.985 145.43 155.414 144.421 157.205 142.627C158.996 140.833 160.001 138.402 160 135.867C159.997 133.333 158.991 130.904 157.201 129.111C155.411 127.318 152.983 126.307 150.45 126.3H141.11C139.201 123.1 136.295 120.614 132.837 119.225C129.38 117.836 125.562 117.621 121.97 118.611C118.378 119.602 115.21 121.744 112.953 124.709Z" fill="#E1DFDD"/>
+		<path d="M54.5504 49.0854L73.8744 98.3444L77.5981 96.8836L58.2741 47.6246L54.5504 49.0854Z" fill="#E1DFDD"/>
+		<path d="M29.4468 50.3283L56.3308 98.5873L59.8251 96.6407L32.9411 48.3817L29.4468 50.3283Z" fill="#E1DFDD"/>
+		<path d="M82.9771 96.8936L101.845 48.0266L105.577 49.4674L86.7086 98.3344L82.9771 96.8936Z" fill="#E1DFDD"/>
+		<path d="M127.167 48.2356L100.201 96.6406L103.695 98.5873L130.661 50.1823L127.167 48.2356Z" fill="#E1DFDD"/>
+		<path d="M130.355 50.355C130.355 37 125.05 24.192 115.606 14.7486C106.163 5.30524 93.355 0 80 0C66.645 0 53.8371 5.30524 44.3937 14.7486C34.9503 24.192 29.645 37 29.645 50.355H130.355Z" fill="#A9C9EA"/>
+		<path d="M104.588 50.355C104.588 22.545 93.5791 0 80.0001 0C66.4211 0 55.4121 22.545 55.4121 50.355H104.588Z" fill="#79A9DA"/>
+		<path d="M122.634 88H37.366C35.507 88 34 89.507 34 91.366V156.634C34 158.493 35.507 160 37.366 160H122.634C124.493 160 126 158.493 126 156.634V91.366C126 89.507 124.493 88 122.634 88Z" fill="#FFD590"/>
+		<path d="M81.5 88H89V160H81.5V88Z" fill="#FFE5B9"/>
+		<path d="M78.5 88H71V160H78.5V88Z" fill="#FFE5B9"/>
+		<path d="M45.5179 134.849L51.0129 125.856C51.1027 125.71 51.2283 125.59 51.3778 125.507C51.5272 125.424 51.6955 125.38 51.8666 125.381C52.0376 125.381 52.2057 125.425 52.3548 125.509C52.5038 125.593 52.6289 125.714 52.7179 125.86L58.2179 134.853C58.3665 135.097 58.4641 135.368 58.5048 135.65C58.5455 135.932 58.5285 136.22 58.4547 136.496C58.3809 136.771 58.252 137.029 58.0757 137.253C57.8993 137.477 57.6793 137.663 57.4289 137.8C56.9455 138.063 56.3782 138.127 55.8484 137.978C55.3186 137.828 54.8683 137.477 54.5939 137L53.8682 135.734V141.552C53.8682 142.657 52.9727 143.552 51.8682 143.552C50.7636 143.552 49.8682 142.657 49.8682 141.552V135.73L49.1419 136.996C48.8676 137.473 48.4173 137.824 47.8875 137.974C47.3576 138.123 46.7903 138.059 46.3069 137.796C46.0566 137.659 45.8365 137.473 45.6602 137.249C45.4839 137.025 45.3549 136.767 45.2812 136.492C45.2074 136.216 45.1903 135.928 45.231 135.646C45.2717 135.364 45.3693 135.093 45.5179 134.849Z" fill="#F7B547"/>
+		<path d="M45.8682 147.835C44.7636 147.835 43.8682 148.73 43.8682 149.835C43.8682 150.94 44.7636 151.835 45.8682 151.835H57.8682C58.9727 151.835 59.8682 150.94 59.8682 149.835C59.8682 148.73 58.9727 147.835 57.8682 147.835H45.8682Z" fill="#F7B547"/>
 	</svg>
 
-	<h2>Some handy text here</h2>
 	<button class="accent">Accent</button>
 </div>