optimize infobeamer layout
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
a009efe016
commit
48e4a254da
|
@ -311,6 +311,9 @@ table {
|
|||
.box-content {
|
||||
padding: $gap-vertical $gap-horizontal;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.box-footer {
|
||||
padding: ($gap-vertical / 2) $gap-horizontal;
|
||||
|
@ -338,3 +341,31 @@ table {
|
|||
.overflow-x-auto {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
|
||||
.infobeamer {
|
||||
h1 {
|
||||
margin: $gap-vertical 0;
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 1700px;
|
||||
}
|
||||
|
||||
.box-grid {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-auto-rows: minmax(10px, 1fr);
|
||||
max-height: 75vh;
|
||||
}
|
||||
}
|
||||
|
||||
.progress {
|
||||
@include aberration(0.1em);
|
||||
border: 1px solid $color-box-frame;
|
||||
height: 1em;
|
||||
|
||||
.fill {
|
||||
background: $color-box-frame;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -41,7 +41,7 @@
|
|||
return `
|
||||
<li class="box">
|
||||
<h2 class="box-header">${sanitize(talk.title)}</h2>
|
||||
<div class="box-content">
|
||||
<div class="box-content clamp-height">
|
||||
<p class="date">
|
||||
Speakers: ${sanitize(talk.persons.join(", ") || "---")}<br>
|
||||
Stage: ${sanitize(talk.room)}<br>
|
||||
|
@ -49,7 +49,9 @@
|
|||
Duration: ${sanitize(talk.duration)}<br>
|
||||
</p>
|
||||
<p>${sanitize(talk.abstract)}</p>
|
||||
<progress max="${max}" value="${value}">
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
<div class="progress"><div class="fill" style="width: ${value / max * 100}%"></div></div>
|
||||
</div>
|
||||
</li>`;
|
||||
}
|
||||
|
@ -97,13 +99,13 @@
|
|||
|
||||
setTimeout(main, (60-new Date().getSeconds())*1000+500);
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<body class="infobeamer">
|
||||
<header>
|
||||
<nav class="nav nav-main">
|
||||
<a class="nav-logo" href="/">
|
||||
<img src="/franconianNet.svg"
|
||||
<img src="/franconianNet.svg"
|
||||
alt="Logo of franconian.net">
|
||||
franconian.net
|
||||
</a>
|
||||
|
|
Loading…
Reference in New Issue