Skip to content

Commit 1ebfb47

Browse files
committed
fix: style, html headers and update slide with BIDS tree of the dataset
1 parent 8ce095b commit 1ebfb47

File tree

1 file changed

+135
-84
lines changed
  • docs/assets/fmriprep-bootcamp-geneva2024/day1-02-bids

1 file changed

+135
-84
lines changed

docs/assets/fmriprep-bootcamp-geneva2024/day1-02-bids/index.html

Lines changed: 135 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<title>fMRIPrep Bootcamp | Day 1 :: Brain Imaging Data Structure</title>
55
<meta charset="utf-8">
6-
<link rel="stylesheet" type="text/css" href="/talks/assets/asciinema-player/asciinema-player.css" />
6+
<link rel="stylesheet" type="text/css" href="/assets/asciinema-player/asciinema-player.css" />
77
<style>
88
@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700,400italic);
99

@@ -36,27 +36,34 @@
3636
transform: translateY(-50%);
3737
}
3838

39-
.remark-slide-content { height: 100%; padding: 0; }
40-
.remark-slide-content h1 { font-size: 3em; }
41-
.remark-slide-content h2 { font-size: 2em; }
42-
.remark-slide-content h3 { font-size: 1.6em; }
39+
.remark-slide-content { height: 100%; padding: 0; font-size: 16pt;}
40+
.remark-slide-content h1 { font-size: 2em; color: #324989; }
41+
.remark-slide-content h2 { font-size: 1.5em; color: #324989; }
42+
.remark-slide-content h3 { font-size: 1.2em; color: #324989; }
4343
.footnote {
4444
position: absolute;
4545
bottom: 3em;
4646
font-size: 0.7em;
47-
left: 6em;
4847
}
4948
li p { line-height: 1.25em; }
50-
49+
5150
.remark-slide-content>p { margin-left: 60px; }
5251
.remark-slide-content>ul { margin-left: 60px; }
5352
.remark-slide-content>ul li { margin-left: 0.8em; }
5453

54+
.no-bullet > ul {
55+
list-style-type: none;
56+
padding-left: 0;
57+
}
58+
59+
.no-bullet > ul > li > ul {
60+
padding-left: 2.8em;
61+
}
5562

5663
.red { color: #fa0000; }
5764
.blue { color: #0000fa; }
5865
.green { color: #698b69; }
59-
.large { font-size: 2em; }
66+
6067
a, a > code {
6168
color: rgb(249, 38, 114);
6269
text-decoration: none;
@@ -68,7 +75,6 @@
6875
.remark-code, .remark-inline-code { font-family: 'Roboto Mono'; }
6976
.large .remark-code, .large .remark-inline-code { font-size: 0.8em; }
7077
.remark-code-line-highlighted { background-color: #373832; }
71-
.remark-code { width: 85%; }
7278
.pull-left {
7379
float: left;
7480
width: 45%;
@@ -93,6 +99,25 @@
9399
width: 80%;
94100
}
95101

102+
.fa-solid {
103+
color: #324989;
104+
}
105+
106+
em {
107+
color: #324989;
108+
}
109+
110+
strong {
111+
color: #324989;
112+
}
113+
114+
.gray-text {
115+
color: #888;
116+
}
117+
.gray-text em, .gray-text strong {
118+
color: #888;
119+
}
120+
96121
.perma-sidebar {
97122
float: left;
98123
background-color: #324989;
@@ -133,7 +158,7 @@
133158
left: 20px;
134159
}
135160
#slide-how .slides {
136-
font-size: 0.9em;
161+
/*font-size: .9em;*/
137162
position: absolute;
138163
top: 151px;
139164
right: 140px;
@@ -172,7 +197,7 @@
172197
color: #000;
173198
}
174199
.right-column {
175-
width: 55%;
200+
width: 65%;
176201
float: right;
177202
padding-top: 1em;
178203
}
@@ -186,9 +211,10 @@
186211
color: #000;
187212
}
188213
.right-column2 {
189-
width: 43%;
214+
width: 50%;
190215
float: right;
191216
padding-top: 1em;
217+
margin-right: 2.5em;
192218
}
193219
/* Two-column layout (60% left) */
194220
.left-column3 {
@@ -252,22 +278,27 @@
252278
}
253279

254280
.small {
255-
font-size: 12pt;
281+
font-size: 0.7em;
256282
}
257283

258284
.larger {
259-
font-size: 20pt;
285+
font-size: 1.4em;
260286
}
261287

262288
.large {
263-
font-size: 24pt;
289+
font-size: 1.6em;
264290
}
265291

266292
.boxed-content {
267293
float: left;
268294
display: block;
269295
width: 89%;
270-
height: 70%;
296+
padding-right: 4%;
297+
}
298+
299+
.boxed-bottom {
300+
clear: both;
301+
margin-top: 0px;
271302
}
272303
/*
273304
.distribute {
@@ -306,31 +337,15 @@
306337
color: transparent; /* make the text invisible */
307338
user-select: none; /* prevent selection of the text */
308339
}
309-
.gray-text {
310-
color: #aaa;
311-
}
312-
.install-cmd {
313-
top: 20px;
314-
position: absolute;
315-
right: 4em;
316-
}
317-
figure {
318-
display: block;
319-
margin-left: auto;
320-
margin-right: auto;
321-
font-size: 8pt;
322-
}
323-
figcaption {
324-
text-align: right;
325-
}
326-
figcaption a {
327-
color: #444444;
328-
text-decoration: underline dotted;
340+
341+
.pad-left {
342+
padding-left: 2.0em;
329343
}
344+
330345
</style>
331346
</head>
332347
<body>
333-
<script src="/talks/assets/asciinema-player/asciinema-player.min.js"></script>
348+
<script src="/assets/asciinema-player/asciinema-player.min.js"></script>
334349
<script src="https://kit.fontawesome.com/7e31cfd31d.js" crossorigin="anonymous"></script>
335350
<script type="text/javascript"
336351
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS_CHTML">
@@ -374,7 +389,9 @@
374389

375390
## The Brain Imaging Data Structure (BIDS)
376391

377-
#### Chris Markiewicz &lt;<code>[email protected]</code>> & Oscar Esteban &lt;<code>[email protected]</code>>
392+
Chris Markiewicz &lt;<code>[email protected]</code>>
393+
394+
Oscar Esteban &lt;<code>[email protected]</code>>
378395

379396
]
380397

@@ -395,7 +412,7 @@
395412

396413
---
397414

398-
## Outlook
415+
# Outlook
399416

400417
.right-column3.center[
401418
<a href="https://www.nipreps.org/assets/fmriprep-bootcamp-geneva2024/day1-02-bids/">
@@ -409,20 +426,7 @@
409426

410427
.large[
411428

412-
<br />
413-
414-
* Overview of the neuroimaging pipeline structure
415-
416-
* Why do data require preprocessing?
417-
418-
* *fMRIPrep*
419-
420-
* [Hi]story behind the tool
421-
* Why — just preprocessing
422-
* Why — standardization
423-
* Why — community
424-
425-
* *NiPreps*
429+
*
426430

427431
]]
428432

@@ -433,17 +437,46 @@
433437
template: newsection
434438
name: BIDS
435439

436-
# BIDS: Brain Imaging Data Structure
437-
438440
---
439-
layout: true
440-
template: BIDS
441-
442-
.pull-left[![Bids Layout](images/bids.png)]
443441

444-
---
442+
# BIDS: Brain Imaging Data Structure
445443

446-
.pull-right[
444+
.left-column2.small[
445+
.pad-left[
446+
<i class="fa-solid fa-folder-open"></i> my_dataset/<br />
447+
.pad-left[<i class="fa-solid fa-file-lines"></i> CHANGES]<br />
448+
.pad-left[<i class="fa-solid fa-file-lines"></i> README]<br />
449+
.pad-left[<i class="fa-solid fa-circle-info"></i> dataset_description.json]<br />
450+
.pad-left[<i class="fa-solid fa-circle-info"></i> participants.json]<br />
451+
.pad-left[<i class="fa-solid fa-table"></i> participants.tsv]<br />
452+
.pad-left[<i class="fa-solid fa-circle-info"></i> scans.json]<br />
453+
.pad-left[<i class="fa-solid fa-folder-open"></i> sub-11]<br />
454+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> anat/]]<br />
455+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_T2w.json]]]<br />
456+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_T2w.nii.gz]]]<br />
457+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_acq-denoised_T1w.json]]]<br />
458+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_acq-denoised_T1w.nii.gz]]]<br />
459+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_acq-mp2rage_T1w.json]]]<br />
460+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_acq-mp2rage_T1w.nii.gz]]]<br />
461+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> fmap/]]<br />
462+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_magnitude1.json]]]<br />
463+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_magnitude1.nii.gz]]]<br />
464+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_magnitude2.json]]]<br />
465+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_magnitude2.nii.gz]]]<br />
466+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_phasediff.json]]]<br />
467+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_phasediff.nii.gz]]]<br />
468+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> func/]]<br />
469+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_task-mixed_bold.json]]]<br />
470+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_task-mixed_bold.nii.gz]]]<br />
471+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-table"></i> sub-11_task-mixed_events.tsv]]]<br />
472+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_task-rest_bold.json]]]<br />
473+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_task-rest_bold.nii.gz]]]<br />
474+
.pad-left[.pad-left[<i class="fa-solid fa-table"></i> sub-11_scans.tsv]]<br />
475+
.pad-left[<i class="fa-solid fa-folder"></i> sub-14]<br />
476+
.pad-left[<i class="fa-solid fa-folder"></i> sub-15]<br />
477+
]
478+
]
479+
.right-column2[
447480
* BIDS is a directory structure, based on common practices
448481

449482
* Builds on existing standards (NIfTI, JSON, TSV)
@@ -459,39 +492,57 @@
459492

460493
---
461494

462-
.pull-right[
495+
# BIDS: Brain Imaging Data Structure
463496

497+
.left-column2.small[
498+
.pad-left[
499+
<i class="fa-solid fa-folder-open"></i> my_dataset/<br />
500+
.pad-left[<i class="fa-solid fa-file-lines"></i> CHANGES]<br />
501+
.pad-left[<i class="fa-solid fa-file-lines"></i> README]<br />
502+
.pad-left[<i class="fa-solid fa-circle-info"></i> dataset_description.json]<br />
503+
.pad-left[<i class="fa-solid fa-circle-info"></i> participants.json]<br />
504+
.pad-left[<i class="fa-solid fa-table"></i> participants.tsv]<br />
505+
.pad-left[<i class="fa-solid fa-circle-info"></i> scans.json]<br />
506+
.pad-left[<i class="fa-solid fa-folder-open"></i> sub-11]<br />
507+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> anat/]]<br />
508+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_T2w.json]]]<br />
509+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_T2w.nii.gz]]]<br />
510+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_acq-denoised_T1w.json]]]<br />
511+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_acq-denoised_T1w.nii.gz]]]<br />
512+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_acq-mp2rage_T1w.json]]]<br />
513+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_acq-mp2rage_T1w.nii.gz]]]<br />
514+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> fmap/]]<br />
515+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_magnitude1.json]]]<br />
516+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_magnitude1.nii.gz]]]<br />
517+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_magnitude2.json]]]<br />
518+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_magnitude2.nii.gz]]]<br />
519+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_phasediff.json]]]<br />
520+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_phasediff.nii.gz]]]<br />
521+
.pad-left[.pad-left[<i class="fa-solid fa-folder-open"></i> func/]]<br />
522+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_task-mixed_bold.json]]]<br />
523+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_task-mixed_bold.nii.gz]]]<br />
524+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-table"></i> sub-11_task-mixed_events.tsv]]]<br />
525+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-circle-info"></i> sub-11_task-rest_bold.json]]]<br />
526+
.pad-left[.pad-left[.pad-left[<i class="fa-solid fa-brain"></i> sub-11_task-rest_bold.nii.gz]]]<br />
527+
.pad-left[.pad-left[<i class="fa-solid fa-table"></i> sub-11_scans.tsv]]<br />
528+
.pad-left[<i class="fa-solid fa-folder"></i> sub-14]<br />
529+
.pad-left[<i class="fa-solid fa-folder"></i> sub-15]<br />
530+
]
531+
]
532+
.right-column2[
464533
* Basic metadata in the file names
465534

466535
* Subject, session, imaging modality, etc.
467536
* Generally just enough to assign unique names
468-
469537
]
470538

471-
---
472-
count: false
473-
474-
.pull-right[
475-
* Basic metadata in the file names
476-
* Subject, session, imaging modality, etc.
477-
* Generally just enough to assign unique names
478-
539+
--
540+
.right-column2[
479541
* NIfTI headers and JSON sidecars contain detailed,
480542
image-related metadata
481-
482543
]
483-
484-
---
485-
count: false
486-
487-
.pull-right[
488-
* Basic metadata in the file names
489-
* Subject, session, imaging modality, etc.
490-
* Generally just enough to assign unique names
491-
492-
* NIfTI headers and JSON sidecars contain detailed,
493-
image-related metadata
494-
544+
--
545+
.right-column2[
495546
* [`dataset_description.json`](https://bids-specification.readthedocs.io/en/stable/03-modality-agnostic-files.html#dataset_descriptionjson),
496547
[`participants.tsv`](https://bids-specification.readthedocs.io/en/stable/03-modality-agnostic-files.html#participants-file),
497548
[`sessions.tsv`](https://bids-specification.readthedocs.io/en/stable/05-longitudinal-and-multi-site-studies.html#sessions-file),

0 commit comments

Comments
 (0)