Skip to content
GitLab
Commit fdc3d3b0 authored by Sandro Lutz's avatar Sandro Lutz Committed by Sandro Lutz
Browse files

Add styling for table and table of content on «How to Ersti» page

parent fa49360c
Hide whitespace changes
Inline Side-by-side
src/content/studies/howToErsti/01_generalTips.json
View file @ fdc3d3b0
{
"slug": "1-general-tips",
"title": {
"de": "Generelle Tipps",
"en": "General Tips"
......@@ -9,6 +10,7 @@
},
"subitems": [
{
"slug": "1-first-week",
"title": {
"de": "Erste Woche",
"en": "First Week"
......@@ -18,6 +20,7 @@
}
},
{
"slug": "1-organisation-and-studydocuments",
"title": {
"de": "Organisation und Studienunterlagen",
"en": "Organisation and Study Documents"
......@@ -27,6 +30,7 @@
}
},
{
"slug": "1-lectures",
"title": {
"de": "Vorlesungen",
"en": "Lectures"
......@@ -36,6 +40,7 @@
}
},
{
"slug": "1-exercises",
"title": {
"de": "Übungen",
"en": "Exercises"
......@@ -45,6 +50,7 @@
}
},
{
"slug": "1-study-center",
"title": {
"de": "Study Center",
"en": "Study Center"
......@@ -54,6 +60,7 @@
}
},
{
"slug": "1-workshop-internship",
"title": {
"de": "Werkstattpraktikum (MAVT)",
"en": "Workshop Internship (MAVT)"
......@@ -63,6 +70,7 @@
}
},
{
"slug": "1-pressure",
"title": {
"de": "Druck",
"en": "Pressure"
......@@ -72,6 +80,7 @@
}
},
{
"slug": "1-balance",
"title": {
"de": "Ausgleich",
"en": "Balance"
......@@ -81,6 +90,7 @@
},
"subitems": [
{
"slug": "1-sports",
"title": {
"de": "Sport",
"en": "Sports"
......@@ -92,12 +102,14 @@
]
},
{
"slug": "1-zurich",
"title": {
"de": "Zürich",
"en": "Zurich"
},
"subitems": [
{
"slug": "1-transportation-and-nature",
"title": {
"de": "Transport & Natur",
"en": "Transportation & Nature"
......@@ -107,6 +119,7 @@
}
},
{
"slug": "1-culture",
"title": {
"de": "Kultur",
"en": "Culture"
......@@ -116,6 +129,7 @@
}
},
{
"slug": "1-living",
"title": {
"de": "Wohnen",
"en": "Living"
......
src/content/studies/howToErsti/02_firstYearAndFirstYearsExam.json
View file @ fdc3d3b0
{
"slug": "2-first-year-and-exam",
"title": {
"de": "Basisjahr und Basisprüfung",
"en": "First Year and Exam"
......@@ -8,6 +9,7 @@
},
"subitems": [
{
"slug": "2-motivation-for-good-grades",
"title": {
"de": "Motivation für gute Noten",
"en": "Motivation for good Grades"
......@@ -17,6 +19,7 @@
}
},
{
"slug": "2-exercises",
"title": {
"de": "Serien",
"en": "Exercises"
......@@ -26,6 +29,7 @@
}
},
{
"slug": "2-summaries",
"title": {
"de": "Zusammenfassungen",
"en": "Summaries"
......@@ -35,6 +39,7 @@
}
},
{
"slug": "2-mid-term-exams",
"title": {
"de": "Zwischenprüfungen",
"en": "Mid-term exams"
......@@ -44,6 +49,7 @@
}
},
{
"slug": "2-studying-phase-winter",
"title": {
"de": "Lernphase Winter",
"en": "Studying Phase Winter"
......@@ -53,6 +59,7 @@
}
},
{
"slug": "2-studying-phase-summer",
"title": {
"de": "Lernphase Sommer",
"en": "Studying Phase Summer"
......@@ -62,6 +69,7 @@
}
},
{
"slug": "2-working-alongside-your-studies",
"title": {
"de": "Arbeiten neben dem Studium",
"en": "Working alongside your Studies"
......@@ -71,6 +79,7 @@
}
},
{
"slug": "2-military-service",
"title": {
"de": "Militärdienst",
"en": "Military Service"
......@@ -80,6 +89,7 @@
}
},
{
"slug": "2-overview-of-lectures-mavt",
"title": {
"de": "Übersicht der Fächer (MAVT)",
"en": "Overview of Lectures (MAVT)"
......@@ -89,6 +99,7 @@
},
"subitems": [
{
"slug": "2-analysis-mavt",
"title": {
"de": "Analysis I + II",
"en": "Analysis I + II"
......@@ -98,6 +109,7 @@
}
},
{
"slug": "2-mechanics-mavt",
"title": {
"de": "Mechanik I + II",
"en": "Mechanics I + II"
......@@ -107,6 +119,7 @@
}
},
{
"slug": "2-wuf-mavt",
"title": {
"de": "Werkstoffe und Fertigung I + II",
"en": "Werkstoffe und Fertigung I + II"
......@@ -116,6 +129,7 @@
}
},
{
"slug": "2-maschinenelemente-mavt",
"title": {
"de": "Maschinenelemente und Innovationsprozesse",
"en": "Maschinenelemente und Innovationsprozesse"
......@@ -125,15 +139,17 @@
}
},
{
"slug": "2-linear-algebra-mavt",
"title": {
"de": "Lineare Algebra I + II",
"en": "Lineare Algebra I + II"
"en": "Linear Algebra I + II"
},
"content": {
"de": "Prof. Hungerbühler hält die Vorlesung schon seit vielen Jahren, dementsprechend ist sie schon sehr optimiert, wie ihr an seinem Tafelbild und dem zügigen Tempo erkennen werdet. Mitschreiben ist hier optional - Lineare Algebra von Nipp und Stoffer bietet eine gute Grundlage für die Theorie und so kann man den Ausführungen besser folgen. Die Konzepte aus LinAlg werdet ihr in jedem anderen Fach in den nächsten Jahren brauchen.\n\nZusammenfassung: Robin Frauenfelder (& seine Übungsstunden-Slides -> Höhersemestrige fragen)"
}
},
{
"slug": "2-computer-science-mavt",
"title": {
"de": "Informatik",
"en": "Computer Science"
......@@ -143,6 +159,7 @@
}
},
{
"slug": "2-chemistry-mavt",
"title": {
"de": "Chemie",
"en": "Chemistry"
......@@ -154,15 +171,17 @@
]
},
{
"slug": "2-overview-of-lectures-itet",
"title": {
"de": "Übersicht der Fächer (ITET)",
"en": "Overview of Lectures (ITET)"
},
"content": {
"de": "| **Kurse** | **ECTS** | **Stunden** |\n|----------------|-----------------|--------------------|\n| Analysis I | 8 KP | 4V+3U |\n| Lineare Algebra | 5 KP | 3V+2U |\n| Technische Mechanik | 4 KP | 2V+1K+2U |\n| Netzwerke und Schaltungen I | 4 KP | 2V+2U |\n| Digitaltechnik | 4 KP | 2V+2U |\n\n| **Kurse** | **ECTS** | **Stunden** |\n|----------------|-----------------|--------------------|\n| Analysis II | 8 KP | 4V+2U |\n| Komplexe Analysis | 4 KP | 2V+2U |\n| Physik I | 4 KP | 2V+2U |\n| Informatik I | 4 KP | 2V+2U |\n| Netzwerke und Schaltungen I | 4 KP | 2V+2U |"
"de": "| **Kurse** | **ECTS** | **Stunden** |\n|----------------|-----------------|--------------------|\n| Analysis I | 8 KP | 4V+3U |\n| Lineare Algebra | 5 KP | 3V+2U |\n| Technische Mechanik | 4 KP | 2V+1K+2U |\n| Netzwerke und Schaltungen I | 4 KP | 2V+2U |\n| Digitaltechnik | 4 KP | 2V+2U |\n\n<br/>\n\n| **Kurse** | **ECTS** | **Stunden** |\n|----------------|-----------------|--------------------|\n| Analysis II | 8 KP | 4V+2U |\n| Komplexe Analysis | 4 KP | 2V+2U |\n| Physik I | 4 KP | 2V+2U |\n| Informatik I | 4 KP | 2V+2U |\n| Netzwerke und Schaltungen I | 4 KP | 2V+2U |"
},
"subitems": [
{
"slug": "2-digital-circuits-itet",
"title": {
"de": "Digitaltechnik (Winter)",
"en": "Digital Circuits (Winter)"
......@@ -172,6 +191,7 @@
}
},
{
"slug": "2-engineering-mechanics-itet",
"title": {
"de": "Technische Mechanik (Winter)",
"en": "Engineering Mechanics (Winter)"
......@@ -181,6 +201,7 @@
}
},
{
"slug": "2-networks-and-circuits-1-itet",
"title": {
"de": "Netzwerke und Schaltungen I (Winter)",
"en": "Networks and Circuits (Winter)"
......@@ -190,6 +211,7 @@
}
},
{
"slug": "2-linear-algebra-itet",
"title": {
"de": "Lineare Algebra (Winter)",
"en": "Linear Algebra (Winter)"
......@@ -199,6 +221,7 @@
}
},
{
"slug": "2-analysis-itet",
"title": {
"de": "Analysis I + II (Sommer)",
"en": "Analysis I + II (Summer)"
......@@ -208,6 +231,7 @@
}
},
{
"slug": "2-networks-and-circuits-itet",
"title": {
"de": "Netzwerke und Schaltungen I + II (Sommer)",
"en": "Networks and Circuits I + II (Summer)"
......@@ -217,6 +241,7 @@
}
},
{
"slug": "2-complex-analysis-itet",
"title": {
"de": "Komplexe Analysis (Sommer)",
"en": "Complex Analysis (Summer)"
......@@ -226,6 +251,7 @@
}
},
{
"slug": "2-computer-science-1-itet",
"title": {
"de": "Informatik I (Sommer)",
"en": "Computer Science I (Summer)"
......@@ -235,6 +261,7 @@
}
},
{
"slug": "2-physics-1-itet",
"title": {
"de": "Physik I (Sommer)",
"en": "Physics I (Summer)"
......
src/content/studies/howToErsti/03_tipsForStudentsFromAbroad.json
View file @ fdc3d3b0
{
"slug": "3-tips-for-students-from-abroad",
"title": {
"de": "Tipps für StudentInnen aus dem Ausland",
"en": "Tips for Students from abroad"
},
"subitems": [
{
"slug": "3-insurance",
"title": {
"de": "Versicherung",
"en": "Insurance"
......@@ -14,6 +16,7 @@
}
},
{
"slug": "3-registration-at-district-office",
"title": {
"de": "Anmeldung bei Kreisamt",
"en": "Registration at district office"
......@@ -23,6 +26,7 @@
}
},
{
"slug": "3-bank-account",
"title": {
"de": "Bankkonto",
"en": "Bank Account"
......@@ -32,6 +36,7 @@
}
},
{
"slug": "3-bank-transfer",
"title": {
"de": "Überweisungen",
"en": "Bank Transfers"
......@@ -41,6 +46,7 @@
}
},
{
"slug": "3-driving-license",
"title": {
"de": "Führerscheint",
"en": "Driving License"
......
src/content/studies/howToErsti/04_questions.json
View file @ fdc3d3b0
{
"slug": "4-faq",
"title": {
"de": "Häufig gestellte Fragen",
"en": "FAQ"
......
src/content/studies/howToErsti/_example.json
View file @ fdc3d3b0
{
"comment": "Do NOT delete this file. This is needed so that the graphql queries succeed.",
"hidden": true,
"slug": "example",
"title": {
"de": "Ein Titel auf Deutsch. Mindestens eine Sprache muss vorhanden sein!",
"en": "A title in English. At least one language must be present!"
......@@ -13,6 +14,7 @@
{
"comment": "Do NOT delete this file. This is needed so that the graphql queries succeed.",
"hidden": true,
"slug": "example2",
"title": {
"de": "Ein Titel auf Deutsch. Mindestens eine Sprache muss vorhanden sein!",
"en": "A title in English. At least one language must be present!"
......@@ -25,6 +27,7 @@
{
"comment": "Do NOT delete this file. This is needed so that the graphql queries succeed.",
"hidden": true,
"slug": "example3",
"title": {
"de": "Ein Titel auf Deutsch. Mindestens eine Sprache muss vorhanden sein!",
"en": "A title in English. At least one language must be present!"
......
src/intl/de.json
View file @ fdc3d3b0
......@@ -61,6 +61,8 @@
"mainMenu.logout": "Ausloggen",
"mainMenu.profile": "Profil",
"mainMenu.toggleTheme": "Wechseln zwischen hell/dunkel",
"tableOfContent.show": "Inhaltsverzeichnis anzeigen",
"tableOfContent.hide": "Inhaltsverzeichnis ausblenden",
"home.title": "Home",
"about.title": "Über den AMIV",
"studies.howToErsti.title": "Pre-Study Tipps und FAQ",
......
src/intl/en.json
View file @ fdc3d3b0
......@@ -61,6 +61,8 @@
"mainMenu.logout": "Logout",
"mainMenu.profile": "Profile",
"mainMenu.toggleTheme": "Toggle light/dark theme",
"tableOfContent.show": "Show table of content",
"tableOfContent.hide": "Hide table of content",
"home.title": "Home",
"about.title": "About AMIV",
"studies.howToErsti.title": "Pre-Study Tips and FAQ",
......
src/pages/studies/how-to-ersti.js
View file @ fdc3d3b0
......@@ -8,11 +8,14 @@ import FilteredListLayout from '../../components/filteredListPage/layout'
import TranslatedContent from '../../components/general/translatedContent'
const useStyles = makeStyles(
{
theme => ({
root: {
textAlign: 'left',
paddingTop: '2em',
},
filteredListLayout: {
gridTemplateColumns: '30em 1fr',
},
tableOfContent: {
'& span': {
cursor: 'pointer',
......@@ -20,11 +23,39 @@ const useStyles = makeStyles(
'& ul': {
listStyle: 'none',
},
'& > ul > li': {
borderBottom: `1px dashed ${theme.palette.text.secondary}`,
margin: '1em 0',
paddingBottom: '1em',
'&:last-of-type': {
borderBottom: 'none',
},
},
},
content: {
// TODO
'& table': {
width: '100%',
borderCollapse: 'collapse',
borderSpacing: 0,
},
'& table thead': {
borderBottom: '1px solid black',
},
'& table tr:nth-child(even)': {
background: theme.palette.common.grey,
},
},
},
tableOfContentLinkItem: {
color: theme.palette.text.primary,
textDecoration: 'none',
'&:hover': {
color: theme.palette.secondary.main,
},
},
tableOfContentMainLinkItem: {
fontWeight: 600,
},
}),
{ name: 'how-to-ersti' }
)
......@@ -46,6 +77,7 @@ const HowToErstiPage = () => {
nodes {
name
data: childHowToErstiJson {
slug
title {
de
en
......@@ -55,11 +87,17 @@ const HowToErstiPage = () => {
en
}
subitems {
slug
title {
de
en
}
content {
de
en
}
subitems {
slug
title {
en
de
......@@ -69,10 +107,6 @@ const HowToErstiPage = () => {
de
}
}
content {
de
en
}
}
}
}
......@@ -84,17 +118,24 @@ const HowToErstiPage = () => {
const menuItems = []
const contentItems = []
const createMenuItem = (hierarchyLevel, { title, subitems }) => {
const createMenuItem = (hierarchyLevel, { title, slug, subitems }) => {
if (!title) return undefined
const classNames = [classes.tableOfContentLinkItem]
if (hierarchyLevel <= 2) {
classNames.push(classes.tableOfContentMainLinkItem)
}
return (
<li>
<TranslatedContent
content={title}
parseMarkdown={false}
component="span"
component="a"
noEscape
noHint
className={classNames.join(' ')}
href={`#${slug}`}
/>
{subitems && subitems.length > 0 && (
<ul>
......@@ -107,11 +148,15 @@ const HowToErstiPage = () => {
)
}
const createContentItem = (hierarchyLevel, { content, title, subitems }) => {
const createContentItem = (
hierarchyLevel,
{ content, title, slug, subitems }
) => {
return (
<React.Fragment>
{title && (
<TranslatedContent
id={slug}
content={title}
parseMarkdown={false}
component={`h${hierarchyLevel}`}
......@@ -134,17 +179,25 @@ const HowToErstiPage = () => {
)
}
howToErstiJsonNodes.forEach(({ data: { content, title, subitems } }) => {
menuItems.push(createMenuItem(2, { title, subitems }))
contentItems.push(createContentItem(2, { content, title, subitems }))
})
howToErstiJsonNodes.forEach(
({ data: { content, title, slug, subitems } }) => {
menuItems.push(createMenuItem(2, { title, slug, subitems }))
contentItems.push(
createContentItem(2, { content, title, slug, subitems })
)
}
)
return (
<Layout
seoProps={{ title: 'studies.howToErsti.title' }}
className={classes.root}
>
<FilteredListLayout>
<FilteredListLayout
className={classes.filteredListLayout}
showFilterLabel="tableOfContent.show"
hideFilterLabel="tableOfContent.hide"
>
{/* Filter Component */}
<div className={classes.tableOfContent}>
<ul>{menuItems}</ul>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment