ag-admin/OpenSlides
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Chyron template design

Browse Source
This commit is contained in:
Emanuel Schütze 2019-02-22 14:20:49 +01:00
parent f039293c09
commit c3b3b35cf0
6 changed files with 26 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/app/shared/components/projector/projector.component.html
View File

@ -1,6 +1,6 @@
<div id="container" [osResized]="resizeSubject" [ngStyle]="containerStyle" #container> <div id="container" [osResized]="resizeSubject" [ngStyle]="containerStyle" #container>
<div id="projector" [ngStyle]="projectorStyle"> <div id="projector" [ngStyle]="projectorStyle">
<div id="header" [ngStyle]="headerFooterStyle" *ngIf="projector.show_header_footer"> <div id="header" [ngStyle]="headerFooterStyle" *ngIf="projector && projector.show_header_footer">
<!-- projector logo --> <!-- projector logo -->
<img *ngIf="enableLogo && projectorLogo" src="{{ projectorLogo }}" class="projector-logo-main" /> <img *ngIf="enableLogo && projectorLogo" src="{{ projectorLogo }}" class="projector-logo-main" />
@ -19,7 +19,7 @@
<os-slide-container [slideData]="slide" [scroll]="scroll" [scale]="scale"></os-slide-container> <os-slide-container [slideData]="slide" [scroll]="scroll" [scale]="scale"></os-slide-container>
</div> </div>
<div id="footer" [ngStyle]="headerFooterStyle" *ngIf="projector.show_header_footer"> <div id="footer" [ngStyle]="headerFooterStyle" *ngIf="projector && projector.show_header_footer">
<div class="footertext"> <div class="footertext">
<span *ngIf="eventDate"> {{ eventDate }} </span> <span *ngIf="eventDate"> {{ eventDate }} </span>
<span *ngIf="eventDate && eventLocation"> | </span> <span *ngIf="eventDate && eventLocation"> | </span>

1
client/src/app/slides/agenda/common/common-list-of-speakers-slide.component.html
View File

@ -16,6 +16,7 @@
<div *ngIf="data.data.current" class="currentSpeaker"> <div *ngIf="data.data.current" class="currentSpeaker">
<mat-icon>mic</mat-icon> <mat-icon>mic</mat-icon>
<span>{{ data.data.current.user }}</span> <span>{{ data.data.current.user }}</span>
<mat-icon *ngIf="data.data.current.marked">star</mat-icon>
</div> </div>
<!-- Next speakers --> <!-- Next speakers -->

4
client/src/app/slides/agenda/current-speaker-chyron/current-speaker-chyron-slide.component.html
View File

@ -1,5 +1,5 @@
<div id="chyron" *ngIf="data"> <div id="chyron" *ngIf="data">
<div id="inner"> <span id="inner">
{{ data.data.current_speaker }} {{ data.data.current_speaker }}
</div> </span>
</div> </div>

15
client/src/app/slides/agenda/current-speaker-chyron/current-speaker-chyron-slide.component.scss
View File

@ -1,14 +1,19 @@
#chyron { #chyron {
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 1em; bottom: 0;
z-index: 10; z-index: 10;
width: 100%; width: 100%;
height: 100px;
font-size: 32px;
text-align: center;
line-height: 1.1;
display: table;
#inner { #inner {
background-color: green; display: table-cell;
padding: 12px; vertical-align: middle;
margin: 12px; padding-left: 20px;
font-size: 32px; padding-right: 20px;
} }
} }

8
client/src/assets/styles/global-components-style.scss
View File

@ -65,8 +65,14 @@
background-color: mat-color($background, app-bar); background-color: mat-color($background, app-bar);
} }
// drag & drop view /* drag & drop views */
.node-content-wrapper { .node-content-wrapper {
background-color: mat-color($background, app-bar); background-color: mat-color($background, app-bar);
} }
/* projector components */
#chyron {
background-color: mat-color($primary);
color: white; // TODO
}
} }

4
client/src/assets/styles/projector.scss
View File

@ -2,6 +2,10 @@
* { * {
font-family: customProjectorFont; font-family: customProjectorFont;
} }
.material-icons {
font-family: 'Material Icons';
}
h2 { h2 {
line-height: 40px; line-height: 40px;