@seqera/docusaurus-theme-seqera 1.0.20-next.69 → 1.0.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/lib/main-styles.css +36 -15
  2. package/lib/styles/buttons.css +12 -9
  3. package/lib/theme/Homepage/index.js +11 -11
  4. package/package.json +1 -1
  5. package/src/main-styles.css +36 -15
  6. package/src/styles/buttons.css +12 -9
  7. package/src/theme/Homepage/index.tsx +11 -11
package/lib/main-styles.css CHANGED
@@ -14,15 +14,22 @@ Infima is Docusaurus's built in CSS framework.
14
14
  **/
15
15
  :root {
16
16
  /* the primary color is set to nextflow-900 because it's the most web accessible */
17
- --ifm-color-primary: var(--color-nextflow-900);
17
+ /* --ifm-color-primary: var(--color-nextflow-900);
18
18
  --ifm-color-primary-dark: var(--color-nextflow-700);
19
19
  --ifm-color-primary-darker: var(--color-nextflow-800);
20
20
  --ifm-color-primary-darkest: var(--color-nextflow-900);
21
21
  --ifm-color-primary-light: var(--color-nextflow-400);
22
22
  --ifm-color-primary-lighter: var(--color-nextflow-300);
23
23
  --ifm-color-primary-lightest: var(--color-nextflow-200);
24
- --ifm-badge-background-color: var(--color-nextflow-300);
25
-
24
+ --ifm-badge-background-color: var(--color-nextflow-300); */
25
+ --ifm-color-primary: var(--color-blu-600);
26
+ --ifm-color-primary-dark: var(--color-blu-700);
27
+ --ifm-color-primary-darker: var(--color-blu-800);
28
+ --ifm-color-primary-darkest: var(--color-blu-900);
29
+ --ifm-color-primary-light: var(--color-blu-400);
30
+ --ifm-color-primary-lighter: var(--color-blu-300);
31
+ --ifm-color-primary-lightest: var(--color-blu-200);
32
+ --ifm-badge-background-color: var(--color-blu-300);
26
33
  --ifm-navbar-sidebar-width: 100%;
27
34
  --ifm-code-font-size: 95%;
28
35
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
@@ -144,9 +151,11 @@ Infima is Docusaurus's built in CSS framework.
144
151
  --color-blu-1000: #1e2768;
145
152
  --color-blu: #4256e7;
146
153
 
147
- --color-primary: var(--color-nextflow-900);
148
- --color-secondary: var(--color-nextflow-500);
149
- --color-accent: var(--color-nextflow-200);
154
+ /* --color-primary: var(--color-nextflow-800);
155
+ --color-secondary: var(--color-nextflow-500); */
156
+ --color-primary: var(--color-blu-800);
157
+ --color-secondary: var(--color-blu-600);
158
+ --color-accent: var(--color-blu-200);
150
159
  --color-neutral: #3d4451;
151
160
  --color-base-100: #ffffff;
152
161
  --color-base-200: #f2f2f2;
@@ -178,13 +187,20 @@ body {
178
187
  /* Dark mode */
179
188
  [data-theme='dark'] {
180
189
  color-scheme: dark;
181
- --ifm-color-primary: var(--color-nextflow-300);
190
+ /* --ifm-color-primary: var(--color-nextflow-300);
182
191
  --ifm-color-primary-dark: var(--color-nextflow-400);
183
192
  --ifm-color-primary-darker: var(--color-nextflow-500);
184
193
  --ifm-color-primary-darkest: var(--color-nextflow-600);
185
194
  --ifm-color-primary-light: var(--color-nextflow-300);
186
195
  --ifm-color-primary-lighter: var(--color-nextflow-200);
187
- --ifm-color-primary-lightest: var(--color-nextflow-100);
196
+ --ifm-color-primary-lightest: var(--color-nextflow-100); */
197
+ --ifm-color-primary: var(--color-blu-300);
198
+ --ifm-color-primary-dark: var(--color-blu-400);
199
+ --ifm-color-primary-darker: var(--color-blu-500);
200
+ --ifm-color-primary-darkest: var(--color-blu-600);
201
+ --ifm-color-primary-light: var(--color-blu-300);
202
+ --ifm-color-primary-lighter: var(--color-blu-200);
203
+ --ifm-color-primary-lightest: var(--color-blu-100);
188
204
  --ifm-navbar-background-color: rgb(28, 28, 30);
189
205
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
190
206
  --ifm-code-color: var(--color-red-400);
@@ -193,15 +209,18 @@ body {
193
209
  --ifm-heading-color: #e3e3e3;
194
210
 
195
211
  /* dark mode overrides */
196
- --color-primary: var(--color-nextflow-500);
197
- --color-secondary: var(--color-nextflow-500);
198
- --color-accent: #1fb2a5;
212
+ /* --color-primary: var(--color-nextflow-500);
213
+ --color-secondary: var(--color-nextflow-500); */
214
+ --color-primary: var(--color-blu-500);
215
+ --color-secondary: var(--color-blu-500);
216
+ --color-accent: var(--color-blu-300);
217
+ /* --color-accent: #1fb2a5; */
199
218
  --color-neutral: #191d24;
200
219
  --color-base-100: rgb(28, 28, 30);
201
220
  --color-base-200: #242933;
202
221
  --color-base-300: #20252e;
203
222
 
204
- --color-info: var(--color-wave-300);
223
+ --color-info: var(--color-wave-300);
205
224
  --color-success: var(--color-nextflow-300);
206
225
  --color-warning: var(--color-multiqc-300);
207
226
  --color-error: var(--color-fusion-300);
@@ -331,7 +350,7 @@ body {
331
350
  --color-brand-1200: #151121;
332
351
  --color-brand-1300: #141024;
333
352
  --color-brand-1400: #110d1d;
334
- --color-brand: #201637;
353
+ --color-brand: #160f26;
335
354
 
336
355
  /* Gray Colors */
337
356
  --color-gray-100: #f7f7f7;
@@ -370,8 +389,10 @@ body {
370
389
  --color-blu-1000: #1e2768;
371
390
  --color-blu: #4256e7;
372
391
 
373
- --color-primary: var(--color-nextflow-900);
374
- --color-secondary: var(--color-nextflow-500);
392
+ /* --color-primary: var(--color-nextflow-800);
393
+ --color-secondary: var(--color-nextflow-500); */
394
+ --color-primary: var(--color-blu-600);
395
+ --color-secondary: var(--color-blu-500);
375
396
  --color-accent: #f59e0b;
376
397
  --color-neutral: #3d4451;
377
398
  --color-base-100: #ffffff;
package/lib/styles/buttons.css CHANGED
@@ -1,9 +1,11 @@
1
1
  .btn {
2
2
  border-radius: 4px;
3
3
  transition: all 0.3s;
4
- color: black;
5
- background: var(--color-nextflow-500);
6
- border: 1px solid var(--color-nextflow-700);
4
+ /* background: var(--color-nextflow-500);
5
+ border: 1px solid var(--color-nextflow-700); */
6
+ color: white;
7
+ background: var(--color-blu);
8
+ border: 1px solid var(--color-blu);
7
9
  font-weight: 500;
8
10
  font-size: 0.9rem;
9
11
  text-align: center;
@@ -11,8 +13,8 @@
11
13
  width: auto;
12
14
  text-decoration: none !important;
13
15
  &:hover {
14
- background: var(--color-nextflow-700);
15
-
16
+ /* background: var(--color-nextflow-600); */
17
+ background: var(--color-blu-700);
16
18
  }
17
19
  }
18
20
 
@@ -29,11 +31,12 @@
29
31
  [data-theme='dark'] {
30
32
  .btn {
31
33
  color: black;
32
- background: var(--color-nextflow-400);
33
- border: 1px solid var(--color-nextflow-400);
34
+ background: var(--color-blu-400);
35
+ border: 1px solid var(--color-blu-400);
34
36
  &:hover {
35
- background: var(--color-nextflow-600);
36
- border: 1px solid var(--color-nextflow-700);
37
+ /* background: var(--color-nextflow-600); */
38
+ background: var(--color-blu-700);
39
+ border: 1px solid var(--color-blu-700);
37
40
  }
38
41
  }
39
42
  .btn-outline {
package/lib/theme/Homepage/index.js CHANGED
@@ -14,21 +14,21 @@ const CARD_DATA = {
14
14
  platform: [
15
15
  {
16
16
  href: '/platform-cloud/',
17
- icon: <IconSeqeraCloud className="text-brand dark:text-white" />,
17
+ icon: <IconSeqeraCloud className="text-black" />,
18
18
  title: 'Seqera Cloud',
19
19
  description:
20
20
  'Comprehensive platform empowering teams across the entire scientific lifecycle',
21
21
  },
22
22
  {
23
23
  href: '/platform-enterprise/',
24
- icon: <IconSeqeraEnterprise className="text-brand dark:text-white" />,
24
+ icon: <IconSeqeraEnterprise className="text-black" />,
25
25
  title: 'Seqera Enterprise',
26
26
  description:
27
27
  'Platform management within your own infrastructure for greater control',
28
28
  },
29
29
  {
30
30
  href: '/fusion/',
31
- icon: <IconFusion className="text-brand dark:text-white" />,
31
+ icon: <IconFusion className="text-fusion-600" />,
32
32
  title: 'Fusion',
33
33
  description: 'Optimized file system for cloud-native data pipelines',
34
34
  },
@@ -36,14 +36,14 @@ const CARD_DATA = {
36
36
  ai: [
37
37
  {
38
38
  href: '/platform-cloud/seqera-ai/',
39
- icon: <IconAI className="text-brand max-w-5.5" />,
39
+ icon: <IconAI className="text-black max-w-5.5" />,
40
40
  title: 'Seqera AI',
41
41
  description:
42
42
  'Intelligent command-line assistant that helps you build, run, and manage bioinformatics workflows',
43
43
  },
44
44
  {
45
45
  href: '/platform-cloud/seqera-mcp/',
46
- icon: <IconMCP className="text-brand max-w-5.5" />,
46
+ icon: <IconMCP className="text-black max-w-5.5" />,
47
47
  title: 'Seqera MCP',
48
48
  description: 'AI assistant that interacts with the Seqera ecosystem',
49
49
  },
@@ -51,19 +51,19 @@ const CARD_DATA = {
51
51
  openSource: [
52
52
  {
53
53
  href: '/nextflow/',
54
- icon: <IconNextflow className="text-brand dark:text-white" />,
54
+ icon: <IconNextflow className="text-nextflow-600" />,
55
55
  title: 'Nextflow',
56
56
  description: 'Open-source orchestrator for deploying workflows',
57
57
  },
58
58
  {
59
59
  href: '/wave/',
60
- icon: <IconWave className="text-brand dark:text-white" />,
60
+ icon: <IconWave className="text-wave-600" />,
61
61
  title: 'Wave',
62
62
  description: 'Next-generation container provisioning for data analysis',
63
63
  },
64
64
  {
65
65
  href: '/multiqc/',
66
- icon: <IconMultiQC className="text-brand dark:text-white" />,
66
+ icon: <IconMultiQC className="text-multiqc-600" />,
67
67
  title: 'MultiQC',
68
68
  description:
69
69
  'Open-source tool to aggregate bioinformatic analyses results',
@@ -72,20 +72,20 @@ const CARD_DATA = {
72
72
  help: [
73
73
  {
74
74
  href: 'https://support.seqera.io/',
75
- icon: <IconQuestionMark className="text-brand" />,
75
+ icon: <IconQuestionMark className="text-black" />,
76
76
  title: 'Support Portal',
77
77
  description:
78
78
  'Contact support for help with your platform or enterprise account',
79
79
  },
80
80
  {
81
81
  href: 'https://community.seqera.io/',
82
- icon: <IconChatBubbles className="text-brand" />,
82
+ icon: <IconChatBubbles className="text-black" />,
83
83
  title: 'Community Forum',
84
84
  description: 'Discuss, share and network with other users',
85
85
  },
86
86
  {
87
87
  href: 'https://status.seqera.io/',
88
- icon: <IconServiceStatus className="text-brand" />,
88
+ icon: <IconServiceStatus className="text-black" />,
89
89
  title: 'Service Status',
90
90
  description: 'Monitor platform performance in real time',
91
91
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seqera/docusaurus-theme-seqera",
3
- "version": "1.0.20-next.69",
3
+ "version": "1.0.20",
4
4
  "description": "Seqera docs theme for Docusaurus",
5
5
  "author": "Seqera docs team <education@seqera.io>",
6
6
  "license": "Apache-2.0",
package/src/main-styles.css CHANGED
@@ -14,15 +14,22 @@ Infima is Docusaurus's built in CSS framework.
14
14
  **/
15
15
  :root {
16
16
  /* the primary color is set to nextflow-900 because it's the most web accessible */
17
- --ifm-color-primary: var(--color-nextflow-900);
17
+ /* --ifm-color-primary: var(--color-nextflow-900);
18
18
  --ifm-color-primary-dark: var(--color-nextflow-700);
19
19
  --ifm-color-primary-darker: var(--color-nextflow-800);
20
20
  --ifm-color-primary-darkest: var(--color-nextflow-900);
21
21
  --ifm-color-primary-light: var(--color-nextflow-400);
22
22
  --ifm-color-primary-lighter: var(--color-nextflow-300);
23
23
  --ifm-color-primary-lightest: var(--color-nextflow-200);
24
- --ifm-badge-background-color: var(--color-nextflow-300);
25
-
24
+ --ifm-badge-background-color: var(--color-nextflow-300); */
25
+ --ifm-color-primary: var(--color-blu-600);
26
+ --ifm-color-primary-dark: var(--color-blu-700);
27
+ --ifm-color-primary-darker: var(--color-blu-800);
28
+ --ifm-color-primary-darkest: var(--color-blu-900);
29
+ --ifm-color-primary-light: var(--color-blu-400);
30
+ --ifm-color-primary-lighter: var(--color-blu-300);
31
+ --ifm-color-primary-lightest: var(--color-blu-200);
32
+ --ifm-badge-background-color: var(--color-blu-300);
26
33
  --ifm-navbar-sidebar-width: 100%;
27
34
  --ifm-code-font-size: 95%;
28
35
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
@@ -144,9 +151,11 @@ Infima is Docusaurus's built in CSS framework.
144
151
  --color-blu-1000: #1e2768;
145
152
  --color-blu: #4256e7;
146
153
 
147
- --color-primary: var(--color-nextflow-900);
148
- --color-secondary: var(--color-nextflow-500);
149
- --color-accent: var(--color-nextflow-200);
154
+ /* --color-primary: var(--color-nextflow-800);
155
+ --color-secondary: var(--color-nextflow-500); */
156
+ --color-primary: var(--color-blu-800);
157
+ --color-secondary: var(--color-blu-600);
158
+ --color-accent: var(--color-blu-200);
150
159
  --color-neutral: #3d4451;
151
160
  --color-base-100: #ffffff;
152
161
  --color-base-200: #f2f2f2;
@@ -178,13 +187,20 @@ body {
178
187
  /* Dark mode */
179
188
  [data-theme='dark'] {
180
189
  color-scheme: dark;
181
- --ifm-color-primary: var(--color-nextflow-300);
190
+ /* --ifm-color-primary: var(--color-nextflow-300);
182
191
  --ifm-color-primary-dark: var(--color-nextflow-400);
183
192
  --ifm-color-primary-darker: var(--color-nextflow-500);
184
193
  --ifm-color-primary-darkest: var(--color-nextflow-600);
185
194
  --ifm-color-primary-light: var(--color-nextflow-300);
186
195
  --ifm-color-primary-lighter: var(--color-nextflow-200);
187
- --ifm-color-primary-lightest: var(--color-nextflow-100);
196
+ --ifm-color-primary-lightest: var(--color-nextflow-100); */
197
+ --ifm-color-primary: var(--color-blu-300);
198
+ --ifm-color-primary-dark: var(--color-blu-400);
199
+ --ifm-color-primary-darker: var(--color-blu-500);
200
+ --ifm-color-primary-darkest: var(--color-blu-600);
201
+ --ifm-color-primary-light: var(--color-blu-300);
202
+ --ifm-color-primary-lighter: var(--color-blu-200);
203
+ --ifm-color-primary-lightest: var(--color-blu-100);
188
204
  --ifm-navbar-background-color: rgb(28, 28, 30);
189
205
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
190
206
  --ifm-code-color: var(--color-red-400);
@@ -193,15 +209,18 @@ body {
193
209
  --ifm-heading-color: #e3e3e3;
194
210
 
195
211
  /* dark mode overrides */
196
- --color-primary: var(--color-nextflow-500);
197
- --color-secondary: var(--color-nextflow-500);
198
- --color-accent: #1fb2a5;
212
+ /* --color-primary: var(--color-nextflow-500);
213
+ --color-secondary: var(--color-nextflow-500); */
214
+ --color-primary: var(--color-blu-500);
215
+ --color-secondary: var(--color-blu-500);
216
+ --color-accent: var(--color-blu-300);
217
+ /* --color-accent: #1fb2a5; */
199
218
  --color-neutral: #191d24;
200
219
  --color-base-100: rgb(28, 28, 30);
201
220
  --color-base-200: #242933;
202
221
  --color-base-300: #20252e;
203
222
 
204
- --color-info: var(--color-wave-300);
223
+ --color-info: var(--color-wave-300);
205
224
  --color-success: var(--color-nextflow-300);
206
225
  --color-warning: var(--color-multiqc-300);
207
226
  --color-error: var(--color-fusion-300);
@@ -331,7 +350,7 @@ body {
331
350
  --color-brand-1200: #151121;
332
351
  --color-brand-1300: #141024;
333
352
  --color-brand-1400: #110d1d;
334
- --color-brand: #201637;
353
+ --color-brand: #160f26;
335
354
 
336
355
  /* Gray Colors */
337
356
  --color-gray-100: #f7f7f7;
@@ -370,8 +389,10 @@ body {
370
389
  --color-blu-1000: #1e2768;
371
390
  --color-blu: #4256e7;
372
391
 
373
- --color-primary: var(--color-nextflow-900);
374
- --color-secondary: var(--color-nextflow-500);
392
+ /* --color-primary: var(--color-nextflow-800);
393
+ --color-secondary: var(--color-nextflow-500); */
394
+ --color-primary: var(--color-blu-600);
395
+ --color-secondary: var(--color-blu-500);
375
396
  --color-accent: #f59e0b;
376
397
  --color-neutral: #3d4451;
377
398
  --color-base-100: #ffffff;
package/src/styles/buttons.css CHANGED
@@ -1,9 +1,11 @@
1
1
  .btn {
2
2
  border-radius: 4px;
3
3
  transition: all 0.3s;
4
- color: black;
5
- background: var(--color-nextflow-500);
6
- border: 1px solid var(--color-nextflow-700);
4
+ /* background: var(--color-nextflow-500);
5
+ border: 1px solid var(--color-nextflow-700); */
6
+ color: white;
7
+ background: var(--color-blu);
8
+ border: 1px solid var(--color-blu);
7
9
  font-weight: 500;
8
10
  font-size: 0.9rem;
9
11
  text-align: center;
@@ -11,8 +13,8 @@
11
13
  width: auto;
12
14
  text-decoration: none !important;
13
15
  &:hover {
14
- background: var(--color-nextflow-700);
15
-
16
+ /* background: var(--color-nextflow-600); */
17
+ background: var(--color-blu-700);
16
18
  }
17
19
  }
18
20
 
@@ -29,11 +31,12 @@
29
31
  [data-theme='dark'] {
30
32
  .btn {
31
33
  color: black;
32
- background: var(--color-nextflow-400);
33
- border: 1px solid var(--color-nextflow-400);
34
+ background: var(--color-blu-400);
35
+ border: 1px solid var(--color-blu-400);
34
36
  &:hover {
35
- background: var(--color-nextflow-600);
36
- border: 1px solid var(--color-nextflow-700);
37
+ /* background: var(--color-nextflow-600); */
38
+ background: var(--color-blu-700);
39
+ border: 1px solid var(--color-blu-700);
37
40
  }
38
41
  }
39
42
  .btn-outline {
package/src/theme/Homepage/index.tsx CHANGED
@@ -27,19 +27,19 @@ const CARD_DATA = {
27
27
  platform: [
28
28
  {
29
29
  href: '/platform-cloud/',
30
- icon: <IconSeqeraCloud className="text-brand dark:text-white" />,
30
+ icon: <IconSeqeraCloud className="text-black" />,
31
31
  title: 'Seqera Cloud',
32
32
  description: 'Comprehensive platform empowering teams across the entire scientific lifecycle',
33
33
  },
34
34
  {
35
35
  href: '/platform-enterprise/',
36
- icon: <IconSeqeraEnterprise className="text-brand dark:text-white" />,
36
+ icon: <IconSeqeraEnterprise className="text-black" />,
37
37
  title: 'Seqera Enterprise',
38
38
  description: 'Platform management within your own infrastructure for greater control',
39
39
  },
40
40
  {
41
41
  href: '/fusion/',
42
- icon: <IconFusion className="text-brand dark:text-white" />,
42
+ icon: <IconFusion className="text-fusion-600" />,
43
43
  title: 'Fusion',
44
44
  description: 'Optimized file system for cloud-native data pipelines',
45
45
  },
@@ -47,13 +47,13 @@ const CARD_DATA = {
47
47
  ai: [
48
48
  {
49
49
  href: '/platform-cloud/seqera-ai/',
50
- icon: <IconAI className="text-brand max-w-5.5" />,
50
+ icon: <IconAI className="text-black max-w-5.5" />,
51
51
  title: 'Seqera AI',
52
52
  description: 'Intelligent command-line assistant that helps you build, run, and manage bioinformatics workflows',
53
53
  },
54
54
  {
55
55
  href: '/platform-cloud/seqera-mcp/',
56
- icon: <IconMCP className="text-brand max-w-5.5" />,
56
+ icon: <IconMCP className="text-black max-w-5.5" />,
57
57
  title: 'Seqera MCP',
58
58
  description: 'AI assistant that interacts with the Seqera ecosystem',
59
59
  },
@@ -61,19 +61,19 @@ const CARD_DATA = {
61
61
  openSource: [
62
62
  {
63
63
  href: '/nextflow/',
64
- icon: <IconNextflow className="text-brand dark:text-white" />,
64
+ icon: <IconNextflow className="text-nextflow-600" />,
65
65
  title: 'Nextflow',
66
66
  description: 'Open-source orchestrator for deploying workflows',
67
67
  },
68
68
  {
69
69
  href: '/wave/',
70
- icon: <IconWave className="text-brand dark:text-white" />,
70
+ icon: <IconWave className="text-wave-600" />,
71
71
  title: 'Wave',
72
72
  description: 'Next-generation container provisioning for data analysis',
73
73
  },
74
74
  {
75
75
  href: '/multiqc/',
76
- icon: <IconMultiQC className="text-brand dark:text-white" />,
76
+ icon: <IconMultiQC className="text-multiqc-600" />,
77
77
  title: 'MultiQC',
78
78
  description: 'Open-source tool to aggregate bioinformatic analyses results',
79
79
  },
@@ -81,19 +81,19 @@ const CARD_DATA = {
81
81
  help: [
82
82
  {
83
83
  href: 'https://support.seqera.io/',
84
- icon: <IconQuestionMark className="text-brand" />,
84
+ icon: <IconQuestionMark className="text-black" />,
85
85
  title: 'Support Portal',
86
86
  description: 'Contact support for help with your platform or enterprise account',
87
87
  },
88
88
  {
89
89
  href: 'https://community.seqera.io/',
90
- icon: <IconChatBubbles className="text-brand" />,
90
+ icon: <IconChatBubbles className="text-black" />,
91
91
  title: 'Community Forum',
92
92
  description: 'Discuss, share and network with other users',
93
93
  },
94
94
  {
95
95
  href: 'https://status.seqera.io/',
96
- icon: <IconServiceStatus className="text-brand" />,
96
+ icon: <IconServiceStatus className="text-black" />,
97
97
  title: 'Service Status',
98
98
  description: 'Monitor platform performance in real time',
99
99
  },