fix canvas widths

teambtcmap · Dec 14, 2023 · ba22caa · ba22caa
1 parent 3a7114c
commit ba22caa
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 12 deletions.
diff --git a/src/routes/communities/+page.svelte b/src/routes/communities/+page.svelte
@@ -300,7 +300,7 @@
 						/>
 					</div>
 				{/if}
-				<canvas bind:this={continentChartCanvas} width="350" height="350" />
+				<canvas bind:this={continentChartCanvas} width="100%" height="350" />
 			</div>
 
 			<div>

diff --git a/src/routes/community/[area]/+page.svelte b/src/routes/community/[area]/+page.svelte
@@ -1057,7 +1057,7 @@
 						</p>
 					{/if}
 
-					<canvas bind:this={updatedChartCanvas} width="250" height="250" />
+					<canvas bind:this={updatedChartCanvas} width="100%" height="250" />
 				</div>
 			</section>
 
@@ -1282,7 +1282,7 @@
 									class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 								/>
 							{/if}
-							<canvas bind:this={upToDateChartCanvas} width="400" height="400" />
+							<canvas bind:this={upToDateChartCanvas} width="100%" height="400" />
 						</div>
 						<p class="mt-1 text-center text-sm text-body dark:text-white">
 							*Locations with a <em>survey:date</em>, <em>check_date</em>, or
@@ -1297,7 +1297,7 @@
 									class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 								/>
 							{/if}
-							<canvas bind:this={totalChartCanvas} width="400" height="400" />
+							<canvas bind:this={totalChartCanvas} width="100%" height="400" />
 						</div>
 						<p class="mt-1 text-center text-sm text-body dark:text-white">
 							*Locations accepting any bitcoin payment method.
@@ -1311,7 +1311,7 @@
 									class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 								/>
 							{/if}
-							<canvas bind:this={legacyChartCanvas} width="400" height="400" />
+							<canvas bind:this={legacyChartCanvas} width="100%" height="400" />
 						</div>
 						<p class="mt-1 text-center text-sm text-body dark:text-white">
 							*Locations with a <em>payment:bitcoin</em> tag instead of the
@@ -1326,7 +1326,7 @@
 									class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 								/>
 							{/if}
-							<canvas bind:this={paymentMethodChartCanvas} width="400" height="400" />
+							<canvas bind:this={paymentMethodChartCanvas} width="100%" height="400" />
 						</div>
 						<p class="mt-1 text-center text-sm text-body dark:text-white">
 							*Locations with <em>payment:onchain</em>, <em>payment:lightning</em> and

diff --git a/src/routes/dashboard/+page.svelte b/src/routes/dashboard/+page.svelte
@@ -614,7 +614,7 @@
 								class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 							/>
 						{/if}
-						<canvas bind:this={upToDateChartCanvas} width="400" height="400" />
+						<canvas bind:this={upToDateChartCanvas} width="100%" height="400" />
 					</div>
 					<p class="mt-1 text-center text-sm text-body dark:text-white">
 						*Elements with a <em>survey:date</em>, <em>check_date</em>, or
@@ -629,7 +629,7 @@
 								class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 							/>
 						{/if}
-						<canvas bind:this={totalChartCanvas} width="400" height="400" />
+						<canvas bind:this={totalChartCanvas} width="100%" height="400" />
 					</div>
 					<p class="mt-1 text-center text-sm text-body dark:text-white">
 						*Elements accepting any bitcoin payment method.
@@ -643,7 +643,7 @@
 								class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 							/>
 						{/if}
-						<canvas bind:this={legacyChartCanvas} width="400" height="400" />
+						<canvas bind:this={legacyChartCanvas} width="100%" height="400" />
 					</div>
 					<p class="mt-1 text-center text-sm text-body dark:text-white">
 						*Elements with a <em>payment:bitcoin</em> tag instead of the
@@ -658,7 +658,7 @@
 								class="absolute left-0 top-0 h-[400px] w-full animate-pulse rounded-3xl border border-link/50"
 							/>
 						{/if}
-						<canvas bind:this={paymentMethodChartCanvas} width="400" height="400" />
+						<canvas bind:this={paymentMethodChartCanvas} width="100%" height="400" />
 					</div>
 					<p class="mt-1 text-center text-sm text-body dark:text-white">
 						*Elements with <em>payment:onchain</em>, <em>payment:lightning</em> and

diff --git a/src/routes/leaderboard/+page.svelte b/src/routes/leaderboard/+page.svelte
@@ -224,7 +224,7 @@
 				{#if !leaderboard || loading}
 					<div class="absolute left-0 top-0 h-[400px] w-full animate-pulse border border-link/50" />
 				{/if}
-				<canvas bind:this={topTenChartCanvas} width="400" height="400" />
+				<canvas bind:this={topTenChartCanvas} width="100%" height="400" />
 			</section>
 
 			<PrimaryButton

diff --git a/src/routes/tagger/[id]/+page.svelte b/src/routes/tagger/[id]/+page.svelte
@@ -660,7 +660,7 @@
 						</p>
 					{/if}
 
-					<canvas bind:this={tagTypeChartCanvas} width="250" height="250" />
+					<canvas bind:this={tagTypeChartCanvas} width="100%" height="250" />
 				</div>
 			</section>
-Original file line number
+Diff line change
@@ Expand Up / @@ -300,7 +300,7 @@ @@
     						/>
     					</div>
     				{/if}
-    				<canvas bind:this={continentChartCanvas} width="350" height="350" />
+    				<canvas bind:this={continentChartCanvas} width="100%" height="350" />
     			</div>
     			<div>
@@ Expand Down @@