diff --git a/app/www/courses.html b/app/www/courses.html new file mode 100644 index 000000000..7a6679ea2 --- /dev/null +++ b/app/www/courses.html @@ -0,0 +1,165 @@ + + + + UniWorX | Kurse + + + + + + + +
+
+ +
+ + + + +
+

Kurse

+

Wintersemester 2017/2018

+
+
+

Bachelor-Seminar "Web Technologies"

+

+ In diesem Seminar erstellen die Teilnehmer Lehrmaterialien zu ausgewählten aktuellen Web-Technologien. Im Zuge des Seminars werden dazu Folien erstellt, vorgetragen und eine wissenschaftliche Ausarbeitung über das Thema erstellt. +

+
    +
  • +

    Übungsgruppen

    + +
    + + + + + + + + + + + + + + + + + +
    Name (Raum)TerminStudentenTutorAnmeldezeitraum
    Gruppe 1
    Leopoldstraße 13, Raum 1502    		Fr. 09.02.18, 10:0035/35Axel HöslFr. 09.02.18, 10:00Verlassen
    +
    +
    • +
  • +

    Abgaben

    + +
    + Arbitrary content +
    +
    • +
  • +

    Klausuren

    + +
    + Etwas anderes... +
    +
    • +
+
+
+

Blockpraktikum: "Concept Development"

+
    +
  • +

    Übungsgruppen

    + +
    + + + + + + + + + + + + + + + + + +
    Name (Raum)TerminStudentenTutorAnmeldezeitraum
    Gruppe 1
    Leopoldstraße 13, Raum 1502    		Fr. 09.02.18, 10:0035/35Axel HöslFr. 09.02.18, 10:00Verlassen
    +
    +
    • +
  • Abgaben
    • +
+
+
+

Sommersemester 2017

+
+

Human Factors in Engineering

+
    +
  • Klausuren
    • +
+

Vorlesung Multimedia Programmierung

+
    +
  • +

    Übungsgruppen

    +
    • +
  • +

    Abgaben

    +
    + Bisher keine Abgaben für Vorlesung Multimedia Programmierung. +
    +
    • +
  • Klausuren
    • +
+
+
+ + +
+ + diff --git a/app/www/index.html b/app/www/index.html index a21da2d83..16e054251 100644 --- a/app/www/index.html +++ b/app/www/index.html @@ -7,15 +7,14 @@ -
-
- +
-
+

Willkommen bei UniWorX

-
Aktuelles
-
Id ipsum Lorem esse cillum Lorem cillum. Cillum proident culpa id incididunt voluptate esse amet est cillum velit. Mollit nisi labore velit nulla proident do elit exercitation veniam labore sint. Proident non eu nostrud sint laborum commodo voluptate deserunt anim occaecat eu.
-
Excepteur duis nulla reprehenderit ullamco aute elit laboris dolor. Duis aliquip est voluptate Lorem sunt aute cupidatat aute labore cupidatat pariatur mollit consequat elit. Voluptate enim pariatur elit consectetur aliqua ullamco. Laborum irure sit duis enim sunt pariatur cupidatat nisi nostrud duis. Nostrud ex incididunt sit velit veniam cupidatat ullamco nisi sit.
-
Irure ad veniam quis sint elit veniam commodo laborum cupidatat id enim. Pariatur minim qui labore labore. Nisi anim in incididunt exercitation sunt. Qui culpa adipisicing in Lorem aute ex. Consequat quis esse ipsum id ex officia nisi aute exercitation elit. Ea fugiat proident nulla aliqua exercitation elit adipisicing enim. Aliqua aute consequat minim fugiat exercitation ipsum irure esse sit amet eiusmod quis nulla.
-
Proident esse ipsum ad enim fugiat. Et elit voluptate do ullamco laboris consectetur deserunt officia adipisicing. Minim laboris laborum ut non sint ullamco excepteur non mollit laborum irure.
-
Est fugiat incididunt enim veniam aute. Aliqua ad incididunt in eu fugiat irure reprehenderit fugiat magna qui fugiat ullamco laborum. Aute cupidatat id culpa aute irure aliquip eu velit adipisicing. Proident sint et deserunt tempor irure ea duis velit. Sint occaecat consectetur commodo sit eiusmod exercitation enim pariatur amet in. Irure quis aliquip ea deserunt eu consequat consequat ullamco duis. Consequat proident amet mollit quis Lorem cillum mollit enim commodo.
-
Do id minim ex eiusmod labore et nulla est incididunt qui laborum. Consectetur et cupidatat voluptate eiusmod magna laborum enim cupidatat esse id do consequat est. Aliqua sunt laborum deserunt in. Officia dolore excepteur dolore Lorem culpa.
+

