Skip to content

Commit fb9d815

Browse files
Yifang-GuoYifang-Guo
committed
adjust format
1 parent 27cd323 commit fb9d815

File tree

9 files changed

+2685
-3210
lines changed

9 files changed

+2685
-3210
lines changed

‎curationTool/reactions/static/reactions/Home_page.css‎

Lines changed: 571 additions & 595 deletions
Large diffs are not rendered by default.

‎curationTool/reactions/static/reactions/js_savedreactions/sort_table.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ document.addEventListener('DOMContentLoaded', function () {
2525
// Reset to original order if no sort selected
2626
if (!sortKey) {
2727
tbody.innerHTML = '';
28-
originalRows.forEach(row => tbody.appendChild(row.cloneNode(true)));
28+
originalRows.forEach((row) => tbody.appendChild(row.cloneNode(true)));
2929
return;
3030
}
3131

@@ -36,9 +36,9 @@ document.addEventListener('DOMContentLoaded', function () {
3636
});
3737

3838
tbody.innerHTML = '';
39-
sortedRows.forEach(row => tbody.appendChild(row));
40-
41-
rebindCheckboxListeners();
4239

40+
sortedRows.forEach((row) => tbody.appendChild(row));
41+
42+
rebindCheckboxListeners();
4343
});
44-
});
44+
});

‎curationTool/reactions/static/reactions/leader_board.css‎

Lines changed: 112 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -1,169 +1,186 @@
1-
html,body {
2-
font-family: 'Poppins', sans-serif !important;
3-
background-color: #e7f7ff;
4-
height: 100%; /* Full height for the body and html */
5-
margin: 0; /* No margin */
6-
padding: 0; /* No padding */
1+
html,
2+
body {
3+
font-family: 'Poppins', sans-serif !important;
4+
background-color: #e7f7ff;
5+
height: 100%; /* Full height for the body and html */
6+
margin: 0; /* No margin */
7+
padding: 0; /* No padding */
78
}
89

9-
#reactionChart{
10-
padding: 3%;
10+
#reactionChart {
11+
padding: 3%;
1112
}
1213

1314
.clickable-row {
14-
cursor: pointer;
15-
}
16-
17-
.hero-body{
18-
display: flex;
19-
justify-content: center;
20-
align-items: center;
21-
background-color: #92d5f7;
22-
border-bottom: 2px solid #000000;
23-
height: 30%;
24-
}
25-
26-
/* For screens larger than 769px and for print */
27-
@media screen and (min-width: 769px), print {
28-
.hero-body {
29-
padding: unset; /* Resets the padding property */
30-
}
15+
cursor: pointer;
3116
}
3217

33-
/* For all screens */
3418
.hero-body {
35-
flex-grow: unset; /* Resets the flex-grow property */
36-
flex-shrink: unset; /* Resets the flex-shrink property */
37-
padding: unset; /* Resets the padding property */
19+
display: flex;
20+
justify-content: center;
21+
align-items: center;
22+
background-color: #92d5f7;
23+
border-bottom: 2px solid #000000;
24+
height: 30%;
3825
}
3926

