started working on course-pages
This commit is contained in:
parent
73500274ec
commit
f2948c075d
@ -1,38 +1,34 @@
|
|||||||
<div .masthead>
|
<div .course-header>
|
||||||
<div .container>
|
<div .course-header__info>
|
||||||
<div .row>
|
<table>
|
||||||
<h1 .header>
|
<tr>
|
||||||
#{courseName course}
|
<th>Teilnehmer
|
||||||
$maybe school <- schoolMB
|
<td>
|
||||||
<h4>
|
#{participants}
|
||||||
#{schoolName school}
|
$maybe capacity <- courseCapacity course
|
||||||
<div .container>
|
\ von #{capacity}
|
||||||
<div .bs-docs-section>
|
<tr>
|
||||||
<div .row>
|
<th>Anmeldezeitraum
|
||||||
<div .col-lg-12>
|
<td>
|
||||||
<div .page-header>
|
$maybe regFrom <- courseRegisterFrom course
|
||||||
|
#{formatTimeGerWD regFrom}
|
||||||
|
$maybe regTo <- courseRegisterTo course
|
||||||
|
\ bis #{formatTimeGerWD regTo}
|
||||||
|
|
||||||
$maybe descr <- courseDescription course
|
<div>
|
||||||
<h2 #description>Beschreibung
|
<form method=post action=@{CourseShowR tid csh} enctype=#{regEnctype}>
|
||||||
<p> #{descr}
|
^{regWidget}
|
||||||
$maybe link <- courseLinkExternal course
|
|
||||||
<h4 #linl>Homepage
|
<div .course-header__title>
|
||||||
<a href=#{link}>#{link}
|
<h1>#{courseName course}
|
||||||
<div .row>
|
$maybe school <- schoolMB
|
||||||
<div .col-lg-12>
|
<h4>#{schoolName school}
|
||||||
<h4>Teilnehmer
|
|
||||||
#{participants}
|
|
||||||
$maybe capacity <- courseCapacity course
|
|
||||||
\ von #{capacity}
|
|
||||||
<br>
|
|
||||||
$maybe regFrom <- courseRegisterFrom course
|
|
||||||
Anmeldezeitraum: #{formatTimeGerWD regFrom}
|
|
||||||
$maybe regTo <- courseRegisterTo course
|
|
||||||
\ bis #{formatTimeGerWD regTo}
|
|
||||||
<form method=post action=@{CourseShowR tid csh} enctype=#{regEnctype}>
|
|
||||||
^{regWidget}
|
|
||||||
|
|
||||||
|
|
||||||
|
<div>
|
||||||
<hr>
|
$maybe descr <- courseDescription course
|
||||||
|
<h2 #description>Beschreibung
|
||||||
|
<p> #{descr}
|
||||||
|
$maybe link <- courseLinkExternal course
|
||||||
|
<h4 #linl>Homepage
|
||||||
|
<a href=#{link}>#{link}
|
||||||
|
|||||||
19
templates/course.lucius
Normal file
19
templates/course.lucius
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
.course-header {
|
||||||
|
/*display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-header__title {
|
||||||
|
align-self: baseline;
|
||||||
|
}
|
||||||
|
.course-header__info {
|
||||||
|
border: 1px solid var(--greybase);
|
||||||
|
padding: 13px;
|
||||||
|
align-self: center;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-header__info table {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
@ -142,6 +142,7 @@ th {
|
|||||||
.main__content {
|
.main__content {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
padding: 20px 40px;
|
padding: 20px 40px;
|
||||||
|
padding-right: 0;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
|
|
||||||
|
|||||||
@ -57,11 +57,9 @@
|
|||||||
|
|
||||||
this.addTo = function(parentElement) {
|
this.addTo = function(parentElement) {
|
||||||
parentElement.appendChild(this.container);
|
parentElement.appendChild(this.container);
|
||||||
parentElement.appendChild(this.remover);
|
|
||||||
}
|
}
|
||||||
this.remove = function() {
|
this.remove = function() {
|
||||||
this.container.remove();
|
this.container.remove();
|
||||||
this.remover.remove();
|
|
||||||
}
|
}
|
||||||
this.isValid = function() {
|
this.isValid = function() {
|
||||||
return this.container.classList.contains('file-input__container--valid');
|
return this.container.classList.contains('file-input__container--valid');
|
||||||
@ -140,6 +138,7 @@
|
|||||||
nextInput.setAttribute('type', 'file');
|
nextInput.setAttribute('type', 'file');
|
||||||
cont.appendChild(nextInput);
|
cont.appendChild(nextInput);
|
||||||
cont.appendChild(desc);
|
cont.appendChild(desc);
|
||||||
|
cont.appendChild(remover);
|
||||||
return new FileInput(cont, nextInput, desc, remover);
|
return new FileInput(cont, nextInput, desc, remover);
|
||||||
}
|
}
|
||||||
// initial setup
|
// initial setup
|
||||||
@ -179,6 +178,7 @@
|
|||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
|
||||||
|
// setup reactive labels
|
||||||
Array.from(document.querySelectorAll('.reactive-label')).forEach(function(label) {
|
Array.from(document.querySelectorAll('.reactive-label')).forEach(function(label) {
|
||||||
var input = document.querySelector('#' + label.getAttribute('for'));
|
var input = document.querySelector('#' + label.getAttribute('for'));
|
||||||
var parent = label.parentElement;
|
var parent = label.parentElement;
|
||||||
|
|||||||
@ -52,7 +52,8 @@ textarea:focus {
|
|||||||
.form-group {
|
.form-group {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(3, minmax(150px, max-content));
|
grid-template-columns: repeat(2, minmax(150px, max-content));
|
||||||
|
grid-auto-columns: minmax(150px, max-content);
|
||||||
grid-gap: 5px;
|
grid-gap: 5px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
@ -200,7 +201,7 @@ input[type="checkbox"]:checked::after {
|
|||||||
}
|
}
|
||||||
@media (max-width: 999px) {
|
@media (max-width: 999px) {
|
||||||
.form-group {
|
.form-group {
|
||||||
grid-template-rows: 30px auto;
|
grid-template-rows: 30px;
|
||||||
grid-template-columns: 1fr;
|
grid-template-columns: 1fr;
|
||||||
align-items: baseline;
|
align-items: baseline;
|
||||||
margin-top: 17px;
|
margin-top: 17px;
|
||||||
@ -230,6 +231,8 @@ input[type="file"] {
|
|||||||
}
|
}
|
||||||
.file-input__container {
|
.file-input__container {
|
||||||
grid-column-start: 2;
|
grid-column-start: 2;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
.file-input__label,
|
.file-input__label,
|
||||||
.file-input__remover {
|
.file-input__remover {
|
||||||
@ -272,8 +275,8 @@ input[type="file"] {
|
|||||||
height: 30px;
|
height: 30px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
background-color: var(--warningbase);
|
background-color: var(--warningbase);
|
||||||
grid-column-start: 3;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
.file-input__remover::before {
|
.file-input__remover::before {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -291,15 +294,11 @@ input[type="file"] {
|
|||||||
.file-input__container--valid > .file-input__label::after {
|
.file-input__container--valid > .file-input__label::after {
|
||||||
content: none;
|
content: none;
|
||||||
}
|
}
|
||||||
.file-input__container--valid + .file-input__remover {
|
.file-input__container--valid > .file-input__remover {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
@media (max-width: 999px) {
|
@media (max-width: 999px) {
|
||||||
.file-input__container,
|
.file-input__container {
|
||||||
.file-input__remover {
|
|
||||||
grid-column-start: 1;
|
grid-column-start: 1;
|
||||||
}
|
}
|
||||||
.file-input__remover {
|
|
||||||
justify-self: end;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user