Übungsblatt Deadlines

+

Keine kommenden Übungsblatt-Deadlines.

+

Klausuren

-
Mehr Aktuelles...
-
Id ipsum Lorem esse cillum Lorem cillum. Cillum proident culpa id incididunt voluptate esse amet est cillum velit. Mollit nisi labore velit nulla proident do elit exercitation veniam labore sint. Proident non eu nostrud sint laborum commodo voluptate deserunt anim occaecat eu.
-
Excepteur duis nulla reprehenderit ullamco aute elit laboris dolor. Duis aliquip est voluptate Lorem sunt aute cupidatat aute labore cupidatat pariatur mollit consequat elit. Voluptate enim pariatur elit consectetur aliqua ullamco. Laborum irure sit duis enim sunt pariatur cupidatat nisi nostrud duis. Nostrud ex incididunt sit velit veniam cupidatat ullamco nisi sit.
-
Irure ad veniam quis sint elit veniam commodo laborum cupidatat id enim. Pariatur minim qui labore labore. Nisi anim in incididunt exercitation sunt. Qui culpa adipisicing in Lorem aute ex. Consequat quis esse ipsum id ex officia nisi aute exercitation elit. Ea fugiat proident nulla aliqua exercitation elit adipisicing enim. Aliqua aute consequat minim fugiat exercitation ipsum irure esse sit amet eiusmod quis nulla.
+ + + + + + + + + + + + + + + +
VeranstaltungKlausurBeginnAnmelde-DeadlineCheck
Kurs Zeichnen und Skizzieren von SzenarienAbschlusspräsentationFr. 09.02.18, 10:00Fr. 02.02.18, 10:00X
- - -
diff --git a/app/www/src/css/main.css b/app/www/src/css/main.css index 3425174a0..023c46d6d 100644 --- a/app/www/src/css/main.css +++ b/app/www/src/css/main.css @@ -1,15 +1,9 @@ -:root { - --header-height: 60px; - --header-height-collapsed: 40px; - --footer-height: 50px; -} - .grid { display: grid; height: 100%; grid-template-columns: repeat(12, 1fr); grid-template-rows: var(--header-height) auto var(--footer-height); - grid-gap: 40px; + grid-gap: 20px; } .grid > header { @@ -37,16 +31,83 @@ grid-row-start: 3; } +.box { + position: relative; + padding: 13px 24px; + display: flex; + flex-direction: column; + margin-bottom: 20px; + font-size: 16px; +} + +.box ul { + margin-left: 10px; + margin-bottom: 5px; +} + +.box p { + margin-bottom: 13px; +} + +.course-box { + border-left: 1px solid #afb5df; + padding: 4px 20px; + position: relative; +} + +.course-box li { + padding-left: 7px; + padding-bottom: 13px; +} + +.course-box li h4::before { + content: '>'; + position: absolute; + margin-left: -13px; + font-weight: 800; +} + +.course-box li h4:hover { + cursor: pointer; +} + +.course-box li h4:hover::before { + content: 'v'; +} + +.course-box li.collapsed { + padding-bottom: 0; +} + +.course-box li.collapsed > * { + display: none; +} + +.course-box li.collapsed h4 { + display: block; +} + +.course-box li.collapsed h4::before { + content: '>'; +} + +.course-box li.collapsed h4:hover::before { + content: 'v'; +} + +.course-box .course { + margin-bottom: 7px; +} + * { - -webkit-box-sizing: border-box; - box-sizing: border-box; + box-sizing: border-box; padding: 0; margin: 0; } body { - background-color: #1d1c1d; - color: #fff; + background-color: #ffffff; + color: #353535; font-family: "Source Sans Pro", Helvetica, sans-serif; font-weight: 400; font-size: 18px; @@ -59,12 +120,11 @@ a:link { color: inherit; text-decoration: none; font-weight: 600; - -webkit-transition: color .2s ease, background-color .2s ease; transition: color .2s ease, background-color .2s ease; } a:hover { - color: #72a85b; + color: #38428a; } ul { @@ -75,115 +135,97 @@ ul.flat > li { display: inline-block; } +h1, h2, h3, h4, h5 { + font-weight: 600; +} + h1 { - font-size: 48px; - line-height: 48px; - font-weight: 300; - margin: 20px 0 40px; + font-size: 32px; + margin: 20px 0 5px; } -.text, .event-desc { - margin-bottom: 20px; - line-height: 1.4; +h2 { + font-size: 24px; + margin: 10px 0 0; } -header { +h3 { + font-size: 20px; + margin: 5px 0 0; +} + +h4 { + font-size: 16px; + margin: 0; +} + +th, td { + text-align: left; + padding: 0 2px 0 4px; + border-left: 1px solid #38428a; +} + +th:first-of-type, td:first-of-type { + border: none; +} + +.header { position: relative; - display: -webkit-box; - display: -ms-flexbox; display: flex; - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: justify; - -ms-flex-pack: justify; - justify-content: space-between; - padding: 12px 24px; + flex-direction: row; + align-items: center; + justify-content: space-between; + padding: 0 24px; height: var(--header-height); line-height: var(--header-height); - background-color: #72a85b; + background-color: #38428a; width: 100%; + text-align: right; overflow: hidden; z-index: 100; - -webkit-transition: height .2s ease, line-height .2s ease; transition: height .2s ease, line-height .2s ease; } -header.sticky { +.header.sticky { position: fixed; top: 0; } -header.collapsed { +.header.collapsed { height: var(--header-height-collapsed); line-height: var(--header-height-collapsed); } -header.collapsed:before { +.header.collapsed:before { height: 30px; } -header > nav.horizontal li a { - padding: 0 13px 0; +.header .horizontal { + width: 100%; +} + +.header > nav.horizontal li a { + padding: 13px; position: relative; height: 100%; display: inline-block; - color: #fff; + color: #eaf2ff; } -header > nav.horizontal li a:hover { - background-color: white; +.header > nav.horizontal li a:hover { + background-color: #2e3671; } -footer { +.main-content { + font-size: 16px; +} + +.footer { text-align: right; padding: 7px 24px; overflow: hidden; - background-color: #72a85b; -} - -.box { - background-color: #3c3c3c; - position: relative; - padding: 24px; - padding-top: 60px; - -webkit-box-shadow: 0 1px 2px #656565; - box-shadow: 0 1px 2px #656565; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-orient: vertical; - -webkit-box-direction: normal; - -ms-flex-direction: column; - flex-direction: column; - margin-bottom: 20px; -} - -.box .box-title { - content: attr(data-title); - position: absolute; - color: #fff; - top: -3px; - left: -3px; - width: calc(100% + 6px); - background-color: #72a85b; - padding: 7px 23px; - font-size: 20px; - font-weight: 600; - overflow: hidden; - display: block; -} - -.box.event-box { - -webkit-box-orient: horizontal; - -webkit-box-direction: normal; - -ms-flex-direction: row; - flex-direction: row; - margin-bottom: 20px; + background-color: #38428a; + color: #eaf2ff; } .event-desc { @@ -191,45 +233,23 @@ footer { } .button, .event-registration { - background-color: #72a85b; - display: -webkit-box; - display: -ms-flexbox; + background-color: #38428a; display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - justify-content: center; + align-items: center; + justify-content: center; padding: 3px 13px; cursor: pointer; font-weight: 600; - -webkit-transition: background-color .2s ease, -webkit-transform .1s; - transition: background-color .2s ease, -webkit-transform .1s; transition: transform .1s, background-color .2s ease; - transition: transform .1s, background-color .2s ease, -webkit-transform .1s; } .button:hover, .event-registration:hover { - background-color: #5b8848; - -webkit-transform: scale(1.01); - transform: scale(1.01); + background-color: #293166; + transform: scale(1.01); } -.has-diagonal:before, header:before, .box .box-title:before { - content: ''; - position: absolute; - top: -10px; - right: -25px; - height: 60px; - width: 310px; - -webkit-transform: rotate(12deg); - transform: rotate(12deg); - background-color: rgba(255, 255, 255, 0.4); - display: block; - -webkit-transition: height .2s; - transition: height .2s; - -webkit-transform-origin: top right; - transform-origin: top right; +.hidden { + display: none; + visibility: hidden; } /*# sourceMappingURL=main.css.map */ \ No newline at end of file diff --git a/app/www/src/css/main.css.map b/app/www/src/css/main.css.map index 7d9868885..8fce36b37 100644 --- a/app/www/src/css/main.css.map +++ b/app/www/src/css/main.css.map @@ -1,8 +1,12 @@ { "version": 3, - "mappings": "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", + "mappings": "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", "sources": [ - "../scss/main.scss" + "../scss/main.scss", + "../scss/_grid.scss", + "../scss/_colors.scss", + "../scss/modules/_box.scss", + "../scss/_colors.scss" ], "names": [], "file": "main.css" diff --git a/app/www/src/js/config.js b/app/www/src/js/config.js index b6d39c8bd..88e04598d 100644 --- a/app/www/src/js/config.js +++ b/app/www/src/js/config.js @@ -1,16 +1,8 @@ define(function (require) { - var counter = 0; - return { - count: function() { - counter++; - }, init: function() { - console.log('Config.init'); - }, - counter: function() { - return counter; + console.log('Config.init()'); } }; }); diff --git a/app/www/src/js/helper/show_hide.js b/app/www/src/js/helper/show_hide.js new file mode 100644 index 000000000..f6117cc61 --- /dev/null +++ b/app/www/src/js/helper/show_hide.js @@ -0,0 +1,38 @@ +define(function (require) { + + var elements = null, + toggles = null, + collapsed; + + function addEventHandlers() { + elements.forEach(function(el) { + el.addEventListener('click', function elClickListener() { + var index = el.dataset.index; + var toggle = toggles[index]; + if (toggle.collapsed) { + toggle.parent.classList.remove('collapsed'); + } else { + toggle.parent.classList.add('collapsed'); + } + toggle.collapsed = !toggle.collapsed; + }); + }); + } + + return { + init: function(cllpsd) { + elements = Array.from(document.querySelectorAll('.js-show-hide-toggle')); + toggles = []; + collapsed = !!cllpsd; + + elements.forEach(function(el, i) { + var target = el.nextElementSibling; + el.dataset.index = i; + var coll = el.parentElement.classList.contains('collapsed'); + toggles.push({index: i, target: target, collapsed: coll, parent: el.parentElement}); + }); + + addEventHandlers(); + } + }; +}); diff --git a/app/www/src/js/main.js b/app/www/src/js/main.js index b029ee948..e9a481c67 100644 --- a/app/www/src/js/main.js +++ b/app/www/src/js/main.js @@ -1,3 +1,4 @@ -requirejs(["config", "helper/sticky_menu", "api"], function(config, sticky_menu, api) { +requirejs(["config", "api", "helper/sticky_menu", "helper/show_hide"], function(config, api, sticky_menu, show_hide) { sticky_menu.init(); + show_hide.init(); }); diff --git a/app/www/src/scss/_colors.scss b/app/www/src/scss/_colors.scss new file mode 100644 index 000000000..0c5869c2e --- /dev/null +++ b/app/www/src/scss/_colors.scss @@ -0,0 +1,12 @@ +// THEME 1 +$base00: #72a85b; +$base-bg-color: #1d1c1d; +$base-font-color: #fff; +$sec-font-color: #fff; +$box-bg-color: #3c3c3c; +// THEME 2 +$base00: #38428a; +$base-bg-color: #ffffff; +$base-font-color: rgb(53, 53, 53); +$sec-font-color: #eaf2ff; +$box-bg-color: #dddddd; diff --git a/app/www/src/scss/_grid.scss b/app/www/src/scss/_grid.scss new file mode 100644 index 000000000..0ff293d1b --- /dev/null +++ b/app/www/src/scss/_grid.scss @@ -0,0 +1,32 @@ +.grid { + display: grid; + height: 100%; + grid-template-columns: repeat(12, 1fr); + grid-template-rows: var(--header-height) auto var(--footer-height); + grid-gap: 20px; + + > header { + grid-column: span 12; + } + + > .sidebar { + grid-column: 2 / span 2; + grid-row-start: 2; + } + + > .sidebar-right { + display: none; + grid-column: span 2; + grid-row-start: 2; + } + + > section { + grid-column: 4 / span 8; + grid-row-start: 2; + } + + > footer { + grid-column: span 12; + grid-row-start: 3; + } +} \ No newline at end of file diff --git a/app/www/src/scss/main.scss b/app/www/src/scss/main.scss index 695a7f9c1..0053a4c24 100644 --- a/app/www/src/scss/main.scss +++ b/app/www/src/scss/main.scss @@ -1,59 +1,9 @@ -// THEME 1 -$base00: #72a85b; -$base-bg-color: #1d1c1d; -$base-font-color: #fff; -$sec-font-color: #fff; -$box-bg-color: #3c3c3c; -// THEME 2 -// $base00: #639ac7; -// $base-bg-color: #f3f3f3; -// $base-font-color: rgb(53, 53, 53); -// $sec-font-color: #eaf2ff; -// $box-bg-color: #dddddd; +@import 'grid'; +@import 'colors'; -// VARIABLES -:root { - --header-height: 60px; - --header-height-collapsed: 40px; - --footer-height: 50px; -} +// modules +@import 'modules/box'; -// GRID SETUP -.grid { - display: grid; - height: 100%; - grid-template-columns: repeat(12, 1fr); - grid-template-rows: var(--header-height) auto var(--footer-height); - grid-gap: 40px; - - > header { - grid-column: span 12; - } - - > .sidebar { - grid-column: 2 / span 2; - grid-row-start: 2; - } - - > .sidebar-right { - display: none; - grid-column: span 2; - grid-row-start: 2; - } - - > section { - grid-column: 4 / span 8; - grid-row-start: 2; - } - - > footer { - grid-column: span 12; - grid-row-start: 3; - } -} - - -// BASIC SETUP * { box-sizing: border-box; padding: 0; @@ -89,35 +39,54 @@ ul { } } +h1, h2, h3, h4, h5 { + font-weight: 600; +} h1 { - font-size: 48px; - line-height: 48px; - font-weight: 300; - margin: 20px 0 40px; + font-size: 32px; + margin: 20px 0 5px; +} +h2 { + font-size: 24px; + margin: 10px 0 0; +} +h3 { + font-size: 20px; + margin: 5px 0 0; +} +h4 { + font-size: 16px; + margin: 0; } -.text { - margin-bottom: 20px; - line-height: 1.4; +th, td { + text-align: left; + padding: 0 2px 0 4px; + border-left: 1px solid $base00; + + &:first-of-type { + border: none; + } } -// MACRO DESIGN -header { +// END GLOBAL + +.header { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: space-between; - padding: 12px 24px; + padding: 0 24px; height: var(--header-height); line-height: var(--header-height); background-color: $base00; width: 100%; + text-align: right; overflow: hidden; z-index: 100; // box-shadow: 0 0 40px 40px rgba(0, 0, 0, 0.1); transition: height .2s ease, line-height .2s ease; - @extend .has-diagonal; &.sticky { position: fixed; @@ -133,70 +102,39 @@ header { } } + .horizontal { + width: 100%; + } + > nav.horizontal li a { - padding: 0 13px 0; + padding: 13px; position: relative; height: 100%; display: inline-block; color: $sec-font-color; &:hover { - background-color: white; + background-color: darken($base00, 7%); } } } .main-content { - // padding: 24px; + font-size: 16px; } -footer { +.footer { text-align: right; padding: 7px 24px; overflow: hidden; background-color: $base00; -} - -.box { - background-color: $box-bg-color; - position: relative; - padding: 24px; - padding-top: 60px; - box-shadow: 0 1px 2px #656565; - display: flex; - flex-direction: column; - margin-bottom: 20px; - - .box-title { - content: attr(data-title); - position: absolute; - color: $sec-font-color; - top: -3px; - left: -3px; - width: calc(100% + 6px); - background-color: $base00; - padding: 7px 23px; - font-size: 20px; - font-weight: 600; - overflow: hidden; - display: block; - @extend .has-diagonal; - } - - &.event-box { - // background-color: white; - // color: $base-bg-color; - flex-direction: row; - margin-bottom: 20px; - - } + color: $sec-font-color; } .event-registration { @extend .button; } .event-desc { - @extend .text; padding: 0 13px; } @@ -217,19 +155,7 @@ footer { } } -.has-diagonal { - - &:before { - content: ''; - position: absolute; - top: -10px; - right: -25px; - height: 60px; - width: 310px; - transform: rotate(12deg); - background-color: rgba(255, 255, 255, 0.4); - display: block; - transition: height .2s; - transform-origin: top right; - } +.hidden { + display: none; + visibility: hidden; } \ No newline at end of file diff --git a/app/www/src/scss/modules/_box.scss b/app/www/src/scss/modules/_box.scss new file mode 100644 index 000000000..563d97133 --- /dev/null +++ b/app/www/src/scss/modules/_box.scss @@ -0,0 +1,68 @@ +@import '../colors'; + +.box { + position: relative; + padding: 13px 24px; + display: flex; + flex-direction: column; + margin-bottom: 20px; + font-size: 16px; + + ul { + margin-left: 10px; + margin-bottom: 5px; + } + + p { + margin-bottom: 13px; + } + +} + +// COURSE BOX +.course-box { + border-left: 1px solid lighten($base00, 40%); + padding: 4px 20px; + position: relative; + + li { + padding-left: 7px; + padding-bottom: 13px; + + h4::before { + content: '>'; + position: absolute; + margin-left: -13px; + font-weight: 800; + } + h4:hover { + cursor: pointer; + } + h4:hover::before { + content: 'v'; + } + } + + + li.collapsed { + padding-bottom: 0; + + > * { + display: none; + } + h4 { + display: block; + } + + h4::before { + content: '>'; + } + h4:hover::before { + content: 'v'; + } + } + + .course { + margin-bottom: 7px; + } +} \ No newline at end of file