fixed bubble sizes

the-pudding · Jul 17, 2024 · 7ea1de8 · 7ea1de8
1 parent fe256d4
commit 7ea1de8
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 9 deletions.
diff --git a/src/components/Index.svelte b/src/components/Index.svelte
@@ -199,7 +199,7 @@
       <Editorial copy={copy.debunk_narvaez_2} spacer="none" />
     </div>
     <div class="editorial-container conclusion">
-      <h3 class="sub-title">It's your decision</h3>
+      <h3 class="sub-title">It&rsquo;s your decision</h3>
       <Editorial copy={copy.editorial_conclusion} spacer="none" />
       <Editorial copy={copy.editorial_conclusion_2} spacer="none" notifications={commentsConclusion} />
       <h3 id="methods" class="sub-title sub-title-smaller">Methods</h3>
@@ -214,7 +214,7 @@
   }
 	#article {
 		/* max-width: 40rem; */
-		padding: 16px;
+		/* padding: 16px; */
 		margin: 0 auto;
 	}
 	:global(#article h2 span) {

diff --git a/src/components/article/ForceBubbles.svelte b/src/components/article/ForceBubbles.svelte
@@ -112,7 +112,7 @@
                 children: Array.from(
                     group(renderedData.map(d => {
                         return {
-                            value:10,//radiusScale(d.radius),
+                            value:radiusScale(d.radius),
                             
                             // YOU NEED THE GROUP TO HAVE A #, SO THAT'S WHY I MAP EACH POSITION TO 0,1,2
                             group:ordinalGroup[d[groupedBy]], info:d}
@@ -255,6 +255,7 @@
         width={$viewport.width*0.9}
         height={$viewport.height*0.9}
         aria-labelledby="chartTitle chartDesc"
+        style="overflow:visible;"
     >
         <title id="chartTitle" style="opacity: 0;">
             {chartTitle}

diff --git a/src/components/article/Mosaic.svelte b/src/components/article/Mosaic.svelte
@@ -133,6 +133,8 @@
     position: sticky;
     top: 0;
     z-index: 1;
+    width: 100%;
+    overflow: hidden;
   }
 
   .image-container {

diff --git a/src/components/article/Notification.svelte b/src/components/article/Notification.svelte
@@ -91,8 +91,7 @@
       font-size: 16px;
     }
     .notification {
-      margin-left: 10px;
-      margin-right: 10px;
+      max-width: calc(100% - 40px);
     }
   }
 </style>
diff --git a/src/components/article/ScrollSection.svelte b/src/components/article/ScrollSection.svelte
@@ -141,7 +141,7 @@
 
     @media only screen and (max-width: 600px) {
 		.step-content {
-			font-size: 14px !important;
+			/* font-size: 14px !important; */
 		}
     }
 </style>
diff --git a/src/components/article/Tooltip.svelte b/src/components/article/Tooltip.svelte
@@ -152,7 +152,7 @@
 
     }
     .info-element {
-      font-size: 12px;
+      font-size: 14px;
       font-weight: 400;
       margin-bottom: 0px;
       padding-bottom: 0px;

diff --git a/src/styles/reset.css b/src/styles/reset.css
@@ -1,7 +1,7 @@
 
 body {
 	/* background-color: var(--color-bg, white); */
-	background: linear-gradient(180deg, #1A2127 0px, #1A2E3C 300px);
+	background:#1A2E3C;
 	color: #FFFFFF;
 	line-height: 1.4;
 	/* font-family: var(--font-body, serif); */
@@ -261,9 +261,10 @@ ol, ul {
 }
 
 .textbox-footnote {
-	font-size: 12px;
+	font-size: 14px;
 	white-space: wrap;
 	line-height: 1 !important;
+	line-height: 1.2;
 } 
 
 .step-content .bold {