40-
blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul {
41-
margin: unset; /* Resets the margin property */
42-
padding: unset; /* Resets the padding property */
27+
/* For screens larger than 769px and for print */
28+
@media screen and (min-width: 769px), print {
29+
.hero-body {
30+
padding: unset; /* Resets the padding property */
31+
}
4332
}
4433

45-
46-
h1.title {
47-
48-
font-weight: bold !important;
34+
/* For all screens */
35+
.hero-body {
36+
flex-grow: unset; /* Resets the flex-grow property */
37+
flex-shrink: unset; /* Resets the flex-shrink property */
38+
padding: unset; /* Resets the padding property */
39+
}
40+
41+
blockquote,
42+
body,
43+
dd,
44+
dl,
45+
dt,
46+
fieldset,
47+
figure,
48+
h1,
49+
h2,
50+
h3,
51+
h4,
52+
h5,
53+
h6,
54+
hr,
55+
html,
56+
iframe,
57+
legend,
58+
li,
59+
ol,
60+
p,
61+
pre,
62+
textarea,
63+
ul {
64+
margin: unset; /* Resets the margin property */
65+
padding: unset; /* Resets the padding property */
66+
}
67+
68+
h1.title {
69+
font-weight: bold !important;
4970
}
5071

5172
.hero.is-primary .title {
52-
color: black; /* Replace with your desired color */
73+
color: black; /* Replace with your desired color */
5374
}
5475

55-
56-
5776
#chartTitle {
58-
margin-bottom: -2% 0 0 0;
77+
margin-bottom: -2% 0 0 0;
5978
}
6079

61-
.container {
62-
width: 100%; /* Full width of the parent */
63-
height: 100%; /* Full height of the parent */
64-
margin: 0; /* No margin */
65-
padding: 0; /* No padding */
66-
box-sizing: border-box; /* Include padding/border in width/height */
67-
display: block; /* Block-level element */
68-
69-
80+
.container {
81+
width: 100%; /* Full width of the parent */
82+
height: 100%; /* Full height of the parent */
83+
margin: 0; /* No margin */
84+
padding: 0; /* No padding */
85+
box-sizing: border-box; /* Include padding/border in width/height */
86+
display: block; /* Block-level element */
7087
}
7188

72-
.section{
73-
padding:0;
89+
.section {
90+
padding: 0;
7491
}
7592

7693
.table-container {
77-
width: 200%; /* Full width to utilize available space */
78-
margin-top: 1.5%; /* Space above the table */
94+
width: 200%; /* Full width to utilize available space */
95+
margin-top: 1.5%; /* Space above the table */
7996
}
8097

8198
.table {
82-
width: 100%; /* Full width for the table */
83-
border-collapse: collapse; /* Collapse borders for a clean look */
84-
table-layout: fixed; /* Fixed table layout for equal column width */
85-
border: 1px solid #ddd; /* Border around the entire table */
99+
width: 100%; /* Full width for the table */
100+
border-collapse: collapse; /* Collapse borders for a clean look */
101+
table-layout: fixed; /* Fixed table layout for equal column width */
102+
border: 1px solid #ddd; /* Border around the entire table */
86103
}
87104

88105
/* Table Header */
89106
.table th {
90-
background-color: #f4f4f4; /* Light grey background for the header */
91-
color: #333; /* Dark text color for contrast */
92-
text-align: center; /* Center-align text */
93-
border: 1px solid #ddd; /* Border for header cells */
94-
padding: 10px; /* Spacing inside header cells */
107+
background-color: #f4f4f4; /* Light grey background for the header */
108+
color: #333; /* Dark text color for contrast */
109+
text-align: center; /* Center-align text */
110+
border: 1px solid #ddd; /* Border for header cells */
111+
padding: 10px; /* Spacing inside header cells */
95112
}
96113

97114
/* Table Data Cells */
98-
.table td, .table th {
99-
text-align: center; /* Center-align text */
100-
padding: 8px; /* Spacing inside data cells */
101-
border: 1px solid #ddd; /* Border for data cells */
102-
white-space: nowrap; /* Prevent wrapping by default */
115+
.table td,
116+
.table th {
117+
text-align: center; /* Center-align text */
118+
padding: 8px; /* Spacing inside data cells */
119+
border: 1px solid #ddd; /* Border for data cells */
120+
white-space: nowrap; /* Prevent wrapping by default */
103121
}
104122

105123
/* Select column - minimal width */
106-
.table th:first-child,
124+
.table th:first-child,
107125
.table td:first-child {
108-
width: 5%; /* Set a reasonable width for the Rank column */
109-
min-width: 50px; /* Minimum width to ensure content fits */
126+
width: 5%; /* Set a reasonable width for the Rank column */
127+
min-width: 50px; /* Minimum width to ensure content fits */
110128
}
111129

112130
/* Name, Reactions Saved, Reactions Added to VMH, Reactions Created columns - allow more space but limit maximum width */
113131
.table th:nth-child(2), .table td:nth-child(2), /* Name column */
114132
.table th:nth-child(3), .table td:nth-child(3), /* Reactions Saved column */
115133
.table th:nth-child(4), .table td:nth-child(4), /* Reactions Added to VMH column */
116-
.table th:nth-child(5), .table td:nth-child(5) { /* Reactions Created column */
117-
max-width: 20%; /* Maximum width limit */
118-
white-space: normal; /* Allow wrapping */
119-
word-wrap: break-word; /* Break words to wrap */
134+
.table th:nth-child(5), .table td:nth-child(5) {
135+
/* Reactions Created column */
136+
max-width: 20%; /* Maximum width limit */
137+
white-space: normal; /* Allow wrapping */
138+
word-wrap: break-word; /* Break words to wrap */
120139
}
121140

122141
/* Additional styles to improve readability */
123142
.table tr:nth-child(even) {
124-
background-color: #f9f9f9; /* Light grey background for even rows */
143+
background-color: #f9f9f9; /* Light grey background for even rows */
125144
}
126145

127146
.table tr:nth-child(odd) {
128-
background-color: #e7f7ff;
147+
background-color: #e7f7ff;
129148
}
130149

131150
.table tr:hover {
132-
background-color: #f1f1f1; /* Slightly darker background on hover */
151+
background-color: #f1f1f1; /* Slightly darker background on hover */
133152
}
134153

135154
/* Clickable row */
136155
.clickable-row {
137-
cursor: pointer; /* Show pointer cursor on hover */
156+
cursor: pointer; /* Show pointer cursor on hover */
138157
}
139158

140159
.clickable-row:hover {
141-
background-color: #e2e2e2; /* Highlight row on hover for better visibility */
160+
background-color: #e2e2e2; /* Highlight row on hover for better visibility */
142161
}
143162

144163
@media screen and (min-width: 1408px) {
145-
.container:not(.is-max-desktop):not(.is-max-widescreen) {
146-
max-width: none; /* Remove max-width constraint */
147-
width: 100%; /* Ensure full width */
148-
}
164+
.container:not(.is-max-desktop):not(.is-max-widescreen) {
165+
max-width: none; /* Remove max-width constraint */
166+
width: 100%; /* Ensure full width */
167+
}
149168
}
150169

151170
@media screen and (min-width: 1216px) {
152-
.container:not(.is-max-desktop) {
153-
max-width: none; /* Remove max-width constraint */
154-
width: 100%; /* Ensure full width */
155-
}
171+
.container:not(.is-max-desktop) {
172+
max-width: none; /* Remove max-width constraint */
173+
width: 100%; /* Ensure full width */
174+
}
156175
}
157176

158-
159-
160177
.logo {
161-
float: left; /* Positions the div to the left */
162-
height: 6%;
163-
width: 6%;
164-
margin-left: 1%;
178+
float: left; /* Positions the div to the left */
179+
height: 6%;
180+
width: 6%;
181+
margin-left: 1%;
165182
}
166183

167184
.column.is-full {
168-
font-weight: bold;
169-
}
185+
font-weight: bold;
186+
}

0 commit comments

Comments
 (0)