Michelle Lam commited on
Commit
5cc3773
1 Parent(s): c191ad9

Fixes formatting in sidebar at different widths. Adds Google Analytics tag. Cleans up Svelte component props.

Browse files
indie_label_svelte/public/index.html CHANGED
@@ -19,6 +19,15 @@
19
 
20
  <script defer src='/build/bundle.js'></script>
21
  </head>
 
 
 
 
 
 
 
 
 
22
 
23
  <body>
24
  </body>
 
19
 
20
  <script defer src='/build/bundle.js'></script>
21
  </head>
22
+ <!-- Google tag (gtag.js) -->
23
+ <script async src="https://www.googletagmanager.com/gtag/js?id=G-GFB1D1ZXRZ"></script>
24
+ <script>
25
+ window.dataLayer = window.dataLayer || [];
26
+ function gtag(){dataLayer.push(arguments);}
27
+ gtag('js', new Date());
28
+
29
+ gtag('config', 'G-GFB1D1ZXRZ');
30
+ </script>
31
 
32
  <body>
33
  </body>
indie_label_svelte/src/Auditing.svelte CHANGED
@@ -293,9 +293,6 @@
293
  {#if audit_results}
294
  <OverallResults
295
  data={audit_results}
296
- clusters={clusters}
297
- personalized_model={personalized_model}
298
- cluster={topic}
299
  />
300
  {/if}
301
  {:catch error}
 
293
  {#if audit_results}
294
  <OverallResults
295
  data={audit_results}
 
 
 
296
  />
297
  {/if}
298
  {:catch error}
indie_label_svelte/src/ClusterResults.svelte CHANGED
@@ -32,7 +32,7 @@
32
  export let show_checkboxes = true;
33
  export let table_width_pct = 80;
34
  export let rowsPerPage = 10;
35
- export let evidence;
36
  export let table_id;
37
  export let use_model = true;
38
  export let show_agree_disagree = false;
@@ -232,7 +232,7 @@
232
  <div class="row">
233
  <div class="col s8">
234
  <VegaLite
235
- {cluster_overview_data}
236
  spec={cluster_overview_spec}
237
  bind:view={cluster_overview_view}
238
  />
@@ -302,7 +302,7 @@
302
  <Cell>
303
  System<br>decision<br>
304
  {#if show_checkboxes}
305
- <span style="font-size:12px; max-width:125px">White = Non-toxic, <br>Grey = Toxic</span>
306
  {/if}
307
  </Cell>
308
  {#if show_num_ratings}
@@ -314,7 +314,7 @@
314
  <Cell>
315
  Potential error<br>type<br>
316
  {#if show_checkboxes}
317
- <span style="font-size:12px; max-width:125px">Darker red = Greater <br>potential system error</span>
318
  {/if}
319
  </Cell>
320
 
 
32
  export let show_checkboxes = true;
33
  export let table_width_pct = 80;
34
  export let rowsPerPage = 10;
35
+ export let evidence = null;
36
  export let table_id;
37
  export let use_model = true;
38
  export let show_agree_disagree = false;
 
232
  <div class="row">
233
  <div class="col s8">
234
  <VegaLite
235
+ data={cluster_overview_data}
236
  spec={cluster_overview_spec}
237
  bind:view={cluster_overview_view}
238
  />
 
302
  <Cell>
303
  System<br>decision<br>
304
  {#if show_checkboxes}
305
+ <span style="font-size:9px; max-width:125px">White = Non-toxic, <br>Grey = Toxic</span>
306
  {/if}
307
  </Cell>
308
  {#if show_num_ratings}
 
314
  <Cell>
315
  Potential error<br>type<br>
316
  {#if show_checkboxes}
317
+ <span style="font-size:9px; max-width:125px">Darker red = Greater <br>potential system error</span>
318
  {/if}
319
  </Cell>
320
 
indie_label_svelte/src/HypothesisPanel.svelte CHANGED
@@ -248,8 +248,8 @@
248
  <div class="panel_header">
249
  <div class="panel_header_content">
250
  <div class="page_header">
251
- <img src="/logo.png" style="height: 50px; padding: 0px 20px;" alt="IndieLabel" />
252
- <Button class="user_button" color="secondary" style="margin: 12px 10px;" >
253
  <Label>User: {cur_user}</Label>
254
  </Button>
255
  </div>
@@ -259,7 +259,7 @@
259
  on:click={() => (open = !open)}
260
  color="primary"
261
  disabled={model == null}
262
- style="float: right; padding: 10px; margin-right: 10px;"
263
  >
264
  {#if open}
265
  <Label>Close</Label>
@@ -584,18 +584,17 @@
584
 
585
  :global(.mdc-button.user_button span) {
586
  text-overflow: ellipsis;
587
- white-space: nowrap;
588
  overflow: hidden;
589
  }
590
 
591
  .page_header {
592
  width: 100%;
593
  background: #e3d6fd;
594
- /* padding: 21px 0; */
595
- /* border-bottom: 1px solid #e3d6fd; */
596
  padding: 10.5px 0;
597
  position: relative;
598
- display: inline-block;
 
 
599
  }
600
 
601
  .page_header:before {
@@ -608,9 +607,11 @@
608
  }
609
 
610
  .hypotheses_header {
611
- display: inline-block;
612
  width: 100%;
613
  padding: 10px 0;
614
  vertical-align: middle;
 
 
 
615
  }
616
  </style>
 
248
  <div class="panel_header">
249
  <div class="panel_header_content">
250
  <div class="page_header">
251
+ <img src="/logo.png" style="height: 50px;" alt="IndieLabel" />
252
+ <Button class="user_button" color="secondary" style="margin: 0 5px; padding: 0 5px;" >
253
  <Label>User: {cur_user}</Label>
254
  </Button>
255
  </div>
 
259
  on:click={() => (open = !open)}
260
  color="primary"
261
  disabled={model == null}
262
+ style="float: right; padding: 0 5px; margin: 0 5px; max-width: 200px;"
263
  >
264
  {#if open}
265
  <Label>Close</Label>
 
584
 
585
  :global(.mdc-button.user_button span) {
586
  text-overflow: ellipsis;
 
587
  overflow: hidden;
588
  }
589
 
590
  .page_header {
591
  width: 100%;
592
  background: #e3d6fd;
 
 
593
  padding: 10.5px 0;
594
  position: relative;
595
+ display: flex;
596
+ align-items: center;
597
+ justify-content: space-around;
598
  }
599
 
600
  .page_header:before {
 
607
  }
608
 
609
  .hypotheses_header {
 
610
  width: 100%;
611
  padding: 10px 0;
612
  vertical-align: middle;
613
+ display: flex;
614
+ align-items: center;
615
+ justify-content: space-around;
616
  }
617
  </style>
indie_label_svelte/src/MainPanel.svelte CHANGED
@@ -7,7 +7,7 @@
7
  import TabBar from "@smui/tab-bar";
8
  import { Icon } from "@smui/common";
9
 
10
- export let model;
11
  export let error_type;
12
  export let cur_user;
13
 
 
7
  import TabBar from "@smui/tab-bar";
8
  import { Icon } from "@smui/common";
9
 
10
+ export let model = null;
11
  export let error_type;
12
  export let cur_user;
13
 
indie_label_svelte/src/ModelPerf.svelte CHANGED
@@ -32,7 +32,7 @@
32
  <div>
33
  <!-- Performance visualization -->
34
  <div>
35
- <VegaLite {perf_plot_data} spec={perf_plot_spec} bind:view={perf_plot_view}/>
36
  </div>
37
  </div>
38
  </div>
 
32
  <div>
33
  <!-- Performance visualization -->
34
  <div>
35
+ <VegaLite data={perf_plot_data} spec={perf_plot_spec} bind:view={perf_plot_view}/>
36
  </div>
37
  </div>
38
  </div>
indie_label_svelte/src/OverallResults.svelte CHANGED
@@ -65,7 +65,7 @@
65
  {/if}
66
  <div class="row">
67
  <div class="col s8">
68
- <VegaLite {topic_overview_data} spec={topic_overview_spec} bind:view={topic_overview_view}/>
69
  </div>
70
  </div>
71
 
 
65
  {/if}
66
  <div class="row">
67
  <div class="col s8">
68
+ <VegaLite data={topic_overview_data} spec={topic_overview_spec} bind:view={topic_overview_view}/>
69
  </div>
70
  </div>
71